From 0827bd6f9570f93dcbed28fe9c183af85ae6c092 Mon Sep 17 00:00:00 2001
From: caoqianming <caoqianming@foxmail.com>
Date: Thu, 1 Apr 2021 13:10:27 +0800
Subject: [PATCH] =?UTF-8?q?=E5=89=8D=E7=AB=AF=20=E7=9C=81=E5=B8=82?=
 =?UTF-8?q?=E5=8C=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test_client/package-lock.json              |  19 ++
 test_client/package.json                   |   1 +
 test_client/src/views/crm/company.vue      | 344 +++++++++++++--------
 test_client/src/views/crm/companychose.vue |  14 +-
 4 files changed, 243 insertions(+), 135 deletions(-)

diff --git a/test_client/package-lock.json b/test_client/package-lock.json
index 2f08d37..d8ada6d 100644
--- a/test_client/package-lock.json
+++ b/test_client/package-lock.json
@@ -3449,6 +3449,11 @@
       "integrity": "sha1-M1bMoZyIlUTy16le1JzlCKDs9VI=",
       "dev": true
     },
+    "china-area-data": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/china-area-data/-/china-area-data-5.0.1.tgz",
+      "integrity": "sha512-BQDPpiv5Nn+018ekcJK2oSD9PAD+E1bvXB0wgabc//dFVS/KvRqCgg0QOEUt3vBkx9XzB5a9BmkJCEZDBxVjVw=="
+    },
     "chokidar": {
       "version": "2.1.8",
       "resolved": "https://registry.npm.taobao.org/chokidar/download/chokidar-2.1.8.tgz",
@@ -5028,6 +5033,15 @@
       "integrity": "sha1-8Tl6Yzw15yZzDCS+EITNJcPugUg=",
       "dev": true
     },
+    "element-china-area-data": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/element-china-area-data/-/element-china-area-data-5.0.2.tgz",
+      "integrity": "sha512-vLQuvOKJy/uiX7MRHEk3x/j09hipuIl6DJ/C4XFUG7D7Pj3O47sy+Y6aAArM6k9v8cD9UX6e+yz2S4J+IPnZ8g==",
+      "requires": {
+        "china-area-data": "^5.0.1",
+        "lodash-es": "^4.17.15"
+      }
+    },
     "element-ui": {
       "version": "2.13.0",
       "resolved": "https://registry.npm.taobao.org/element-ui/download/element-ui-2.13.0.tgz",
@@ -9884,6 +9898,11 @@
       "integrity": "sha1-tEf2ZwoEVbv+7dETku/zMOoJdUg=",
       "dev": true
     },
