fj-dc-ui/.svn/pristine/3a/3a4c18f443879679a8bc5506401e5fa7e1092b23.svn-base

<template>
    <el-dialog
        title="添加行政区划"
        :visible.sync="dialogVisible"
        width="40%"
        append-to-body
        :before-close="handleClose">
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="添加乡/镇" name="town">
                <el-form :model="newDivisionForm" label-width="120px">
                    <el-form-item label="行政区划名称">
                        <el-input v-model="newDivisionForm.adName"  style="width:70%;"></el-input>
                    </el-form-item>
                    <el-form-item label="操作">
                        <el-button @click="handleClose">取 消</el-button>
                        <el-button type="primary" @click="submitInsert">确 定</el-button>
                    </el-form-item>
                </el-form>
            </el-tab-pane>
            <el-tab-pane label="添加村" name="village">
                <el-form :model="newDivisionForm" label-width="120px">
                    <el-form-item label="行政区划名称">
                        <el-input v-model="newDivisionForm.adName"  style="width:70%;"></el-input>
                    </el-form-item>
                    <el-form-item label="所属乡镇">
                        <el-select v-model="townCode" placeholder="请选择">
                            <el-option
                            v-for="item in townsList"
                            :key="item.adCode"
                            :label="item.adName"
                            :value="item.adCode">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="操作">
                        <el-button @click="handleClose">取 消</el-button>
                        <el-button type="primary" @click="submitInsert">确 定</el-button>
                    </el-form-item>
                </el-form>
            </el-tab-pane>
        </el-tabs>
    </el-dialog>
</template>
<script>
import { submitInsertCun } from "@api/duChaTianBao.js";
import { getAdXBaseData } from "@api/duChaAPI.js";
export default {
    props: {
        // 县级的行政区划代码
        rootCode:{}
    },
    data(){
        return {
            activeName: 'town',
            newDivisionForm:{
                "adAbbrName": "",
                "adFcode": "",
                "adFullName": "",
                "adName": ""
            },
            townsList: [],
            townCode: '',
            adCode: '',
            dialogVisible: true
        }
    },
    mounted(){
        this.adCode = this.rootCode
    },
    methods:{
        submitInsert(){
            if(this.activeName == "town"){
                if(!this.newDivisionForm.adName){
                    this.$message.warning('添加乡/镇不能为空');
                    return;
                }
            }else{
                if(!this.newDivisionForm.adName && !this.townCode){
                    this.$message.warning('添加村或所属乡镇不能为空');
                    return;
                }
            }
            if(this.townCode) this.adCode = this.townCode
            submitInsertCun(this.newDivisionForm.adName,this.adCode).then(
                (res) => {
                    this. newDivisionForm={
                        "adAbbrName": "",
                        "adFcode": "",
                        "adFullName": "",
                        "adName": "",
                    };
                    this.$emit('addSuccess')
                }
            );
        },
        // 获取乡镇列表数据
        getTownsList(){
            let adCode = this.rootCode
            getAdXBaseData(adCode).then(
                (res) => {
                    if (res.success && res.data) {
                        this.townsList = res.data;
                    } else {
                        this.townsList = [];
                    }
                },
                (err) => {
                }
            );
        },
        handleClose(){
            this.$emit('handleClose')
        },
        handleClick(val){
            if(val.name == 'village'){
                this.adCode = this.townCode
                this.getTownsList()
            }else{
                this.adCode = this.rootCode
                this.townCode = ''
            }
        }
    }
}
</script>
<style lang="scss">
    
</style>