diff --git a/jnpf-java-boot/jnpf-web/src/utils/apiUrl.js b/jnpf-java-boot/jnpf-web/src/utils/apiUrl.js
index ee0d929..e156057 100644
--- a/jnpf-java-boot/jnpf-web/src/utils/apiUrl.js
+++ b/jnpf-java-boot/jnpf-web/src/utils/apiUrl.js
@@ -1,8 +1,8 @@
 /*
  * @Author: 王文杰
  * @Date: 2024-02-02 14:19:40
- * @LastEditors: 王文杰
- * @LastEditTime: 2024-02-29 14:40:37
+ * @LastEditors: jevononlie 728254585@qq.com
+ * @LastEditTime: 2024-05-17 17:43:12
  * @FilePath: /jnpf-web/src/utils/apiUrl.js
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -10,5 +10,5 @@ module.exports = {
   // 开发环境接口配置
   // APIURl: 'http://127.0.0.1:30000'
   // 测试环境接口配置
-  APIURl: 'http://222.71.165.187:30000'
-}
\ No newline at end of file
+  APIURl: 'http://192.168.0.23:30000'
+}
diff --git a/jnpf-java-boot/jnpf-web/src/views/stationarea/areaDialog.vue b/jnpf-java-boot/jnpf-web/src/views/stationarea/areaDialog.vue
new file mode 100644
index 0000000..b158879
--- /dev/null
+++ b/jnpf-java-boot/jnpf-web/src/views/stationarea/areaDialog.vue
@@ -0,0 +1,43 @@
+<template>
+  <el-dialog title="电子围栏" :visible="true" top="20vh" width="50%" append-to-body modal-append-to-body
+    :before-close="handleClose" class="my-dialog">
+    <div class="cont">112</div>
+  </el-dialog>
+</template>
+
+<script>
+import request from '@/utils/request'
+import { mapGetters } from "vuex";
+
+export default {
+  components: {
+  },
+  props: [],
+  data() {
+    return {
+      visible: true,
+      loading: false,
+    }
+  },
+  computed: {
+    ...mapGetters(['userInfo'])
+  },
+  watch: {},
+  created() {
+  },
+  mounted() { },
+  methods: {
+    handleClose() {
+      this.$emit('areaVisibleChange', false)
+    }
+  },
+}
+</script>
+<style lang="scss" scoped>
+  .my-dialog {
+    .cont {
+      min-height: 600px;
+    }
+  }
+
+</style>
diff --git a/jnpf-java-boot/jnpf-web/src/views/stationarea/form.vue b/jnpf-java-boot/jnpf-web/src/views/stationarea/form.vue
index f6dd5a4..9c5989b 100644
--- a/jnpf-java-boot/jnpf-web/src/views/stationarea/form.vue
+++ b/jnpf-java-boot/jnpf-web/src/views/stationarea/form.vue
@@ -1,100 +1,103 @@
 
 
 
-    <template>
-        <el-dialog :title="!dataForm.id ? '新建' :'编辑'"
-                   :close-on-click-modal="false" append-to-body
-                   :visible.sync="visible" class="JNPF-dialog JNPF-dialog_center" lock-scroll
-                   width="600px">
-        <el-row :gutter="15" class="">
-    <el-form ref="formRef" :model="dataForm" :rules="dataRule" size="small" label-width="100px" label-position="right" >
-    <template v-if="!loading">
-        <!-- 具体表单 -->
-        <el-col :span="24" >
-        <jnpf-form-tip-item
- label="区域名称"  tipLabel="围栏区域名称"   prop="areaName" >
-        <JnpfInput   v-model="dataForm.areaName" @change="changeData('areaName',-1)" 
- placeholder="电子围栏名称"  clearable  :style='{"width":"100%"}'>
-    </JnpfInput>
-    </jnpf-form-tip-item>
-        </el-col>
-        <el-col :span="24" >
-        <jnpf-form-tip-item
- label="区域类型"  tipLabel="请选择围栏类型"   prop="areaType" >
-        <JnpfSelect   v-model="dataForm.areaType" @change="changeData('areaType',-1)" 
- placeholder="请选择围栏类型"  clearable  :style='{"width":"100%"}' :options="areaTypeOptions" :props="areaTypeProps" >
-    </JnpfSelect>
-    </jnpf-form-tip-item>
-        </el-col>
-        <el-col :span="24" >
-        <jnpf-form-tip-item
- label="是否启用"   prop="status" >
-        <JnpfRadio   v-model="dataForm.status" @change="changeData('status',-1)" 
- optionType="default"  direction="horizontal"  size="small"  :options="statusOptions" :props="statusProps" >
-    </JnpfRadio>
-    </jnpf-form-tip-item>
-        </el-col>
-        <el-col :span="24" >
-        <jnpf-form-tip-item
- label="所属回收站"   prop="stationCode" >
-        <JnpfSelect   v-model="dataForm.stationCode" @change="changeData('stationCode',-1)" 
- placeholder="选择本组织回收站进行绑定"  clearable  :style='{"width":"100%"}' :options="stationCodeOptions" :props="stationCodeProps" >
-    </JnpfSelect>
-    </jnpf-form-tip-item>
-        </el-col>
-        <el-col :span="24" >
-        <jnpf-form-tip-item
- label="地图信息"  tipLabel="在地图上绘制电子围栏"   prop="areaMapInfo" >
-        <JnpfInput   v-model="dataForm.areaMapInfo" @change="changeData('areaMapInfo',-1)" 
- placeholder="绘制电子围栏区域"  disabled  :maxlength="65539"  clearable  prefix-icon='ym-custom ym-custom-google-maps'  :style='{"width":"100%"}' show-password >
-    </JnpfInput>
-    </jnpf-form-tip-item>
-        </el-col>
-        <el-col :span="24" >
-        <jnpf-form-tip-item
- label="区域描述"  tipLabel="请输入区域描述"   prop="areaDesc" >
-        <JnpfTextarea   v-model="dataForm.areaDesc" @change="changeData('areaDesc',-1)" 
- placeholder="请输入不超过两百字的标题描述"  :style='{"width":"100%"}' true  type="textarea"  :autosize='{"minRows":4,"maxRows":4}' >
-    </JnpfTextarea>
-    </jnpf-form-tip-item>
-        </el-col>
-        <!-- 表单结束 -->
-    </template>
-    </el-form>
-    <SelectDialog v-if="selectDialogVisible" :config="currTableConf" :formData="dataForm"
-                  ref="selectDialog" @select="addForSelect" @close="selectDialogVisible=false"/>
+<template>
+  <el-dialog :title="!dataForm.id ? '新建' :'编辑'" modal-append-to-body="false" :close-on-click-modal="false"
+    append-to-body :visible.sync="visible" class="JNPF-dialog JNPF-dialog_center" lock-scroll width="600px">
+    <el-row :gutter="15" class="">
+      <el-form ref="formRef" :model="dataForm" :rules="dataRule" size="small" label-width="100px"
+        label-position="right">
+        <template v-if="!loading">
+          {{ areaVisible }}
+          <!-- 具体表单 -->
+          <el-col :span="24">
+            <jnpf-form-tip-item label="区域名称" tipLabel="围栏区域名称" prop="areaName">
+              <JnpfInput v-model="dataForm.areaName" @change="changeData('areaName',-1)" placeholder="电子围栏名称" clearable
+                :style='{"width":"100%"}'>
+              </JnpfInput>
+            </jnpf-form-tip-item>
+          </el-col>
+          <el-col :span="24">
+            <jnpf-form-tip-item label="区域类型" tipLabel="请选择围栏类型" prop="areaType">
+              <JnpfSelect v-model="dataForm.areaType" @change="changeData('areaType',-1)" placeholder="请选择围栏类型"
+                clearable :style='{"width":"100%"}' :options="areaTypeOptions" :props="areaTypeProps">
+              </JnpfSelect>
+            </jnpf-form-tip-item>
+          </el-col>
+          <el-col :span="24">
+            <jnpf-form-tip-item label="是否启用" prop="status">
+              <JnpfRadio v-model="dataForm.status" @change="changeData('status',-1)" optionType="default"
+                direction="horizontal" size="small" :options="statusOptions" :props="statusProps">
+              </JnpfRadio>
+            </jnpf-form-tip-item>
+          </el-col>
+          <el-col :span="24">
+            <jnpf-form-tip-item label="所属回收站" prop="stationCode">
+              <JnpfSelect v-model="dataForm.stationCode" @change="changeData('stationCode',-1)"
+                placeholder="选择本组织回收站进行绑定" clearable :style='{"width":"100%"}' :options="stationCodeOptions"
+                :props="stationCodeProps">
+              </JnpfSelect>
+            </jnpf-form-tip-item>
+          </el-col>
+          <el-col :span="24">
+            <jnpf-form-tip-item label="地图信息" tipLabel="在地图上绘制电子围栏" prop="areaMapInfo">
+              <JnpfInput @focus="handLeArea" v-model="dataForm.areaMapInfo" placeholder="绘制电子围栏区域" :maxlength="65539"
+                readonly prefix-icon='ym-custom ym-custom-google-maps' :style='{"width":"100%"}'>
+              </JnpfInput>
+            </jnpf-form-tip-item>
+          </el-col>
+          <el-col :span="24">
+            <jnpf-form-tip-item label="区域描述" tipLabel="请输入区域描述" prop="areaDesc">
+              <JnpfTextarea v-model="dataForm.areaDesc" @change="changeData('areaDesc',-1)" placeholder="请输入不超过两百字的标题描述"
+                :style='{"width":"100%"}' true type="textarea" :autosize='{"minRows":4,"maxRows":4}'>
+              </JnpfTextarea>
+            </jnpf-form-tip-item>
+          </el-col>
+          <!-- <el-dialog title="登录" v-if="areaVisible" :visible="true" top="20vh" width="30%" append-to-body
+            modal-append-to-body>
+          </el-dialog> -->
+          <area-dialog v-if="areaVisible" @areaVisibleChange="handleAreaVisibleChange" ref="JNPFForm" />
+          <!-- 表单结束 -->
+        </template>
+      </el-form>
+      <SelectDialog v-if="1" :config="currTableConf" :formData="dataForm" ref="selectDialog" @select="addForSelect"
+        @close="selectDialogVisible=false" />
+
     </el-row>
     <span slot="footer" class="dialog-footer">
-                    <div class="upAndDown-button" v-if="dataForm.id">
-                <el-button @click="prev" :disabled='prevDis'>
-                  {{'上一条'}}
-                </el-button>
-                <el-button @click="next" :disabled='nextDis'>
-                  {{'下一条'}}
-                </el-button>
-              </div>
-                <el-button type="primary" @click="dataFormSubmit(2)" :loading="continueBtnLoading">
-            {{!dataForm.id ?'确定并新增':'确定并继续'}}</el-button>
-              <el-button @click="visible = false"> 取 消</el-button>
-              <el-button type="primary" @click="dataFormSubmit()" :loading="btnLoading"> 确 定</el-button>
-        </span>
-    </el-dialog>
-    </template>
-
+      <div class="upAndDown-button" v-if="dataForm.id">
+        <el-button @click="prev" :disabled='prevDis'>
+          {{'上一条'}}
+        </el-button>
+        <el-button @click="next" :disabled='nextDis'>
+          {{'下一条'}}
+        </el-button>
+      </div>
+      <el-button type="primary" @click="dataFormSubmit(2)" :loading="continueBtnLoading">
+        {{!dataForm.id ?'确定并新增':'确定并继续'}}</el-button>
+      <el-button @click="visible = false"> 取 消</el-button>
+      <el-button type="primary" @click="dataFormSubmit()" :loading="btnLoading"> 确 定</el-button>
+    </span>
+  </el-dialog>
+</template>
 
 <script>
-    import request from '@/utils/request'
-    import {mapGetters} from "vuex";
-    import { getDataInterfaceRes } from '@/api/systemData/dataInterface'
-    import { getDictionaryDataSelector } from '@/api/systemData/dictionary'
-    import { getDefaultCurrentValueUserId } from '@/api/permission/user'
-    import { getDefaultCurrentValueDepartmentId } from '@/api/permission/organize'
-    import { getDateDay, getLaterData, getBeforeData, getBeforeTime, getLaterTime } from '@/components/Generator/utils/index.js'
-    import { thousandsFormat } from "@/components/Generator/utils/index"
-    export default {
-        components: { },
-        props: [],
-        data() {
+import areaDialog from './areaDialog'
+import request from '@/utils/request'
+import { mapGetters } from "vuex";
+import { getDataInterfaceRes } from '@/api/systemData/dataInterface'
+import { getDictionaryDataSelector } from '@/api/systemData/dictionary'
+import { getDefaultCurrentValueUserId } from '@/api/permission/user'
+import { getDefaultCurrentValueDepartmentId } from '@/api/permission/organize'
+import { getDateDay, getLaterData, getBeforeData, getBeforeTime, getLaterTime } from '@/components/Generator/utils/index.js'
+import { thousandsFormat } from "@/components/Generator/utils/index"
+
+export default {
+    components: {
+      areaDialog
+    },
+    props: [],
+    data() {
         return {
             dataFormSubmitType: 0,
             continueBtnLoading: false,
@@ -106,413 +109,405 @@
             loading: false,
             btnLoading: false,
             formRef: 'formRef',
-            setting:{},
+            setting: {},
             eventType: '',
-            userBoxVisible:false,
+            userBoxVisible: false,
             selectDialogVisible: false,
-            currTableConf:{},
-            dataValueAll:{},
-            addTableConf:{
-            },
+            currTableConf: {},
+            dataValueAll: {},
+            addTableConf: {},
             //可选范围默认值
-            ableAll:{
-            },
-        tableRows:{
-        },
-            Vmodel:"",
-            currVmodel:"",
+            ableAll: {},
+            tableRows: {},
+            Vmodel: "",
+            currVmodel: "",
             dataForm: {
-                                areaName : undefined,
-                                    areaType : "1",
-                                    status : "1",
-                                    stationCode : undefined,
-                                areaMapInfo : undefined,
-                                areaDesc : undefined,
+                areaName: undefined,
+                areaType: "1",
+                status: "1",
+                stationCode: undefined,
+                areaMapInfo: undefined,
+                areaDesc: undefined,
             },
             tableRequiredData: {},
-            dataRule:
-            {
-                            areaName: [
-                                {
-                                    required: true,
-                                    message: '电子围栏名称',
-                                    trigger: 'blur'
-                                },
-                        ],
-                            areaType: [
-                                {
-                                    required: true,
-                                    message: '请至少选择一个',
-                                    trigger: 'change'
-                                },
-                        ],
-                            status: [
-                                {
-                                    required: true,
-                                    message: '请至少选择一个',
-                                    trigger: 'change'
-                                },
-                        ],
-                            stationCode: [
-                                {
-                                    required: true,
-                                    message: '选择本组织回收站进行绑定',
-                                    trigger: 'change'
-                                },
-                        ],
-                            areaMapInfo: [
-                                {
-                                    required: true,
-                                    message: '绘制电子围栏区域',
-                                    trigger: 'blur'
-                                },
-                        ],
+            dataRule: {
+                areaName: [{
+                    required: true,
+                    message: '电子围栏名称',
+                    trigger: 'blur'
+                }, ],
+                areaType: [{
+                    required: true,
+                    message: '请至少选择一个',
+                    trigger: 'change'
+                }, ],
+                status: [{
+                    required: true,
+                    message: '请至少选择一个',
+                    trigger: 'change'
+                }, ],
+                stationCode: [{
+                    required: true,
+                    message: '选择本组织回收站进行绑定',
+                    trigger: 'change'
+                }, ],
+                areaMapInfo: [{
+                    required: true,
+                    message: '绘制电子围栏区域',
+                    trigger: 'blur'
+                }, ],
             },
-                    areaTypeOptions:[],
-                            areaTypeProps:{"label":"fullName","value":"enCode"  },
-                    statusOptions:[],
-                            statusProps:{"label":"fullName","value":"enCode"  },
-                    stationCodeOptions:[],
-                            stationCodeProps:{"label":"fullName","value":"id"  },
-            childIndex:-1,
-                    isEdit:false,
-                    interfaceRes: {
-                        areaName:[] ,
-                        areaType:[] ,
-                        status:[] ,
-                        stationCode:[] ,
-                        areaMapInfo:[] ,
-                        areaDesc:[] ,
+            areaTypeOptions: [],
+            areaTypeProps: { "label": "fullName", "value": "enCode" },
+            statusOptions: [],
+            statusProps: { "label": "fullName", "value": "enCode" },
+            stationCodeOptions: [],
+            stationCodeProps: { "label": "fullName", "value": "id" },
+            childIndex: -1,
+            isEdit: false,
+            interfaceRes: {
+                areaName: [],
+                areaType: [],
+                status: [],
+                stationCode: [],
+                areaMapInfo: [],
+                areaDesc: [],
             },
+            areaVisible: false
         }
-        },
-        computed: {
-            ...mapGetters(['userInfo'])
-        },
-        watch: {},
-        created() {
-            this.dataAll()
-            this.initDefaultData()
-            this.dataValueAll = JSON.parse(JSON.stringify(this.dataForm))
-        },
-        mounted() {},
-        methods: {
-            prev() {
-                this.index--
+    },
+    computed: {
+        ...mapGetters(['userInfo'])
+    },
+    watch: {},
+    created() {
+        this.dataAll()
+        this.initDefaultData()
+        this.dataValueAll = JSON.parse(JSON.stringify(this.dataForm))
+    },
+    mounted() {},
+    methods: {
+        prev() {
+            this.index--
                 if (this.index === 0) {
                     this.prevDis = true
                 }
-                this.nextDis = false
-                for (let index = 0; index < this.allList.length; index++) {
-                    const element = this.allList[index];
-                    if (this.index == index) {
-                        this.getInfo(element.id)
-                    }
+            this.nextDis = false
+            for (let index = 0; index < this.allList.length; index++) {
+                const element = this.allList[index];
+                if (this.index == index) {
+                    this.getInfo(element.id)
                 }
-            },
-            next() {
-                this.index++
+            }
+        },
+        next() {
+            this.index++
                 if (this.index === this.allList.length - 1) {
                     this.nextDis = true
                 }
-                this.prevDis = false
-                for (let index = 0; index < this.allList.length; index++) {
-                    const element = this.allList[index];
-                    if (this.index == index) {
-                        this.getInfo(element.id)
-                    }
-                }
-            },
-            getInfo(id) {
-                request({
-                    url: '/api/scm/StationArea/'+ id,
-                    method: 'get'
-                }).then(res => {
-                    this.dataInfo(res.data)
-                });
-            },
-            goBack() {
-                this.visible = false
-                this.$emit('refreshDataList', true)
-            },
-            changeData(model, index) {
-                this.isEdit = false
-                this.childIndex = index
-                let modelAll = model.split("-");
-                let faceMode = "";
-                for (let i = 0; i < modelAll.length; i++) {
-                    faceMode += modelAll[i];
+            this.prevDis = false
+            for (let index = 0; index < this.allList.length; index++) {
+                const element = this.allList[index];
+                if (this.index == index) {
+                    this.getInfo(element.id)
                 }
-                for (let key in this.interfaceRes) {
-                    if (key != faceMode) {
-                        let faceReList = this.interfaceRes[key]
-                        for (let i = 0; i < faceReList.length; i++) {
-                            if (faceReList[i].relationField == model) {
-                                let options = 'get' + key + 'Options';
-                                if(this[options]){
-                                    this[options]()
-                                }
-                                this.changeData(key, index)
+            }
+        },
+        getInfo(id) {
+            request({
+                url: '/api/scm/StationArea/' + id,
+                method: 'get'
+            }).then(res => {
+                this.dataInfo(res.data)
+            });
+        },
+        goBack() {
+            this.visible = false
+            this.$emit('refreshDataList', true)
+        },
+        handLeArea() {
+          this.areaVisible = true
+        },
+        changeData(model, index) {
+            this.isEdit = false
+            this.childIndex = index
+            let modelAll = model.split("-");
+            let faceMode = "";
+            for (let i = 0; i < modelAll.length; i++) {
+                faceMode += modelAll[i];
+            }
+            for (let key in this.interfaceRes) {
+                if (key != faceMode) {
+                    let faceReList = this.interfaceRes[key]
+                    for (let i = 0; i < faceReList.length; i++) {
+                        if (faceReList[i].relationField == model) {
+                            let options = 'get' + key + 'Options';
+                            if (this[options]) {
+                                this[options]()
                             }
+                            this.changeData(key, index)
                         }
                     }
                 }
-            },
-            changeDataFormData(type, data, model,index,defaultValue) {
-                if(!this.isEdit) {
-                    if (type == 2) {
-                        for (let i = 0; i < this.dataForm[data].length; i++) {
-                            if (index == -1) {
-                                this.dataForm[data][i][model] = defaultValue
-                            } else if (index == i) {
-                                this.dataForm[data][i][model] = defaultValue
-                            }
+            }
+        },
+        changeDataFormData(type, data, model, index, defaultValue) {
+            if (!this.isEdit) {
+                if (type == 2) {
+                    for (let i = 0; i < this.dataForm[data].length; i++) {
+                        if (index == -1) {
+                            this.dataForm[data][i][model] = defaultValue
+                        } else if (index == i) {
+                            this.dataForm[data][i][model] = defaultValue
                         }
-                    } else {
-                        this.dataForm[data] = defaultValue
                     }
+                } else {
+                    this.dataForm[data] = defaultValue
                 }
-            },
-            dataAll(){
-                        this.getareaTypeOptions();
-                        this.getstatusOptions();
-                        this.getstationCodeOptions();
-            },
-                    getareaTypeOptions() {
-                    getDictionaryDataSelector('560423985691492677').then(res => {
-                        this.areaTypeOptions = res.data.list
-                    })
-                },
-                    getstatusOptions() {
-                    getDictionaryDataSelector('519107761586309125').then(res => {
-                        this.statusOptions = res.data.list
-                    })
-                },
-                    getstationCodeOptions() {
-                    const index = this.childIndex
-                    let templateJsonList = JSON.parse(JSON.stringify(this.interfaceRes.stationCode))
-                    for (let i = 0; i < templateJsonList.length; i++) {
-                        let json = templateJsonList[i];
-                        if(json.relationField){
-                            let relationFieldAll = json.relationField.split("-");
-                            let val = json.defaultValue;
-                            if(relationFieldAll.length>1 && index>-1){
-                                val = this.dataForm[relationFieldAll[0]+'List']&&this.dataForm[relationFieldAll[0]+'List'].length?this.dataForm[relationFieldAll[0]+'List'][index][relationFieldAll[1]]:''
-                            }else {
-                                val = this.dataForm[relationFieldAll]
-                            }
-                            json.defaultValue = val
-                        }
-                    }
-                    let template ={
-                        paramList:templateJsonList
-                    }
-                    getDataInterfaceRes('520259300875047493',template).then(res => {
-                        let data = res.data
-                        this.stationCodeOptions = data
-                        this.changeDataFormData(1,'stationCode','stationCode',index,'')
-                    })
-                },
-            clearData(){
-                this.dataForm = JSON.parse(JSON.stringify(this.dataValueAll))
-            },
-            init(id,isDetail,allList) {
-                this.prevDis = false
-                this.nextDis = false
-                this.allList = allList || []
-                if (allList.length) {
-                    this.index = this.allList.findIndex(item => item.id === id)
-                    if (this.index == 0) {
-                        this.prevDis = true
-                    }
-                    if (this.index == this.allList.length - 1) {
-                        this.nextDis = true
+            }
+        },
+        dataAll() {
+            this.getareaTypeOptions();
+            this.getstatusOptions();
+            this.getstationCodeOptions();
+        },
+        getareaTypeOptions() {
+            getDictionaryDataSelector('560423985691492677').then(res => {
+                this.areaTypeOptions = res.data.list
+            })
+        },
+        getstatusOptions() {
+            getDictionaryDataSelector('519107761586309125').then(res => {
+                this.statusOptions = res.data.list
+            })
+        },
+        getstationCodeOptions() {
+            const index = this.childIndex
+            let templateJsonList = JSON.parse(JSON.stringify(this.interfaceRes.stationCode))
+            for (let i = 0; i < templateJsonList.length; i++) {
+                let json = templateJsonList[i];
+                if (json.relationField) {
+                    let relationFieldAll = json.relationField.split("-");
+                    let val = json.defaultValue;
+                    if (relationFieldAll.length > 1 && index > -1) {
+                        val = this.dataForm[relationFieldAll[0] + 'List'] && this.dataForm[relationFieldAll[0] + 'List'].length ? this.dataForm[relationFieldAll[0] + 'List'][index][relationFieldAll[1]] : ''
+                    } else {
+                        val = this.dataForm[relationFieldAll]
                     }
-                } else {
+                    json.defaultValue = val
+                }
+            }
+            let template = {
+                paramList: templateJsonList
+            }
+            getDataInterfaceRes('520259300875047493', template).then(res => {
+                let data = res.data
+                this.stationCodeOptions = data
+                this.changeDataFormData(1, 'stationCode', 'stationCode', index, '')
+            })
+        },
+        clearData() {
+            this.dataForm = JSON.parse(JSON.stringify(this.dataValueAll))
+        },
+        init(id, isDetail, allList) {
+            this.prevDis = false
+            this.nextDis = false
+            this.allList = allList || []
+            if (allList.length) {
+                this.index = this.allList.findIndex(item => item.id === id)
+                if (this.index == 0) {
                     this.prevDis = true
+                }
+                if (this.index == this.allList.length - 1) {
                     this.nextDis = true
                 }
-                this.dataForm.id = id || 0;
-                this.visible = true;
-                this.$nextTick(() => {
-                    if(this.dataForm.id){
-                        this.loading = true
-                        request({
-                            url: '/api/scm/StationArea/'+this.dataForm.id,
-                            method: 'get'
-                        }).then(res => {
-                            this.dataInfo(res.data)
-                            this.loading = false
-                        });
-                    }else{
-                        this.clearData()
-                        this.initDefaultData()
-                    }
-                });
-                this.$store.commit('generator/UPDATE_RELATION_DATA', {})
-            },
-            //初始化默认数据
-            initDefaultData() {
-
-            },
-            // 表单提交
-            dataFormSubmit(type) {
-                this.dataFormSubmitType = type ? type : 0
-                this.$refs['formRef'].validate((valid) => {
-                    if (valid) {
-                        this.request()
-                    }
-                })
-            },
-            request() {
-                let _data =this.dataList()
-                if (this.dataFormSubmitType == 2) {
-                    this.continueBtnLoading = true
+            } else {
+                this.prevDis = true
+                this.nextDis = true
+            }
+            this.dataForm.id = id || 0;
+            this.visible = true;
+            this.$nextTick(() => {
+                if (this.dataForm.id) {
+                    this.loading = true
+                    request({
+                        url: '/api/scm/StationArea/' + this.dataForm.id,
+                        method: 'get'
+                    }).then(res => {
+                        this.dataInfo(res.data)
+                        this.loading = false
+                    });
                 } else {
-                    this.btnLoading = true
+                    this.clearData()
+                    this.initDefaultData()
                 }
-                if (!this.dataForm.id) {
-                    request({
-                        url: '/api/scm/StationArea',
-                        method: 'post',
-                        data: _data
-                    }).then((res) => {
-                        this.$message({
-                            message: res.msg,
-                            type: 'success',
-                            duration: 1000,
-                            onClose: () => {
-                                if (this.dataFormSubmitType == 2) {
-                                    this.$nextTick(() => {
-                                        this.clearData()
-                                        this.initDefaultData()
-                                    })
-                                    this.continueBtnLoading = false
-                                    return
-                                }
-                                this.visible = false
-                                this.btnLoading = false
-                                this.$emit('refresh', true)
+            });
+            this.$store.commit('generator/UPDATE_RELATION_DATA', {})
+        },
+        //初始化默认数据
+        initDefaultData() {
+
+        },
+        // 表单提交
+        dataFormSubmit(type) {
+            this.dataFormSubmitType = type ? type : 0
+            this.$refs['formRef'].validate((valid) => {
+                if (valid) {
+                    this.request()
+                }
+            })
+        },
+        request() {
+            let _data = this.dataList()
+            if (this.dataFormSubmitType == 2) {
+                this.continueBtnLoading = true
+            } else {
+                this.btnLoading = true
+            }
+            if (!this.dataForm.id) {
+                request({
+                    url: '/api/scm/StationArea',
+                    method: 'post',
+                    data: _data
+                }).then((res) => {
+                    this.$message({
+                        message: res.msg,
+                        type: 'success',
+                        duration: 1000,
+                        onClose: () => {
+                            if (this.dataFormSubmitType == 2) {
+                                this.$nextTick(() => {
+                                    this.clearData()
+                                    this.initDefaultData()
+                                })
+                                this.continueBtnLoading = false
+                                return
                             }
-                        })
-                    }).catch(()=>{
-                        this.btnLoading = false
-                        this.continueBtnLoading = false
+                            this.visible = false
+                            this.btnLoading = false
+                            this.$emit('refresh', true)
+                        }
                     })
-                }else{
-                    request({
-                        url: '/api/scm/StationArea/'+this.dataForm.id,
-                        method: 'PUT',
-                        data: _data
-                    }).then((res) => {
-                        this.$message({
-                            message: res.msg,
-                            type: 'success',
-                            duration: 1000,
-                            onClose: () => {
-                                if (this.dataFormSubmitType == 2) return this.continueBtnLoading = false
-                                this.visible = false
-                                this.btnLoading = false
-                                this.$emit('refresh', true)
-                            }
-                        })
-                    }).catch(()=>{
-                        this.btnLoading = false
-                        this.continueBtnLoading = false
+                }).catch(() => {
+                    this.btnLoading = false
+                    this.continueBtnLoading = false
+                })
+            } else {
+                request({
+                    url: '/api/scm/StationArea/' + this.dataForm.id,
+                    method: 'PUT',
+                    data: _data
+                }).then((res) => {
+                    this.$message({
+                        message: res.msg,
+                        type: 'success',
+                        duration: 1000,
+                        onClose: () => {
+                            if (this.dataFormSubmitType == 2) return this.continueBtnLoading = false
+                            this.visible = false
+                            this.btnLoading = false
+                            this.$emit('refresh', true)
+                        }
                     })
-                }
-            },
-            openSelectDialog(key) {
-                this.currTableConf=this.addTableConf[key]
-                this.currVmodel=key
-                this.selectDialogVisible = true
-                this.$nextTick(() => {
-                    this.$refs.selectDialog.init()
+                }).catch(() => {
+                    this.btnLoading = false
+                    this.continueBtnLoading = false
                 })
-            },
-            addForSelect(data) {
-                for (let i = 0; i < data.length; i++) {
-                    let t = data[i]
-                    if(this['get'+this.currVmodel]){
-                        this['get'+this.currVmodel](t)
-                    }
+            }
+        },
+        openSelectDialog(key) {
+            this.currTableConf = this.addTableConf[key]
+            this.currVmodel = key
+            this.selectDialogVisible = true
+            this.$nextTick(() => {
+                this.$refs.selectDialog.init()
+            })
+        },
+        addForSelect(data) {
+            for (let i = 0; i < data.length; i++) {
+                let t = data[i]
+                if (this['get' + this.currVmodel]) {
+                    this['get' + this.currVmodel](t)
                 }
-            },
-            dateTime(timeRule, timeType, timeTarget, timeValueData, dataValue) {
-                let timeDataValue = null;
-                let timeValue = Number(timeValueData)
-                if (timeRule) {
-                    if (timeType == 1) {
-                        timeDataValue = timeValue
-                    } else if (timeType == 2) {
-                        timeDataValue = dataValue
-                    } else if (timeType == 3) {
-                        timeDataValue = new Date().getTime()
-                    } else if (timeType == 4) {
-                        let previousDate = '';
-                        if (timeTarget == 1 || timeTarget == 2) {
-                            previousDate = getDateDay(timeTarget, timeType, timeValue)
-                            timeDataValue = new Date(previousDate).getTime()
-                        } else if (timeTarget == 3) {
-                            previousDate = getBeforeData(timeValue)
-                            timeDataValue = new Date(previousDate).getTime()
-                        } else {
-                            timeDataValue = getBeforeTime(timeTarget, timeValue).getTime()
-                        }
-                    } else if (timeType == 5) {
-                        let previousDate = '';
-                        if (timeTarget == 1 || timeTarget == 2) {
-                            previousDate = getDateDay(timeTarget, timeType, timeValue)
-                            timeDataValue = new Date(previousDate).getTime()
-                        } else if (timeTarget == 3) {
-                            previousDate = getLaterData(timeValue)
-                            timeDataValue = new Date(previousDate).getTime()
-                        } else {
-                            timeDataValue = getLaterTime(timeTarget, timeValue).getTime()
-                        }
+            }
+        },
+        dateTime(timeRule, timeType, timeTarget, timeValueData, dataValue) {
+            let timeDataValue = null;
+            let timeValue = Number(timeValueData)
+            if (timeRule) {
+                if (timeType == 1) {
+                    timeDataValue = timeValue
+                } else if (timeType == 2) {
+                    timeDataValue = dataValue
+                } else if (timeType == 3) {
+                    timeDataValue = new Date().getTime()
+                } else if (timeType == 4) {
+                    let previousDate = '';
+                    if (timeTarget == 1 || timeTarget == 2) {
+                        previousDate = getDateDay(timeTarget, timeType, timeValue)
+                        timeDataValue = new Date(previousDate).getTime()
+                    } else if (timeTarget == 3) {
+                        previousDate = getBeforeData(timeValue)
+                        timeDataValue = new Date(previousDate).getTime()
+                    } else {
+                        timeDataValue = getBeforeTime(timeTarget, timeValue).getTime()
+                    }
+                } else if (timeType == 5) {
+                    let previousDate = '';
+                    if (timeTarget == 1 || timeTarget == 2) {
+                        previousDate = getDateDay(timeTarget, timeType, timeValue)
+                        timeDataValue = new Date(previousDate).getTime()
+                    } else if (timeTarget == 3) {
+                        previousDate = getLaterData(timeValue)
+                        timeDataValue = new Date(previousDate).getTime()
+                    } else {
+                        timeDataValue = getLaterTime(timeTarget, timeValue).getTime()
                     }
                 }
-                return timeDataValue;
-            },
-            time(timeRule, timeType, timeTarget, timeValue, formatType, dataValue) {
-                let format = formatType == 'HH:mm' ? 'HH:mm:00' : formatType
-                let timeDataValue = null
-                if (timeRule) {
-                    if (timeType == 1) {
-                        timeDataValue = timeValue || '00:00:00'
-                        if (timeDataValue.split(':').length == 3) {
-                            timeDataValue = timeDataValue
-                        } else {
-                            timeDataValue = timeDataValue + ':00'
-                        }
-                    } else if (timeType == 2) {
-                        timeDataValue = dataValue
-                    } else if (timeType == 3) {
-                        timeDataValue = this.jnpf.toDate(new Date(), format)
-                    } else if (timeType == 4) {
-                        let previousDate = '';
-                        previousDate = getBeforeTime(timeTarget, timeValue)
-                        timeDataValue = this.jnpf.toDate(previousDate, format)
-                    } else if (timeType == 5) {
-                        let previousDate = '';
-                        previousDate = getLaterTime(timeTarget, timeValue)
-                        timeDataValue = this.jnpf.toDate(previousDate, format)
+            }
+            return timeDataValue;
+        },
+        time(timeRule, timeType, timeTarget, timeValue, formatType, dataValue) {
+            let format = formatType == 'HH:mm' ? 'HH:mm:00' : formatType
+            let timeDataValue = null
+            if (timeRule) {
+                if (timeType == 1) {
+                    timeDataValue = timeValue || '00:00:00'
+                    if (timeDataValue.split(':').length == 3) {
+                        timeDataValue = timeDataValue
+                    } else {
+                        timeDataValue = timeDataValue + ':00'
                     }
+                } else if (timeType == 2) {
+                    timeDataValue = dataValue
+                } else if (timeType == 3) {
+                    timeDataValue = this.jnpf.toDate(new Date(), format)
+                } else if (timeType == 4) {
+                    let previousDate = '';
+                    previousDate = getBeforeTime(timeTarget, timeValue)
+                    timeDataValue = this.jnpf.toDate(previousDate, format)
+                } else if (timeType == 5) {
+                    let previousDate = '';
+                    previousDate = getLaterTime(timeTarget, timeValue)
+                    timeDataValue = this.jnpf.toDate(previousDate, format)
                 }
-                return timeDataValue;
-            },
-            dataList(){
-                var _data = this.dataForm;
-                return _data;
-            },
-            dataInfo(dataAll){
-                let _dataAll =dataAll
-                this.dataForm = _dataAll
-                this.isEdit = true
-                this.dataAll()
-                this.childIndex=-1
-            },
+            }
+            return timeDataValue;
         },
-    }
-
+        dataList() {
+            var _data = this.dataForm;
+            return _data;
+        },
+        dataInfo(dataAll) {
+            let _dataAll = dataAll
+            this.dataForm = _dataAll
+            this.isEdit = true
+            this.dataAll()
+            this.childIndex = -1
+        },
+      handleAreaVisibleChange(flag) {
+        this.areaVisible = flag
+      }
+    },
+}
 </script>
diff --git a/jnpf-java-boot/jnpf-web/src/views/stationarea/index.vue b/jnpf-java-boot/jnpf-web/src/views/stationarea/index.vue
index 281b3f5..cfb73ec 100644
--- a/jnpf-java-boot/jnpf-web/src/views/stationarea/index.vue
+++ b/jnpf-java-boot/jnpf-web/src/views/stationarea/index.vue
@@ -1,524 +1,488 @@
-
-
-
-
-
-
-
 <template>
-    <div class="JNPF-common-layout">
-        <div class="JNPF-common-layout-center">
-            <el-row class="JNPF-common-search-box" :gutter="16">
-                <el-form @submit.native.prevent>
-                            <el-col :span="6">
-                                <el-form-item label="所属回收站">
-                                        <JnpfSelect v-model="query.stationCode" placeholder="选择本组织回收站进行绑定" clearable
-                                                    :options="stationCodeOptions"
-                                                    :props="stationCodeProps"  multiple >
-                                        </JnpfSelect>
-                                </el-form-item>
-                            </el-col>
-                            <el-col :span="6">
-                                <el-form-item label="区域类型">
-                                        <JnpfSelect v-model="query.areaType" placeholder="请选择围栏类型" clearable
-                                                    :options="areaTypeOptions"
-                                                    :props="areaTypeProps"  multiple >
-                                        </JnpfSelect>
-                                </el-form-item>
-                            </el-col>
-                            <el-col :span="6">
-                                <el-form-item label="区域名称">
-                                        <el-input v-model="query.areaName" placeholder="请输入" clearable>  </el-input>
-                                </el-form-item>
-                            </el-col>
-                        <template v-if="showAll">
-                                    <el-col :span="6">
-                                        <el-form-item label="是否启用">
-                                                <JnpfSelect v-model="query.status" placeholder="请选择" clearable
-                                                            :options="statusOptions"
-                                                            :props="statusProps" >
-                                                </JnpfSelect>
-                                        </el-form-item>
-                                    </el-col>
-                        </template>
-                    <el-col :span="6">
-                        <el-form-item>
-                            <el-button type="primary" icon="el-icon-search" @click="search()">查询</el-button>
-                            <el-button icon="el-icon-refresh-right" @click="reset()">重置</el-button>
-                                <el-button type="text" icon="el-icon-arrow-down" @click="showAll=true" v-if="!showAll">
-                                    展开
-                                </el-button>
-                                <el-button type="text" icon="el-icon-arrow-up" @click="showAll=false" v-else>
-                                    收起
-                                </el-button>
-                        </el-form-item>
-                    </el-col>
-                </el-form>
-            </el-row>
-            <div class="JNPF-common-layout-main JNPF-flex-main">
-                <div class="JNPF-common-head">
-                    <div>
-                                    <el-button type="primary" icon="icon-ym icon-ym-btn-add"  v-has="'btn_add'"  @click="addOrUpdateHandle()">新增
-                                    </el-button>
-                    </div>
-                    <div class="JNPF-common-head-right">
-                            <el-tooltip content="高级查询" placement="top" v-if="true">
-                                <el-link icon="icon-ym icon-ym-filter JNPF-common-head-icon" :underline="false"
-                                         @click="openSuperQuery()" />
-                            </el-tooltip>
-                            <el-tooltip effect="dark" :content="$t('common.refresh')" placement="top">
-                                <el-link icon="icon-ym icon-ym-Refresh JNPF-common-head-icon" :underline="false"
-                                         @click="initData()" />
-                            </el-tooltip>
-                    </div>
-                </div>
-                <JNPF-table v-loading="listLoading" :data="list" @sort-change='sortChange'  
- :span-method="arraySpanMethod"  
-
->
-                                                <el-table-column
-                                                            prop="areaName"
- label="区域名称"  align="left"
- >
-                                                </el-table-column>
-                                                <el-table-column
-                                                            prop="areaType"
- label="区域类型"  align="left"
- >
-                                                </el-table-column>
-                                                <el-table-column
-                                                            prop="stationCode"
- label="所属回收站"  align="left"
- >
-                                                </el-table-column>
-                                                <el-table-column
-                                                            prop="status"
- label="是否启用"  align="left"
- >
-                                                </el-table-column>
-                                                <el-table-column
-                                                            prop="areaMapInfo"
- label="地图信息"  align="left"
- >
-                                                </el-table-column>
-                                                <el-table-column
-                                                            prop="areaDesc"
- label="区域描述"  align="left"
- >
-                                                </el-table-column>
-                        <el-table-column label="操作"
- fixed="right" width="150" >
-                            <template slot-scope="scope"  >
-                                            <el-button type="text"
-                                                       @click="addOrUpdateHandle(scope.row)"  v-has="'btn_edit'" >编辑
-                                            </el-button>
-                                        <el-button type="text" class="JNPF-table-delBtn"  v-has="'btn_remove'"  @click="handleDel(scope.row.id)">删除
-                                        </el-button>
-                                        <el-button type="text"   v-has="'btn_detail'" 
-                                                   @click="goDetail(scope.row.id)">详情
-                                        </el-button>
-                            </template>
-                        </el-table-column>
-                </JNPF-table>
-                        <pagination :total="total" :page.sync="listQuery.currentPage" :limit.sync="listQuery.pageSize" @pagination="initData"/>
-             </div>
+  <div class="JNPF-common-layout">
+    <div class="JNPF-common-layout-center">
+      <el-row class="JNPF-common-search-box" :gutter="16">
+        <el-form @submit.native.prevent>
+          <el-col :span="6">
+            <el-form-item label="所属回收站">
+              <JnpfSelect v-model="query.stationCode" placeholder="选择本组织回收站进行绑定" clearable :options="stationCodeOptions"
+                :props="stationCodeProps" multiple>
+              </JnpfSelect>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="区域类型">
+              <JnpfSelect v-model="query.areaType" placeholder="请选择围栏类型" clearable :options="areaTypeOptions"
+                :props="areaTypeProps" multiple>
+              </JnpfSelect>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="区域名称">
+              <el-input v-model="query.areaName" placeholder="请输入" clearable> </el-input>
+            </el-form-item>
+          </el-col>
+          <template v-if="showAll">
+            <el-col :span="6">
+              <el-form-item label="是否启用">
+                <JnpfSelect v-model="query.status" placeholder="请选择" clearable :options="statusOptions"
+                  :props="statusProps">
+                </JnpfSelect>
+              </el-form-item>
+            </el-col>
+          </template>
+          <el-col :span="6">
+            <el-form-item>
+              <el-button type="primary" icon="el-icon-search" @click="search()">查询{{ areaVisible }}</el-button>
+              <el-button icon="el-icon-refresh-right" @click="reset()">重置</el-button>
+              <el-button type="text" icon="el-icon-arrow-down" @click="showAll = true" v-if="!showAll">
+                展开
+              </el-button>
+              <el-button type="text" icon="el-icon-arrow-up" @click="showAll = false" v-else>
+                收起
+              </el-button>
+            </el-form-item>
+          </el-col>
+        </el-form>
+      </el-row>
+      <div class="JNPF-common-layout-main JNPF-flex-main">
+        <div class="JNPF-common-head">
+          <div>
+            <el-button type="primary" icon="icon-ym icon-ym-btn-add" v-has="'btn_add'" @click="addOrUpdateHandle()">新增
+            </el-button>
+          </div>
+          <div class="JNPF-common-head-right">
+            <el-tooltip content="高级查询" placement="top" v-if="true">
+              <el-link icon="icon-ym icon-ym-filter JNPF-common-head-icon" :underline="false"
+                @click="openSuperQuery()" />
+            </el-tooltip>
+            <el-tooltip effect="dark" :content="$t('common.refresh')" placement="top">
+              <el-link icon="icon-ym icon-ym-Refresh JNPF-common-head-icon" :underline="false" @click="initData()" />
+            </el-tooltip>
+          </div>
         </div>
-        <JNPF-Form v-if="formVisible" ref="JNPFForm" @refresh="refresh"/>
-        <ExportBox v-if="exportBoxVisible" ref="ExportBox" @download="download"/>
-
+        <JNPF-table v-loading="listLoading" :data="list" @sort-change='sortChange' :span-method="arraySpanMethod">
+          <el-table-column prop="areaName" label="区域名称" align="left">
+          </el-table-column>
+          <el-table-column prop="areaType" label="区域类型" align="left">
+          </el-table-column>
+          <el-table-column prop="stationCode" label="所属回收站" align="left">
+          </el-table-column>
+          <el-table-column prop="status" label="是否启用" align="left">
+          </el-table-column>
+          <el-table-column prop="areaMapInfo" label="地图信息" align="left">
+          </el-table-column>
+          <el-table-column prop="areaDesc" label="区域描述" align="left">
+          </el-table-column>
+          <el-table-column label="操作" fixed="right" width="150">
+            <template slot-scope="scope">
+              <el-button type="text" @click="addOrUpdateHandle(scope.row)" v-has="'btn_edit'">编辑
+              </el-button>
+              <el-button type="text" class="JNPF-table-delBtn" v-has="'btn_remove'" @click="handleDel(scope.row.id)">删除
+              </el-button>
+              <el-button type="text" v-has="'btn_detail'" @click="goDetail(scope.row.id)">详情
+              </el-button>
+            </template>
+          </el-table-column>
+        </JNPF-table>
+        <pagination :total="total" :page.sync="listQuery.currentPage" :limit.sync="listQuery.pageSize"
+          @pagination="initData" />
+      </div>
+    </div>
 
+    <JNPF-Form v-if="formVisible" ref="JNPFForm" @refresh="refresh" />
 
+    <ExportBox v-if="exportBoxVisible" ref="ExportBox" @download="download" />
 
-        <ImportBox v-if="uploadBoxVisible" ref="UploadBox" @refresh="initData" />
-        <Detail v-if="detailVisible" ref="Detail" @refresh="detailVisible=false"/>
-        <ToFormDetail v-if="toFormDetailVisible" ref="toFormDetail" @close="toFormDetailVisible = false" />
-            <SuperQuery v-if="superQueryVisible" ref="SuperQuery" :columnOptions="superQueryJson"
-                        @superQuery="superQuery" />
-    </div>
+    <ImportBox v-if="uploadBoxVisible" ref="UploadBox" @refresh="initData" />
+    <Detail v-if="detailVisible" ref="Detail" @refresh="detailVisible = false" />
+    <ToFormDetail v-if="toFormDetailVisible" ref="toFormDetail" @close="toFormDetailVisible = false" />
+    <SuperQuery v-if="superQueryVisible" ref="SuperQuery" :columnOptions="superQueryJson" @superQuery="superQuery" />
+  </div>
 </template>
 
 <script>
 
-    import request from '@/utils/request'
-    import {mapGetters} from "vuex";
-    import {getDictionaryDataSelector} from '@/api/systemData/dictionary'
-    import JNPFForm from './form'
-    import Detail from './Detail'
-    import ExportBox from '@/components/ExportBox'
-    import ToFormDetail from '@/views/basic/dynamicModel/list/detail'
-    import {getDataInterfaceRes} from '@/api/systemData/dataInterface'
-    import { getConfigData } from '@/api/onlineDev/visualDev'
-    import { getDefaultCurrentValueUserIdAsync } from '@/api/permission/user'
-    import { getDefaultCurrentValueDepartmentIdAsync } from '@/api/permission/organize'
-            import columnList from './columnList'
-    import { thousandsFormat } from "@/components/Generator/utils/index"
-        import SuperQuery from '@/components/SuperQuery'
-        import superQueryJson from './superQueryJson'
+import request from '@/utils/request'
+import { mapGetters } from "vuex";
+import { getDictionaryDataSelector } from '@/api/systemData/dictionary'
+import JNPFForm from './form'
+import Detail from './Detail'
+import ExportBox from '@/components/ExportBox'
+import ToFormDetail from '@/views/basic/dynamicModel/list/detail'
+import { getDataInterfaceRes } from '@/api/systemData/dataInterface'
+import { getConfigData } from '@/api/onlineDev/visualDev'
+import { getDefaultCurrentValueUserIdAsync } from '@/api/permission/user'
+import { getDefaultCurrentValueDepartmentIdAsync } from '@/api/permission/organize'
+import columnList from './columnList'
+import { thousandsFormat } from "@/components/Generator/utils/index"
+import SuperQuery from '@/components/SuperQuery'
+import superQueryJson from './superQueryJson'
 
-    export default {
-        components: {
-                JNPFForm,
-                Detail,
- ExportBox,ToFormDetail , SuperQuery
-        },
-        data() {
-            return {
+export default {
+  components: {
+    JNPFForm,
+    Detail,
+    ExportBox, ToFormDetail, SuperQuery
+  },
+  data() {
+    return {
 
-                keyword:'',
-                expandsTree: true,
-                refreshTree: true,
-                toFormDetailVisible:false,
-                                expandObj:{},
-                columnOptions: [],
-                mergeList: [],
-                exportList:[],
-                    columnList,
+      keyword: '',
+      expandsTree: true,
+      refreshTree: true,
+      toFormDetailVisible: false,
+      expandObj: {},
+      columnOptions: [],
+      mergeList: [],
+      exportList: [],
+      columnList,
 
-                    showAll: false,
-                    superQueryVisible: false,
-                    superQueryJson,
-                uploadBoxVisible: false,
-                detailVisible: false,
-                query: {
-                        stationCode:undefined,
-                        areaType:undefined,
-                        areaName:undefined,
-                        status:undefined,
-            },
-            treeProps: {
-                    children: 'children',
-                    label: 'fullName',
-                    value: 'id',
-                    isLeaf: 'isLeaf'
-            },
-            list: [],
-            listLoading: true,
-                    total: 0,
-            queryData: {},
-            listQuery: {
-                    superQueryJson: '',
-                        currentPage: 1,
-                        pageSize: 20,
-                sort: "desc",
-                        sidx: "",
-            },
-            formVisible: false,
-            flowVisible: false,
-            flowListVisible: false,
-            flowList: [],
-            exportBoxVisible: false,
-                                                                                                                                                                areaTypeOptions:[],
-                        areaTypeProps:{"label":"fullName","value":"enCode"  },
-                            statusOptions:[],
-                        statusProps:{"label":"fullName","value":"enCode"  },
-                            stationCodeOptions:[],
-                        stationCodeProps:{"label":"fullName","value":"id"  },
-            interfaceRes: {
-                },
+      showAll: false,
+      superQueryVisible: false,
+      superQueryJson,
+      uploadBoxVisible: false,
+      detailVisible: false,
+      query: {
+        stationCode: undefined,
+        areaType: undefined,
+        areaName: undefined,
+        status: undefined,
+      },
+      treeProps: {
+        children: 'children',
+        label: 'fullName',
+        value: 'id',
+        isLeaf: 'isLeaf'
+      },
+      list: [],
+      listLoading: true,
+      total: 0,
+      queryData: {},
+      listQuery: {
+        superQueryJson: '',
+        currentPage: 1,
+        pageSize: 20,
+        sort: "desc",
+        sidx: "",
+      },
+      formVisible: false,
+      flowVisible: false,
+      flowListVisible: false,
+      flowList: [],
+      exportBoxVisible: false,
+      areaTypeOptions: [],
+      areaTypeProps: { "label": "fullName", "value": "enCode" },
+      statusOptions: [],
+      statusProps: { "label": "fullName", "value": "enCode" },
+      stationCodeOptions: [],
+      stationCodeProps: { "label": "fullName", "value": "id" },
+      interfaceRes: {
+      },
+    }
+  },
+  computed: {
+    ...mapGetters(['userInfo']),
+    menuId() {
+      return this.$route.meta.modelId || ''
+    }
+  },
+  created() {
+    this.getColumnList(),
+      this.initSearchDataAndListData()
+    this.getstationCodeOptions();
+    this.getareaTypeOptions();
+    this.getstatusOptions();
+    this.queryData = JSON.parse(JSON.stringify(this.query))
+  },
+  methods: {
+    toDetail(defaultValue, modelId) {
+      if (!defaultValue) return
+      getConfigData(modelId).then(res => {
+        if (!res.data || !res.data.formData) return
+        let formData = JSON.parse(res.data.formData)
+        formData.popupType = 'general'
+        this.toFormDetailVisible = true
+        this.$nextTick(() => {
+          this.$refs.toFormDetail.init(formData, modelId, defaultValue)
+        })
+      })
+    },
+    toggleTreeExpand(expands) {
+      this.refreshTree = false
+      this.expandsTree = expands
+      this.$nextTick(() => {
+        this.refreshTree = true
+        this.$nextTick(() => {
+          this.$refs.treeBox.setCurrentKey(null)
+        })
+      })
+    },
+    filterNode(value, data) {
+      if (!value) return true;
+      return data[this.treeProps.label].indexOf(value) !== -1;
+    },
+    loadNode(node, resolve) {
+      const nodeData = node.data
+      const config = {
+        treeInterfaceId: "",
+        treeTemplateJson: []
+      }
+      if (config.treeInterfaceId) {
+        //这里是为了拿到参数中关联的字段的值，后端自行拿
+        if (config.treeTemplateJson && config.treeTemplateJson.length) {
+          for (let i = 0; i < config.treeTemplateJson.length; i++) {
+            const element = config.treeTemplateJson[i];
+            element.defaultValue = nodeData[element.relationField] || ''
+          }
+        }
+        //参数
+        let query = {
+          paramList: config.treeTemplateJson || [],
+        }
+        //接口
+        getDataInterfaceRes(config.treeInterfaceId, query).then(res => {
+          let data = res.data
+          if (Array.isArray(data)) {
+            resolve(data);
+          } else {
+            resolve([]);
+          }
+        })
+      }
+    },
+    getColumnList() {
+      // 没有开启权限
+      this.columnOptions = this.transformColumnList(this.columnList)
+    },
+    transformColumnList(columnList) {
+      let list = []
+      for (let i = 0; i < columnList.length; i++) {
+        const e = columnList[i];
+        if (!e.prop.includes('-')) {
+          list.push(e)
+        } else {
+          let prop = e.prop.split('-')[0]
+          let label = e.label.split('-')[0]
+          let vModel = e.prop.split('-')[1]
+          let newItem = {
+            align: "center",
+            jnpfKey: "table",
+            prop,
+            label,
+            children: []
+          }
+          e.vModel = vModel
+          if (!this.expandObj.hasOwnProperty(`${prop}Expand`)) this.$set(this.expandObj, `${prop}Expand`, false)
+          if (!list.some(o => o.prop === prop)) list.push(newItem)
+          for (let i = 0; i < list.length; i++) {
+            if (list[i].prop === prop) {
+              list[i].children.push(e)
+              break
             }
-        },
-        computed: {
-            ...mapGetters(['userInfo']),
-            menuId() {
-                return this.$route.meta.modelId || ''
+          }
+        }
+      }
+      this.getMergeList(list)
+      this.getExportList(list)
+      return list
+    },
+    arraySpanMethod({ column }) {
+      for (let i = 0; i < this.mergeList.length; i++) {
+        if (column.property == this.mergeList[i].prop) {
+          return [this.mergeList[i].rowspan, this.mergeList[i].colspan]
+        }
+      }
+    },
+    getMergeList(list) {
+      let newList = JSON.parse(JSON.stringify(list))
+      newList.forEach(item => {
+        if (item.children && item.children.length) {
+          let child = {
+            prop: item.prop + '-child-first'
+          }
+          item.children.unshift(child)
+        }
+      })
+      newList.forEach(item => {
+        if (item.children && item.children.length) {
+          item.children.forEach((child, index) => {
+            if (index == 0) {
+              this.mergeList.push({
+                prop: child.prop,
+                rowspan: 1,
+                colspan: item.children.length
+              })
+            } else {
+              this.mergeList.push({
+                prop: child.prop,
+                rowspan: 0,
+                colspan: 0
+              })
             }
-        },
-        created() {
-                        this.getColumnList(),
-                this.initSearchDataAndListData()
-                    this.getstationCodeOptions();
-                    this.getareaTypeOptions();
-                    this.getstatusOptions();
-            this.queryData = JSON.parse(JSON.stringify(this.query))
-        },
-        methods: {
-            toDetail(defaultValue, modelId) {
-                if (!defaultValue) return
-                getConfigData(modelId).then(res => {
-                    if (!res.data || !res.data.formData) return
-                    let formData = JSON.parse(res.data.formData)
-                    formData.popupType = 'general'
-                    this.toFormDetailVisible = true
-                    this.$nextTick(() => {
-                        this.$refs.toFormDetail.init(formData, modelId, defaultValue)
-                    })
-                })
-            },
-            toggleTreeExpand(expands) {
-                this.refreshTree = false
-                this.expandsTree = expands
-                this.$nextTick(() => {
-                    this.refreshTree = true
-                    this.$nextTick(() => {
-                        this.$refs.treeBox.setCurrentKey(null)
-                    })
-                })
-            },
-            filterNode(value, data) {
-                if (!value) return true;
-                return data[this.treeProps.label].indexOf(value) !== -1;
-            },
-            loadNode(node, resolve) {
-                const nodeData = node.data
-                const config ={
-                    treeInterfaceId:"",
-                    treeTemplateJson:[]
-                }
-                if (config.treeInterfaceId) {
-                    //这里是为了拿到参数中关联的字段的值，后端自行拿
-                    if (config.treeTemplateJson && config.treeTemplateJson.length) {
-                        for (let i = 0; i < config.treeTemplateJson.length; i++) {
-                            const element = config.treeTemplateJson[i];
-                            element.defaultValue = nodeData[element.relationField] || ''
-                        }
-                    }
-                    //参数
-                    let query = {
-                        paramList: config.treeTemplateJson || [],
-                    }
-                    //接口
-                    getDataInterfaceRes(config.treeInterfaceId, query).then(res => {
-                        let data = res.data
-                        if (Array.isArray(data)) {
-                            resolve(data);
-                        } else {
-                            resolve([]);
-                        }
-                    })
-                }
-            },
-                        getColumnList() {
-                    // 没有开启权限
-                    this.columnOptions = this.transformColumnList(this.columnList)
-            },
-            transformColumnList(columnList) {
-                let list = []
-                for (let i = 0; i < columnList.length; i++) {
-                    const e = columnList[i];
-                    if (!e.prop.includes('-')) {
-                        list.push(e)
-                    } else {
-                        let prop = e.prop.split('-')[0]
-                        let label = e.label.split('-')[0]
-                        let vModel = e.prop.split('-')[1]
-                        let newItem = {
-                            align: "center",
-                            jnpfKey: "table",
-                            prop,
-                            label,
-                            children: []
-                        }
-                        e.vModel = vModel
-                        if (!this.expandObj.hasOwnProperty(`${prop}Expand`)) this.$set(this.expandObj, `${prop}Expand`, false)
-                        if (!list.some(o => o.prop === prop)) list.push(newItem)
-                        for (let i = 0; i < list.length; i++) {
-                            if (list[i].prop === prop) {
-                                list[i].children.push(e)
-                                break
-                            }
-                        }
-                    }
-                }
-                this.getMergeList(list)
-                this.getExportList(list)
-                return list
-            },
-            arraySpanMethod({ column }) {
-                for (let i = 0; i < this.mergeList.length; i++) {
-                    if (column.property == this.mergeList[i].prop) {
-                        return [this.mergeList[i].rowspan, this.mergeList[i].colspan]
-                    }
-                }
-            },
-            getMergeList(list) {
-                let newList = JSON.parse(JSON.stringify(list))
-                newList.forEach(item => {
-                    if (item.children && item.children.length) {
-                        let child = {
-                            prop: item.prop + '-child-first'
-                        }
-                        item.children.unshift(child)
-                    }
-                })
-                newList.forEach(item => {
-                    if (item.children && item.children.length ) {
-                        item.children.forEach((child, index) => {
-                            if (index == 0) {
-                                this.mergeList.push({
-                                    prop: child.prop,
-                                    rowspan: 1,
-                                    colspan: item.children.length
-                                })
-                            } else {
-                                this.mergeList.push({
-                                    prop: child.prop,
-                                    rowspan: 0,
-                                    colspan: 0
-                                })
-                            }
-                        })
-                    } else {
-                        this.mergeList.push({
-                            prop: item.prop,
-                            rowspan: 1,
-                            colspan: 1
-                        })
-                    }
-                })
-            },
-            getExportList(list) {
-                let exportList = []
-                for (let i = 0; i < list.length; i++) {
-                    if (list[i].jnpfKey === 'table') {
-                        for (let j = 0; j < list[i].children.length; j++) {
-                            exportList.push(list[i].children[j])
-                        }
-                    } else {
-                        exportList.push(list[i])
-                    }
-                }
-                this.exportList = exportList
-            },
-                    getstationCodeOptions() {
-                        getDataInterfaceRes('520259300875047493').then(res => {
-                            let data = res.data
-                            this.stationCodeOptions = data
-                        })
-                    },
-                    getareaTypeOptions() {
-                        getDictionaryDataSelector('560423985691492677').then(res => {
-                            this.areaTypeOptions = res.data.list
-                        })
-                    },
-                    getstatusOptions() {
-                        getDictionaryDataSelector('519107761586309125').then(res => {
-                            this.statusOptions = res.data.list
-                        })
-                    },
-            goDetail(id){
-                this.detailVisible = true
-                this.$nextTick(() => {
-                    this.$refs.Detail.init(id)
-                })
-            },
-            sortChange({column, prop, order}) {
-                this.listQuery.sort = order == 'ascending' ? 'asc' : 'desc'
-                this.listQuery.sidx = !order ? '' : prop
-                this.initData()
-            },
-            async initSearchDataAndListData() {
-                await this.initSearchData()
-                this.initData()
-            },
-            //初始化查询的默认数据
-            async initSearchData() {
-            },
-            initData() {
-                this.listLoading = true;
-                let _query = {
-                    ...this.listQuery,
-                    ...this.query,
-                        keyword: this.keyword,
-                        dataType: 0,
-                    menuId:this.menuId,
-                    moduleId:'560427626187981125',
-                    type:1,
-                };
-                request({
-                    url: `/api/scm/StationArea/getList`,
-                    method: 'post',
-                    data: _query
-                }).then(res => {
-                    var _list =res.data.list;
-                                            this.list = _list.map(o => ({
-                            ...o,
-                            ...this.expandObj,
-                        }))
-                            this.total = res.data.pagination.total
-                    this.listLoading = false
-                })
-            },
-            handleDel(id) {
-                this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
-                    type: 'warning'
-                }).then(() => {
-                    request({
-                        url: `/api/scm/StationArea/${id}`,
-                        method: 'DELETE'
-                    }).then(res => {
-                        this.$message({
-                            type: 'success',
-                            message: res.msg,
-                            onClose: () => {
-                                this.initData()
-                            }
-                        });
-                    })
-                }).catch(() => {
-                });
-            },
-            handelUpload(){
-                this.uploadBoxVisible = true
-                this.$nextTick(() => {
-                    this.$refs.UploadBox.init("","scm/StationArea")
-                })
-            },
-                openSuperQuery() {
-                    this.superQueryVisible = true
-                    this.$nextTick(() => {
-                        this.$refs.SuperQuery.init()
-                    })
-                },
-                superQuery(queryJson) {
-                    this.listQuery.superQueryJson = queryJson
-                    this.listQuery.currentPage = 1
-                    this.initData()
-                },
-            addOrUpdateHandle(row, isDetail) {
-                let id = row?row.id:""
-                this.formVisible = true
-                this.$nextTick(() => {
-                    this.$refs.JNPFForm.init(id, isDetail,this.list)
-                })
-            },
-            exportData() {
-                this.exportBoxVisible = true
-                this.$nextTick(() => {
-                    this.$refs.ExportBox.init(this.exportList)
-                })
-            },
-            download(data) {
-                let query = {...data, ...this.listQuery, ...this.query,menuId:this.menuId}
-                request({
-                    url: `/api/scm/StationArea/Actions/Export`,
-                    method: 'post',
-                    data: query
-                }).then(res => {
-                    if (!res.data.url) return
-                    this.jnpf.downloadFile(res.data.url)
-                    this.$refs.ExportBox.visible = false
-                    this.exportBoxVisible = false
-                })
-            },
-            search() {
-                    this.listQuery.currentPage=1
-                        this.listQuery.pageSize=20
-                    this.listQuery.sort="desc"
-                this.listQuery.sidx=""
-                this.initData()
-            },
-            refresh(isrRefresh) {
-                this.formVisible = false
-                if (isrRefresh) this.reset()
-            },
-            reset() {
-                this.query = JSON.parse(JSON.stringify(this.queryData))
-                this.search()
-            },
-            colseFlow(isrRefresh) {
-                this.flowVisible = false
-                if (isrRefresh) this.reset()
-            },
+          })
+        } else {
+          this.mergeList.push({
+            prop: item.prop,
+            rowspan: 1,
+            colspan: 1
+          })
         }
+      })
+    },
+    getExportList(list) {
+      let exportList = []
+      for (let i = 0; i < list.length; i++) {
+        if (list[i].jnpfKey === 'table') {
+          for (let j = 0; j < list[i].children.length; j++) {
+            exportList.push(list[i].children[j])
+          }
+        } else {
+          exportList.push(list[i])
+        }
+      }
+      this.exportList = exportList
+    },
+    getstationCodeOptions() {
+      getDataInterfaceRes('520259300875047493').then(res => {
+        let data = res.data
+        this.stationCodeOptions = data
+      })
+    },
+    getareaTypeOptions() {
+      getDictionaryDataSelector('560423985691492677').then(res => {
+        this.areaTypeOptions = res.data.list
+      })
+    },
+    getstatusOptions() {
+      getDictionaryDataSelector('519107761586309125').then(res => {
+        this.statusOptions = res.data.list
+      })
+    },
+    goDetail(id) {
+      this.detailVisible = true
+      this.$nextTick(() => {
+        this.$refs.Detail.init(id)
+      })
+    },
+    sortChange({ column, prop, order }) {
+      this.listQuery.sort = order == 'ascending' ? 'asc' : 'desc'
+      this.listQuery.sidx = !order ? '' : prop
+      this.initData()
+    },
+    async initSearchDataAndListData() {
+      await this.initSearchData()
+      this.initData()
+    },
+    //初始化查询的默认数据
+    async initSearchData() {
+    },
+    initData() {
+      this.listLoading = true;
+      let _query = {
+        ...this.listQuery,
+        ...this.query,
+        keyword: this.keyword,
+        dataType: 0,
+        menuId: this.menuId,
+        moduleId: '560427626187981125',
+        type: 1,
+      };
+      request({
+        url: `/api/scm/StationArea/getList`,
+        method: 'post',
+        data: _query
+      }).then(res => {
+        var _list = res.data.list;
+        this.list = _list.map(o => ({
+          ...o,
+          ...this.expandObj,
+        }))
+        this.total = res.data.pagination.total
+        this.listLoading = false
+      })
+    },
+    handleDel(id) {
+      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
+        type: 'warning'
+      }).then(() => {
+        request({
+          url: `/api/scm/StationArea/${id}`,
+          method: 'DELETE'
+        }).then(res => {
+          this.$message({
+            type: 'success',
+            message: res.msg,
+            onClose: () => {
+              this.initData()
+            }
+          });
+        })
+      }).catch(() => {
+      });
+    },
+    handelUpload() {
+      this.uploadBoxVisible = true
+      this.$nextTick(() => {
+        this.$refs.UploadBox.init("", "scm/StationArea")
+      })
+    },
+    openSuperQuery() {
+      this.superQueryVisible = true
+      this.$nextTick(() => {
+        this.$refs.SuperQuery.init()
+      })
+    },
+    superQuery(queryJson) {
+      this.listQuery.superQueryJson = queryJson
+      this.listQuery.currentPage = 1
+      this.initData()
+    },
+    addOrUpdateHandle(row, isDetail) {
+      let id = row ? row.id : ""
+      this.formVisible = true
+      this.$nextTick(() => {
+        this.$refs.JNPFForm.init(id, isDetail, this.list)
+      })
+    },
+    exportData() {
+      this.exportBoxVisible = true
+      this.$nextTick(() => {
+        this.$refs.ExportBox.init(this.exportList)
+      })
+    },
+    download(data) {
+      let query = { ...data, ...this.listQuery, ...this.query, menuId: this.menuId }
+      request({
+        url: `/api/scm/StationArea/Actions/Export`,
+        method: 'post',
+        data: query
+      }).then(res => {
+        if (!res.data.url) return
+        this.jnpf.downloadFile(res.data.url)
+        this.$refs.ExportBox.visible = false
+        this.exportBoxVisible = false
+      })
+    },
+    search() {
+      this.listQuery.currentPage = 1
+      this.listQuery.pageSize = 20
+      this.listQuery.sort = "desc"
+      this.listQuery.sidx = ""
+      this.initData()
+    },
+    refresh(isrRefresh) {
+      this.formVisible = false
+      if (isrRefresh) this.reset()
+    },
+    reset() {
+      this.query = JSON.parse(JSON.stringify(this.queryData))
+      this.search()
+    },
+    colseFlow(isrRefresh) {
+      this.flowVisible = false
+      if (isrRefresh) this.reset()
     }
+  }
+}
 </script>