+    "lodash-es": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
+    },
     "lodash.defaultsdeep": {
       "version": "4.6.1",
       "resolved": "https://registry.npm.taobao.org/lodash.defaultsdeep/download/lodash.defaultsdeep-4.6.1.tgz?cache=0&sync_timestamp=1562718178896&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Flodash.defaultsdeep%2Fdownload%2Flodash.defaultsdeep-4.6.1.tgz",
diff --git a/test_client/package.json b/test_client/package.json
index ebf1374..38a1712 100644
--- a/test_client/package.json
+++ b/test_client/package.json
@@ -17,6 +17,7 @@
   "dependencies": {
     "axios": "0.18.1",
     "echarts": "^4.7.0",
+    "element-china-area-data": "^5.0.2",
     "element-ui": "2.13.0",
     "file-saver": "^2.0.2",
     "js-cookie": "2.2.0",
diff --git a/test_client/src/views/crm/company.vue b/test_client/src/views/crm/company.vue
index 2fc62c7..7925ef3 100644
--- a/test_client/src/views/crm/company.vue
+++ b/test_client/src/views/crm/company.vue
@@ -1,138 +1,180 @@
 <template>
   <div class="app-container">
-        <div style="margin-top:10px">
-          <el-input
-            v-model="listQuery.search"
-            placeholder="输入部门名称进行搜索"
-            style="width: 200px;"
-            class="filter-item"
-            @keyup.enter.native="handleFilter"
-          />
-          <el-button type="primary" @click="handleAdd" icon="el-icon-plus" v-if ="checkPermission(['company_create'])">新增</el-button>
-                <el-button
+    <div style="margin-top: 10px">
+      <el-input
+        v-model="listQuery.search"
+        placeholder="输入部门名称进行搜索"
+        style="width: 200px"
+        class="filter-item"
+        @keyup.enter.native="handleFilter"
+      />
+      <el-button
+        type="primary"
+        @click="handleAdd"
+        icon="el-icon-plus"
+        v-if="checkPermission(['company_create'])"
+        >新增</el-button
+      >
+      <el-button
         class="filter-item"
         type="primary"
         icon="el-icon-refresh-left"
         @click="resetFilter"
-      >刷新重置</el-button>
+        >刷新重置</el-button
+      >
       <el-button
         type="primary"
         @click="handleTrans"
         v-if="checkPermission(['consumer__transfers'])"
-      >批量移交</el-button>
-        </div>
-        
-        <el-table
-          :data="tableData.results"
-          style="width: 100%;margin-top:10px;"
-          border
-          fit
-          v-loading="listLoading"
-          highlight-current-row
-          max-height="600"
-          row-key="id"
-          default-expand-all
-          :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
-          @selection-change="handleSelectionChange"
-        >
-          <el-table-column type="selection" width="40"></el-table-column>
-          <el-table-column label="单位名称">
-            <template slot-scope="scope">{{ scope.row.name }}</template>
-          </el-table-column>
-          
-          <el-table-column label="所在地区">
-            <template slot-scope="scope" v-if="scope.row.geo">
-              <span v-if="scope.row.geo.pname">{{ scope.row.geo.pname }}</span>
-              <span v-if="scope.row.geo.cityname">/{{ scope.row.geo.cityname }}</span>
-              <span v-if="scope.row.geo.adname">/{{ scope.row.geo.adname }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column label="创建日期">
-            <template slot-scope="scope">
-              <span>{{ scope.row.create_time }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column label="所属">
-            <template slot-scope="scope">
-              <span>{{ scope.row.create_admin_name }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" label="操作" fixed="right">
-            <template slot-scope="scope">
-              <el-button-group>
-              <el-button
-                type="primary"
-                size="small"
-                @click="handleEdit(scope)"
-                icon="el-icon-edit"
-                :disabled="!checkPermission(['company_update'])"
-              ></el-button>
-              <el-button
-                type="danger"
-                size="small"
-                @click="handleDelete(scope)"
-                icon="el-icon-delete"
-                :disabled="!checkPermission(['company_delete'])"
-              ></el-button>
-              <el-button 
+        >批量移交</el-button
+      >
+    </div>
+
+    <el-table
+      :data="tableData.results"
+      style="width: 100%; margin-top: 10px"
+      border
+      fit
+      v-loading="listLoading"
+      highlight-current-row
+      max-height="600"
+      row-key="id"
+      default-expand-all
+      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="40"></el-table-column>
+      <el-table-column label="单位名称">
+        <template slot-scope="scope">{{ scope.row.name }}</template>
+      </el-table-column>
+
+      <el-table-column label="所在地区">
+        <template slot-scope="scope" v-if="scope.row.geo">
+          <span v-if="scope.row.geo.pname">{{ scope.row.geo.pname }}</span>
+          <span v-if="scope.row.geo.cityname"
+            >/{{ scope.row.geo.cityname }}</span
+          >
+          <span v-if="scope.row.geo.adname">/{{ scope.row.geo.adname }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="创建日期">
+        <template slot-scope="scope">
+          <span>{{ scope.row.create_time }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="所属">
+        <template slot-scope="scope">
+          <span>{{ scope.row.create_admin_name }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="操作" fixed="right">
+        <template slot-scope="scope">
+          <el-button-group>
+            <el-button
+              type="primary"
+              size="small"
+              @click="handleEdit(scope)"
+              icon="el-icon-edit"
+              :disabled="!checkPermission(['company_update'])"
+            ></el-button>
+            <el-button
+              type="danger"
+              size="small"
+              @click="handleDelete(scope)"
+              icon="el-icon-delete"
+              :disabled="!checkPermission(['company_delete'])"
+            ></el-button>
+            <el-button
               v-if="checkPermission(['company_transfer'])"
-              type="primary" 
+              type="primary"
               size="small"
               @click="transfer(scope)"
-              >移交</el-button>
-              </el-button-group>
-            </template>
-          </el-table-column>
-        </el-table>
+              >移交</el-button
+            >
+          </el-button-group>
+        </template>
+      </el-table-column>
+    </el-table>
     <pagination
-      v-show="tableData.count>0"
+      v-show="tableData.count > 0"
       :total="tableData.count"
       :page.sync="listQuery.page"
       :limit.sync="listQuery.limit"
       @pagination="getList"
     />
-    <el-dialog :visible.sync="dialogVisible" :title="dialogType==='edit'?'编辑单位':'新增单位'" >
-      <el-form :model="company" label-width="80px" label-position="right" :rules="rule1" ref="companyForm">
+    <el-dialog
+      :visible.sync="dialogVisible"
+      :title="dialogType === 'edit' ? '编辑单位' : '新增单位'"
+    >
+      <el-form
+        :model="company"
+        label-width="80px"
+        label-position="right"
+        :rules="rule1"
+        ref="companyForm"
+      >
         <el-form-item label="名称" prop="name">
           <el-input v-model="company.name" placeholder="名称" />
         </el-form-item>
+        <el-form-item label="所在地" prop="regin">
+          <el-cascader
+            size="large"
+            :options="regionData"
+            @change="handleRChange"
+            style="width: 100%"
+            clearable
+            v-model="company.geo_"
+          >
+               
+          </el-cascader>
+        </el-form-item>
       </el-form>
-      <div style="text-align:right;">
-        <el-button type="danger" @click="dialogVisible=false">取消</el-button>
-        <el-button type="primary" @click="confirmCompany('companyForm')">确认</el-button>
+      <div style="text-align: right">
+        <el-button type="danger" @click="dialogVisible = false">取消</el-button>
+        <el-button type="primary" @click="confirmCompany('companyForm')"
+          >确认</el-button
+        >
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { getCompanyList, createCompany, deleteCompany, updateCompany, transferCompany, transferCompanys } from "@/api/crm";
+import {
+  getCompanyList,
+  createCompany,
+  deleteCompany,
+  updateCompany,
+  transferCompany,
+  transferCompanys,
+} from "@/api/crm";
 import { deepClone } from "@/utils";
 import checkPermission from "@/utils/permission";
-import Pagination from "@/components/Pagination"
-
-
+import Pagination from "@/components/Pagination";
+import { regionData, CodeToText, TextToCode } from "element-china-area-data";
 
 const defaultCompany = {
-        id: "",
-        name: "",
-      };
+  id: "",
+  name: "",
+  geo: null,
+};
 const listQuery = {
   page: 1,
   limit: 20,
-  search: ""
-}
+  search: "",
+};
 export default {
   components: { Pagination },
   data() {
     return {
-      selects:[],
+      regionData: regionData,
+      selects: [],
       company: {
         id: "",
         name: "",
       },
-      listQuery:listQuery,
-      tableData: {count:0},
+      listQuery: listQuery,
+      tableData: { count: 0 },
       listLoading: true,
       dialogVisible: false,
       dialogType: "new",
@@ -152,17 +194,17 @@ export default {
   methods: {
     checkPermission,
     getList() {
-      this.listLoading = true
-      getCompanyList(this.listQuery).then(response => {
-        this.tableData = response.data
-        this.listLoading = false
+      this.listLoading = true;
+      getCompanyList(this.listQuery).then((response) => {
+        this.tableData = response.data;
+        this.listLoading = false;
       });
     },
     resetFilter() {
       this.listQuery = {
         page: 1,
         limit: 20,
-        search: ""
+        search: "",
       };
       this.getList();
     },
@@ -180,6 +222,23 @@ export default {
     },
     handleEdit(scope) {
       this.company = Object.assign({}, scope.row); // copy obj
+      this.company.geo_ = ["", "", ""];
+      if (scope.row.geo) {
+        if (scope.row.geo.pname) {
+          this.company.geo_[0] = TextToCode[scope.row.geo.pname].code;
+          if (scope.row.geo.cityname) {
+            this.company.geo_[1] =
+              TextToCode[scope.row.geo.pname][scope.row.geo.cityname].code;
+            if (scope.row.geo.adname) {
+              this.company.geo_[2] =
+                TextToCode[scope.row.geo.pname][scope.row.geo.cityname][
+                  scope.row.geo.adname
+                ].code;
+            }
+          }
+        }
+      }
+
       this.dialogType = "edit";
       this.dialogVisible = true;
       this.$nextTick(() => {
@@ -190,37 +249,37 @@ export default {
       this.$confirm("确认删除该单位吗?将丢失数据!", "警告", {
         confirmButtonText: "确认",
         cancelButtonText: "取消",
-        type: "error"
+        type: "error",
       })
         .then(async () => {
           await deleteCompany(scope.row.id);
-          this.getList()
+          this.getList();
           this.$message({
             type: "success",
-            message: "成功删除!"
+            message: "成功删除!",
           });
         })
-        .catch(err => {
+        .catch((err) => {
           // console.error(err);
         });
     },
     async confirmCompany(form) {
-      this.$refs[form].validate(valid => {
+      this.$refs[form].validate((valid) => {
         if (valid) {
           const isEdit = this.dialogType === "edit";
           if (isEdit) {
             updateCompany(this.company.id, this.company).then(() => {
               this.getList();
               this.dialogVisible = false;
-              this.$message.success('成功')
+              this.$message.success("成功");
             });
           } else {
-            createCompany(this.company).then(res => {
+            createCompany(this.company).then((res) => {
               // this.company = res.data
               // this.tableData.unshift(this.company)
               this.getList();
               this.dialogVisible = false;
-              this.$message.success('成功')
+              this.$message.success("成功");
             });
           }
         } else {
@@ -229,47 +288,72 @@ export default {
       });
     },
     transfer(scope) {
-        this.$prompt('请输入管理员账号以确认将('+scope.row.name + ')及其学员转交给他', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
+      this.$prompt(
+        "请输入管理员账号以确认将(" + scope.row.name + ")及其学员转交给他",
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
           // inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
           // inputErrorMessage: '邮箱格式不正确'
-        }).then(({ value }) => {
-          transferCompany(scope.row.id, {'admin':value}).then(res=>{
-            this.$message.success('转交成功!')
-            this.getList()
-          })
-        }).catch(() => {      
-        });
-      },
-      handleSelectionChange(val) {
+        }
+      )
+        .then(({ value }) => {
+          transferCompany(scope.row.id, { admin: value }).then((res) => {
+            this.$message.success("转交成功!");
+            this.getList();
+          });
+        })
+        .catch(() => {});
+    },
+    handleSelectionChange(val) {
       let selects = [];
       for (var i = 0; i < val.length; i++) {
         selects.push(val[i].id);
       }
       this.selects = selects;
     },
-      handleTrans() {
+    handleRChange(val) {
+      if (val[0] != "") {
+        this.company.geo.pname = CodeToText[val[0]];
+        if (val[1] != "") {
+          this.company.geo.cityname = CodeToText[val[1]];
+          if (val[2] != "") {
+            this.company.geo.adname = CodeToText[val[2]];
+          }
+        }
+      }
+    },
+    handleTrans() {
       if (this.selects.length) {
-        this.$prompt('请输入管理员账号以确认将'+this.selects.length + '家企业及其学员转交给他', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          // inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
-          // inputErrorMessage: '邮箱格式不正确'
-        }).then(({ value }) => {
-          transferCompanys({admin:value, companys:this.selects}).then(res=>{
-            this.$message.success('转交成功!')
-            this.getList()
+        this.$prompt(
+          "请输入管理员账号以确认将" +
+            this.selects.length +
+            "家企业及其学员转交给他",
+          "提示",
+          {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            // inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
+            // inputErrorMessage: '邮箱格式不正确'
+          }
+        )
+          .then(({ value }) => {
+            transferCompanys({ admin: value, companys: this.selects }).then(
+              (res) => {
+                this.$message.success("转交成功!");
+                this.getList();
+              }
+            );
           })
-        }).catch(() => {      
-        });
+          .catch(() => {});
       } else {
         this.$message({
           message: "请先选择",
           type: "warning",
         });
       }
-      }
-  }
+    },
+  },
 };
 </script>
diff --git a/test_client/src/views/crm/companychose.vue b/test_client/src/views/crm/companychose.vue
index a264943..49b67a9 100644
--- a/test_client/src/views/crm/companychose.vue
+++ b/test_client/src/views/crm/companychose.vue
@@ -32,11 +32,15 @@
           <el-table-column label="单位名称">
             <template slot-scope="scope">{{ scope.row.name }}</template>
           </el-table-column>
-          <el-table-column label="创建日期">
-            <template slot-scope="scope">
-              <span>{{ scope.row.create_time }}</span>
-            </template>
-          </el-table-column>
+          <el-table-column label="所在地区">
+        <template slot-scope="scope" v-if="scope.row.geo">
+          <span v-if="scope.row.geo.pname">{{ scope.row.geo.pname }}</span>
+          <span v-if="scope.row.geo.cityname"
+            >/{{ scope.row.geo.cityname }}</span
+          >
+          <span v-if="scope.row.geo.adname">/{{ scope.row.geo.adname }}</span>
+        </template>
+      </el-table-column>
           <el-table-column align="center" label="操作">
             <template slot-scope="scope">
               <el-button