业务员管理新建调整

src/Form/marketing2/saler/add.vue

@@ -87,7 +87,7 @@
 
 <script>
 import selectMenber from '@/components/selectMenber/index.vue'
-import areaList from "@/HManagement/marketing2/saler/area/modules/areaList";
+import areaList from "@/HManagement/marketing2/saler/area/modules/areaListNew";
 import {mapGetters} from 'vuex'
 export default {
   components:{

src/HManagement/marketing2/saler/area/modules/areaListNew.vue

@@ -0,0 +1,97 @@
+<template>
+  <div>
+    <el-popover
+        placement="bottom"
+        width="400"
+        trigger="click"
+        v-model="visible">
+      <el-tree
+          :data="areaList"
+          node-key="id"
+          default-expand-all
+          highlight-current
+          :expand-on-click-node="false"
+          @node-click="nodeClick"
+      >
+                  <span class="custom-tree-node" slot-scope="{ node, data }">
+                    <span>{{ node.label }}</span>
+                    <span>
+<!--                      <el-button size="small" type="text" @click="selectArea(data,visible=false)" v-if="data.areaname === pointValue" style="color: #FFFFFF">选 择</el-button>-->
+                      <el-button size="small" type="text" @click="selectArea(data,visible=false)" >选 择</el-button>
+                    </span>
+                  </span>
+      </el-tree>
+            <el-input slot="reference" v-model="areaname" readonly placeholder="请选择" autocomplete="off" @focus="onClick"></el-input>
+    </el-popover>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "areaList",
+  props:["areaname"],
+  data(){
+    return {
+      areaList:[],
+      visible:false,
+      pointValue:'',
+      param:{
+        classname: "webmanage.sale.salearea.salearea",
+        content: {},
+        method: "query_area"
+      }
+    }
+  },
+  methods:{
+    onClick(){
+      console.log('点击')
+      this.listData()
+    },
+    async listData(){
+      const res = await this.$api.requested(this.param)
+      console.log(res.data,'区域列表')
+      this.areaList = this.createMenu(res.data)
+      this.$emit('areaList',res.data)
+    },
+    createMenu (array) {
+      var that = this
+      let arr = []
+      function convertToElementTree(node) {
+        // 新节点
+        var elNode = {
+          label: node["areaname"],
+          sa_saleareaid:node['sa_saleareaid'],
+          children: []
+        }
+
+        if (node.subarea && node.subarea.length > 0) {
+          // 如果存在子节点
+          for (var index = 0; index < node.subarea.length; index++) {
+            // 遍历子节点, 把每个子节点看做一颗独立的树, 传入递归构造子树, 并把结果放回到新node的children中
+            elNode.children.push(convertToElementTree(node.subarea[index]));
+          }
+        }
+        return elNode;
+      }
+      array.forEach((element) => {
+        arr.push(convertToElementTree(element))
+      });
+      return arr
+    },
+    nodeClick(val){
+      this.pointValue = val.areaname
+    },
+    selectArea(data){
+      console.log(data,'选择区域')
+      this.$emit('selectArea',data)
+    }
+  },
+  mounted() {
+    this.listData()
+  }
+}
+</script>
+
+<style scoped>
+
+</style>