地区组件

src/components/framework/TopDeptChooser.vue

@@ -16,7 +16,7 @@
       </el-dropdown-menu>
     </el-dropdown>
 
-    <el-dropdown trigger="click" placement="bottom-start">
+    <el-dropdown trigger="click" placement="bottom-start" v-if="!hideTown">
       <div class="select_address el-dropdown-link">
         <span class="sanjiao-right"></span>
         <p>{{townName}}</p>
@@ -43,6 +43,14 @@ export default {
     countyCode: String,
     townCode: String,
     rootId: [String, Number],
+    allTown: {
+      type: Boolean,
+      default: false,
+    },
+    hideTown: {
+      type: Boolean,
+      default: false,
+    },
   },
   created() {
     this.getDeptTree();
@@ -78,14 +86,21 @@ export default {
       if(w & 1)
       {
         this.$emit('update:countyCode', this.icountyCode);
-        this.$emit('countyChanged', this.icountyCode, null);
       }
-      if(w & 2)
+      if((w & 2) && !this.hideTown)
       {
         this.$emit('update:townCode', this.itownCode);
+      }
+      if(w & 1)
+      {
+        this.$emit('countyChanged', this.icountyCode, null);
+      }
+      if((w & 2) && !this.hideTown)
+      {
         this.$emit('townChanged', this.itownCode, this.icountyCode);
       }
-      this.$emit('dataChanged', this.icountyCode, this.itownCode, w);
+      if((w & 1) || ((w & 2) && !this.hideTown))
+        this.$emit('dataChanged', this.icountyCode, this.itownCode, w);
     },
   },
   watch: {
@@ -96,17 +111,17 @@ export default {
       if(this.icountyCode != newVal)
       {
         this.icountyCode = newVal;
-        this.emitUpdate(1);
+        //this.emitUpdate(1);
       }
     },
     townCode(newVal) {
       if(this.itownCode != newVal)
       {
         this.itownCode = newVal;
-        this.emitUpdate(2);
+        //this.emitUpdate(2);
       }
     },
-    icountyCode(newVal) {
+/*    icountyCode(newVal) {
       if(this.countyCode != newVal)
       {
         this.emitUpdate(1);
@@ -117,7 +132,7 @@ export default {
       {
         this.emitUpdate(2);
       }
-    },
+    },*/
   },
   computed: {
     cityName() {
@@ -130,11 +145,20 @@ export default {
       if(!this.deptOptions.length)
         return [];
       let dept = this.deptOptions.find((x) => x.orgCode === this.icountyCode);
-      return dept ? dept.children || [] : [];
+      let arr = [];
+      if(this.allTown)
+        arr.push({orgCode: '', deptName: '全部'});
+      arr.push(...(dept ? dept.children || [] : []));
+      return arr;
     },
     townName() {
       if(!this.townList.length)
         return '';
+      if(this.allTown)
+      {
+        if(!this.itownCode)
+          return '全部';
+      }
       let dept = this.townList.find((x) => x.orgCode === this.itownCode);
       return dept ? dept.deptName : '';
     },

src/views/allTasks/allTasks.vue

@@ -3,33 +3,7 @@
 
     <div class="header_main">
 
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="select_address el-dropdown-link">
-          <span class="sanjiao-right"></span>
-          <p>{{cityName}}</p>
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 8vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in deptOptions" :command="item.orgCode">
-            <div class="selected" @click="chooseCity(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
-
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="select_address el-dropdown-link">
-          <span class="sanjiao-right"></span>
-          <p>{{townName}}</p>
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 8vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in townList" :command="item.orgCode">
-            <div class="selected" @click="chooseTown(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
+      <TopDeptChooser :county-code.sync="parms.countyCode" :town-code.sync="parms.townCode" :root-id="rootId" @countyChanged="chooseCity" @dataChanged="chooseDept"/>
 
       <p class="todo_num">镇处理进度：<span>{{ countySummary.numTownProcessedTask }}/{{ countySummary.numTown }}</span></p>
       <p class="todo_num3">镇审核进度：<span>{{ countySummary.numTownApprovalTask }}/{{ countySummary.numTown }}</span></p>
@@ -125,13 +99,13 @@ import {ENV} from "@/utils/env";
 import {date_format} from "@/utils/date";
 import {managerAllTaskList, managerCountyTaskSummary,} from "@/api/agentcenter/task";
 import RightYearMonthSelector from "@/components/framework/RightYearMonthSelector.vue";
+import TopDeptChooser from "@/components/framework/TopDeptChooser.vue";
 
 export default {
   name: "processing",
-  components: {RightYearMonthSelector},
+  components: {TopDeptChooser, RightYearMonthSelector},
   data() {
     return {
-      deptOptions: [],
       list: [],
       total: 0,
       parms: {
@@ -148,24 +122,13 @@ export default {
         numTownApprovalTask: 0,
         numBookProcessedTask: 0,
         numBookApprovalTask: 0,
-      }
+      },
+      rootId: ENV.UserDeptId(),
     }
   },
   created() {
-    this.getDeptTree();
   },
   methods:{
-    getDeptTree() {
-      cityTree({rootId: ENV.UserDeptId()}).then((resp) => {
-        this.deptOptions = resp.data;
-        if(this.deptOptions.length)
-        {
-          this.parms.countyCode = this.deptOptions[0].orgCode;
-          this.getSummary();
-          this.getTaskList();
-        }
-      });
-    },
     getTaskList() {
       if(!this.parms.countyCode || !this.parms.orderYear || !this.parms.orderMonth)
         return;
@@ -174,15 +137,11 @@ export default {
         this.total = resp.total;
       })
     },
-    chooseCity(cmd) {
-      this.parms.countyCode = cmd;
-      this.parms.townCode = null;
+    chooseDept(countyCode, townCode, what) {
       this.getTaskList();
-      this.getSummary();
     },
-    chooseTown(cmd) {
-      this.parms.townCode = cmd;
-      this.getTaskList();
+    chooseCity(countyCode, townCode) {
+      this.getSummary();
     },
     chooseMonth(year, month) {
       this.getSummary();
@@ -203,24 +162,6 @@ export default {
 
   },
   computed: {
-    cityName() {
-      if(!this.deptOptions.length)
-        return '';
-      let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-      return dept ? dept.deptName : '';
-    },
-    townList() {
-      if(!this.deptOptions.length)
-        return [];
-      let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-      return dept ? dept.children || [] : [];
-    },
-    townName() {
-      if(!this.townList.length)
-        return '';
-      let dept = this.townList.find((x) => x.orgCode === this.parms.townCode);
-      return dept ? dept.deptName : '';
-    },
   },
 }
 </script>

src/views/audit/audit.vue

@@ -137,7 +137,7 @@ export default {
         this.summary = resp.data;
       })
     },
-    chooseTown(cmd) {
+    chooseTown(townCode, countyCode) {
       this.getTaskList();
       this.getSummary();
     },

src/views/processed/processed.vue

@@ -3,33 +3,7 @@
 
     <div class="header_main">
 
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="select_address el-dropdown-link">
-          <span class="sanjiao-right"></span>
-          <p>{{cityName}}</p>
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 8vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in deptOptions">
-            <div class="selected" @click="chooseCity(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
-
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="select_address el-dropdown-link">
-          <span class="sanjiao-right"></span>
-          <p>{{townName}}</p>
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 8vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in townList">
-            <div class="selected" @click="chooseTown(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
+      <TopDeptChooser :county-code.sync="parms.countyCode" :town-code.sync="parms.townCode" :root-id="rootId" @dataChanged="chooseTown" all-town/>
 
       <p class="todo_num">已处理村庄：<span>{{total}}</span>个</p>
       <p class="todo_num2">超时完成村庄：<span>{{overdue}}</span>个</p>
@@ -98,13 +72,13 @@ import {date, date_format} from "@/utils/date";
 import {cityTree} from "@/api/misc/misc_dept";
 import {ENV} from "@/utils/env";
 import {accountingProcessedTaskList} from "@/api/agentcenter/accounting_task";
+import TopDeptChooser from "@/components/framework/TopDeptChooser.vue";
 
 export default {
   name: "processed",
-  components: {RightYearMonthSelector},
+  components: {TopDeptChooser, RightYearMonthSelector},
   data() {
     return {
-      deptOptions: [],
       list: [],
       total: 0,
       overdue: 0,
@@ -114,29 +88,13 @@ export default {
         orderYear: date_format('%Y'),
         orderMonth: date_format('%m'),
       },
+      rootId: ENV.UserDeptId(),
     }
   },
   created() {
-    this.getDeptTree();
   },
   methods:{
-    getDeptTree() {
-      cityTree({rootId: ENV.UserDeptId()}).then((resp) => {
-        this.deptOptions = resp.data;
-        if(this.deptOptions.length)
-        {
-          this.parms.countyCode = this.deptOptions[0].orgCode;
-          this.getTaskList();
-        }
-      });
-    },
-    chooseCity(cmd) {
-      this.parms.countyCode = cmd;
-      this.parms.townCode = null;
-      this.getTaskList();
-    },
     chooseTown(cmd) {
-      this.parms.townCode = cmd;
       this.getTaskList();
     },
     getTaskList() {
@@ -159,26 +117,6 @@ export default {
 
   },
   computed: {
-    cityName() {
-      if(!this.deptOptions.length)
-        return '';
-      let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-      return dept ? dept.deptName : '';
-    },
-    townList() {
-      if(!this.deptOptions.length)
-        return [];
-      let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-      return [{orgCode: '', deptName: '全部'}, ...(dept ? dept.children || [] : [])];
-    },
-    townName() {
-      if(!this.townList.length)
-        return '';
-      if(!this.parms.townCode)
-        return '全部';
-      let dept = this.townList.find((x) => x.orgCode === this.parms.townCode);
-      return dept ? dept.deptName : '';
-    },
   },
 }
 </script>

src/views/processing/processing.vue

@@ -3,33 +3,7 @@
 
     <div class="header_main">
 
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="select_address el-dropdown-link">
-          <span class="sanjiao-right"></span>
-          <p>{{cityName}}</p>
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 8vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in deptOptions" :command="item.orgCode">
-            <div class="selected" @click="chooseCity(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
-
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="select_address el-dropdown-link">
-          <span class="sanjiao-right"></span>
-          <p>{{townName}}</p>
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 8vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in townList" :command="item.orgCode">
-            <div class="selected" @click="chooseTown(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
+      <TopDeptChooser :county-code.sync="parms.countyCode" :town-code.sync="parms.townCode" :root-id="rootId" @countyChanged="chooseCity" @dataChanged="chooseDept"/>
 
       <p class="todo_num">剩余镇：<span>{{ countySummary.numTown }}</span>个</p>
       <p class="todo_num1">剩余村庄：<span>{{ countySummary.numVillage }}</span>个</p>
@@ -45,7 +19,7 @@
           <el-collapse-item v-for="(item,index) in list" :key="index">
             <template slot="title">
               <div class="left_main_tt">
-                <p>东沙镇</p>
+                <p>{{item.townName}}</p>
                 <div class="tt_label">
                   <p>异常：{{item.numExcept}}</p>
                   <p>剩余村庄：{{item.numVillage}}</p>
@@ -120,13 +94,13 @@ import {date_format} from "@/utils/date";
 import {cityTree} from "@/api/misc/misc_dept";
 import {ENV} from "@/utils/env";
 import {managerProcessingTaskList, managerCountyProcessingTaskSummary, revokeTask} from "@/api/agentcenter/task";
+import TopDeptChooser from "@/components/framework/TopDeptChooser.vue";
 
 export default {
   name: "processing",
-  components: {RightYearMonthSelector},
+  components: {TopDeptChooser, RightYearMonthSelector},
   data() {
     return {
-      deptOptions: [],
       list: [],
       total: 0,
       parms: {
@@ -140,24 +114,13 @@ export default {
         numBook: 0,
         abnormalCount: 0,
         numVillage: 0,
-      }
+      },
+      rootId: ENV.UserDeptId(),
     }
   },
   created() {
-    this.getDeptTree();
   },
   methods:{
-    getDeptTree() {
-      cityTree({rootId: ENV.UserDeptId()}).then((resp) => {
-        this.deptOptions = resp.data;
-        if(this.deptOptions.length)
-        {
-          this.parms.countyCode = this.deptOptions[0].orgCode;
-          this.getSummary();
-          this.getTaskList();
-        }
-      });
-    },
     getTaskList() {
       if(!this.parms.countyCode || !this.parms.orderYear || !this.parms.orderMonth)
         return;
@@ -166,15 +129,11 @@ export default {
         this.total = resp.total;
       })
     },
-    chooseCity(cmd) {
-      this.parms.countyCode = cmd;
-      this.parms.townCode = null;
+    chooseDept(countyCode, townCode, what) {
       this.getTaskList();
-      this.getSummary();
     },
-    chooseTown(cmd) {
-      this.parms.townCode = cmd;
-      this.getTaskList();
+    chooseCity(countyCode, townCode) {
+      this.getSummary();
     },
     chooseMonth(year, month) {
       this.getSummary();
@@ -206,24 +165,6 @@ export default {
 
   },
   computed: {
-    cityName() {
-      if(!this.deptOptions.length)
-        return '';
-      let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-      return dept ? dept.deptName : '';
-    },
-    townList() {
-      if(!this.deptOptions.length)
-        return [];
-      let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-      return dept ? dept.children || [] : [];
-    },
-    townName() {
-      if(!this.townList.length)
-        return '';
-      let dept = this.townList.find((x) => x.orgCode === this.parms.townCode);
-      return dept ? dept.deptName : '';
-    },
   },
 }
 </script>

src/views/taskAllocation/todo.vue

@@ -3,36 +3,7 @@
 
     <div class="header_main">
 
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="select_address el-dropdown-link">
-          <span class="sanjiao-right"></span>
-          <p>{{cityName}}</p>
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 8vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in deptOptions">
-            <div class="selected" @click="chooseCity(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
-
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="el-dropdown-link select_main">
-          <div class="select_address">
-            <span class="sanjiao-right"></span>
-            <p>{{townName}}</p>
-          </div>
-<!--          <div class="select_address"></div>-->
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 16vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in townList">
-            <div class="selected" @click="chooseTown(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
+      <TopDeptChooser :county-code.sync="parms.countyCode" :town-code.sync="parms.townCode" :root-id="rootId" @dataChanged="chooseTown"/>
 
       <p class="todo_num">待处理合作社：<span>{{total}}</span>个</p>
 
@@ -76,13 +47,13 @@ import {ENV} from "@/utils/env";
 import {accountingTodoTaskList, finishTask} from "@/api/agentcenter/accounting_task";
 import {date, date_format} from "@/utils/date";
 import RightYearMonthSelector from "@/components/framework/RightYearMonthSelector.vue";
+import TopDeptChooser from "@/components/framework/TopDeptChooser.vue";
 
 export default {
   name: "todo",
-  components: {RightYearMonthSelector},
+  components: {TopDeptChooser, RightYearMonthSelector},
   data() {
     return {
-      deptOptions: [],
       list: [],
       total: 0,
       parms: {
@@ -91,29 +62,13 @@ export default {
         orderYear: date_format('%Y'),
         orderMonth: date_format('%m'),
       },
+      rootId: ENV.UserDeptId(),
     }
   },
   created() {
-    this.getDeptTree();
   },
   methods:{
-    getDeptTree() {
-      cityTree({rootId: ENV.UserDeptId()}).then((resp) => {
-        this.deptOptions = resp.data;
-        if(this.deptOptions.length)
-        {
-          this.parms.countyCode = this.deptOptions[0].orgCode;
-          this.getTaskList();
-        }
-      });
-    },
-    chooseCity(cmd) {
-      this.parms.countyCode = cmd;
-      this.parms.townCode = null;
-      this.getTaskList();
-    },
     chooseTown(cmd) {
-      this.parms.townCode = cmd;
       this.getTaskList();
     },
     getTaskList() {
@@ -143,24 +98,6 @@ export default {
 
   },
   computed: {
-    cityName() {
-      if(!this.deptOptions.length)
-        return '';
-      let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-      return dept ? dept.deptName : '';
-    },
-    townList() {
-      if(!this.deptOptions.length)
-        return [];
-      let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-      return dept ? dept.children || [] : [];
-    },
-    townName() {
-      if(!this.townList.length)
-        return '';
-      let dept = this.townList.find((x) => x.orgCode === this.parms.townCode);
-      return dept ? dept.deptName : '';
-    },
   },
 }
 </script>

src/views/toBeAllocated/toBeAllocated.vue

@@ -3,33 +3,7 @@
 
     <div class="header_main">
 
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="select_address el-dropdown-link">
-          <span class="sanjiao-right"></span>
-          <p>{{cityName}}</p>
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 8vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in deptOptions">
-            <div class="selected" @click="chooseCity(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
-
-      <el-dropdown trigger="click" placement="bottom-start">
-        <div class="select_address el-dropdown-link">
-          <span class="sanjiao-right"></span>
-          <p>{{townName}}</p>
-        </div>
-        <el-dropdown-menu slot="dropdown" style="width: 8vw;text-align: center;">
-          <el-dropdown-item v-for="(item,index) in townList">
-            <div class="selected" @click="chooseTown(item.orgCode)">
-              <p>{{item.deptName}}</p>
-            </div>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
+      <TopDeptChooser :county-code.sync="parms.countyCode" :town-code.sync="parms.townCode" :root-id="rootId" @countyChanged="chooseCity" @townChanged="chooseTown" @dataChanged="chooseDept"/>
 
       <p class="todo_num">待处理镇/街：<span>{{total}}</span>个</p>
       <p class="todo_num2">待处理村庄：<span>{{numVillage}}</span>个</p>
@@ -165,13 +139,13 @@
   import {date_format} from "@/utils/date";
   import {distribTask, managerUndistribTaskList} from "@/api/agentcenter/task";
   import {taskUserList} from "@/api/agentcenter/task_user";
+  import TopDeptChooser from "@/components/framework/TopDeptChooser.vue";
 
   export default {
     name: "processed",
-    components: {RightYearMonthSelector, RightYearMonthHorizontalSelector},
+    components: {TopDeptChooser, RightYearMonthSelector, RightYearMonthHorizontalSelector},
     data() {
       return {
-        deptOptions: [],
         list: [],
         total: 0,
         parms: {
@@ -186,32 +160,19 @@
         villageTaskUserList: [],
         townTaskUserList: [],
         taskUserList: [],
+        rootId: ENV.UserDeptId(),
       }
     },
     created() {
-      this.getDeptTree();
     },
     methods:{
-      getDeptTree() {
-        cityTree({rootId: ENV.UserDeptId()}).then((resp) => {
-          this.deptOptions = resp.data;
-          if(this.deptOptions.length)
-          {
-            this.parms.countyCode = this.deptOptions[0].orgCode;
-            this.getTaskUserList({orgCode: this.parms.countyCode});
-            this.getTaskList();
-          }
-        });
-      },
-      chooseCity(cmd) {
-        this.parms.countyCode = cmd;
-        this.parms.townCode = null;
+      chooseDept(countyCode, townCode, what) {
         this.getTaskList();
+      },
+      chooseCity(countyCode, townCode) {
         this.getTaskUserList({orgCode: this.parms.countyCode});
       },
-      chooseTown(cmd) {
-        this.parms.townCode = cmd;
-        this.getTaskList();
+      chooseTown(townCode, countyCode) {
         this.getVillageTaskUserList({orgCode: this.parms.townCode});
       },
       addNum(item){
@@ -336,24 +297,6 @@
 
     },
     computed: {
-      cityName() {
-        if(!this.deptOptions.length)
-          return '';
-        let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-        return dept ? dept.deptName : '';
-      },
-      townList() {
-        if(!this.deptOptions.length)
-          return [];
-        let dept = this.deptOptions.find((x) => x.orgCode === this.parms.countyCode);
-        return dept ? dept.children || [] : [];
-      },
-      townName() {
-        if(!this.townList.length)
-          return '';
-        let dept = this.townList.find((x) => x.orgCode === this.parms.townCode);
-        return dept ? dept.deptName : '';
-      },
     },
   }
 </script>