客户操作

src/components/common/departmentStaff.vue

@@ -29,7 +29,7 @@
                 <div class="flex-center">
                   <q-icon name="work" color="primary" v-if="item.Type == '1'" />
                   <q-icon name="person" color="accent" v-if="item.Type == '2'" />
-                  <span class="q-ml-sm">{{ item.Name }}</span>
+                  <span class="q-ml-sm">{{ item.DeptName }}</span>
                 </div>
                 <q-icon name="cancel" @click="delItem(item.Id, index)"></q-icon>
               </div>
@@ -40,7 +40,7 @@
 
       <q-card-actions align="right" class="bg-white text-teal">
         <q-btn flat label="取消" v-close-popup />
-        <q-btn color="primary" @click="goback" flat label="确定" />
+        <q-btn color="primary" @click="goback" unelevated label="确定" />
       </q-card-actions>
     </q-card>
   </q-dialog>
@@ -56,7 +56,7 @@
   }
   interface SelectParams {
     Id: string
-    Name: string
+    DeptName: string
     Type: number
   }
   export default {
@@ -153,7 +153,7 @@
              flag = false
           } else {
             ticketArr.value = JSON.parse(JSON.stringify(props.defaultArray))
-            console.log('默认值',ticketArr.value)
+            console.log('有默认值',ticketArr.value)
           }
          
         }
@@ -181,7 +181,7 @@
           if (flag == true) {
             selectArray.value.push({
               Id: j[props.nodeKey],
-              Name: j.DeptName,
+              DeptName: j.DeptName,
               Type: j.DataType
             })
           } else {

src/components/customer/request-group.vue

@@ -283,7 +283,6 @@
         }
       ]
       const init = () => {
-        console.log('init', props.defaultData)
         if (props.defaultData && props.defaultData.length > 0) {
           addMsg.value = []
           props.defaultData.map((e: any) => {
@@ -410,7 +409,6 @@
             IsCustom: 2
           }
           filedList.value.unshift(obj2)
-          console.log('标签', filedList.value)
         })
       }
       const deleteadd = index => {
@@ -463,7 +461,6 @@
         let find2: any = addMsg.value.find(e => {
           return e.Id == 17
         })
-        console.log('生日2', find2)
         if (find2) {
           filedList.value.map(_e => {
             if (_e.Id == 17) {
@@ -568,7 +565,6 @@
           const newVal=JSON.parse(JSON.stringify(val))
           const s= dayjs(newVal[0]).format(format)
           const e= dayjs(newVal[1]).format(format)
-        console.log(570,val,s,e)
         addMsg.value[y].StartValue = s
         addMsg.value[y].EndValue = e
       }

src/pages/customerManage/customerSet/components/CustomerOperation.vue

 <template>
   <div class="q-mt-md q-pa-md CustomerOperation flex">
     <div class="customer-operation-category">
+      <q-btn label="保存" @click="setCustomerConfig"></q-btn>
       <div v-for="item in leftList" :key="item.Id" :class="{ active: curItem == item.Id }"
         class="customer-operation-category--item" @click="changeActive(item)">{{ item.Name }}</div>
     </div>
@@ -18,103 +19,22 @@
               @click="checkedPublicGetDept" />
           </div>
           <div>
-            <div v-for="(item,index) in data.PublicGetDeptList" :key="index" class="dept-item">
+            <div v-for="(item,index) in PublicGetDeptNameList" :key="index" class="dept-item">
               <div class="flex justify-center items-center">
-                <q-icon name="work" color="primary" />
-                <span class="q-ml-sm">{{ item.Name }}</span>
+                <q-icon name="work" color="primary" v-if="item.Type==1" />
+                <q-icon name="person" color="primary" v-if="item.Type==2" />
+                <span class="q-ml-sm">{{ item.DeptName }}</span>
               </div>
             </div>
           </div>
         </div>
       </div>
       <div v-if="curItem == 2">
-        <div class="row">
-          <div class="collaborator-title">可放弃客户:</div>
-          <div class="col-10">
-            <div class="q-gutter-sm">
-              <q-radio v-model="data.AbandonType" :val="1" label="全部客户" />
-              <q-radio v-model="data.AbandonType" :val="2" label="部分客户" />
-            </div>
-            <div v-if="data.AbandonType == 2">
-              <requestGroup />
-            </div>
-          </div>
-        </div>
-        <div class="row">
-          <div class="collaborator-title">可操作员工:</div>
-          <div class="col-10">
-            <div class="flex items-center">
-              <q-toggle v-model="AbandonDeptState" @update:model-value="ChangeAbandonDeptState" />以下部门允许将客户放弃到公海
-              <q-btn color="primary" :disable="!AbandonDeptState" label="修改" unelevated size="xs" class="q-ml-lg"
-                @click="checkedPublicGetDept" />
-            </div>
-            <div>
-              <div v-for="(item,index) in data.AbandonDeptList" :key="index" class="dept-item">
-                <div class="flex justify-center items-center">
-                  <q-icon name="work" color="primary" />
-                  <span class="q-ml-sm">{{ item.Name }}</span>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-        <div class="row">
-          <div class="collaborator-title">放弃后审核:</div>
-          <div class="col-10">
-            <div class="flex items-center">
-              <q-toggle v-model="data.AbandonAudit" false-value="-1" />开启后，员工放弃客户时需要企微端设置的部门上级审批，审批同意后才可放弃。</div>
-          </div>
-        </div>
-        <div class="row">
-          <div class="collaborator-title" style="padding-top: 15px">放弃原因:</div>
-          <div class="col-10">
-            <draggable v-model="data.AbandonReasonList" tag="div" item-key="Id">
-              <template #item="{ element,index }">
-                <div class="flex items-center">
-                  <i class="iconfont icon-drag" style="font-size: 20px; color: #777"></i>
-                  <div class="AbandonReasonItem flex items-center">{{ element }}</div>
-                  <n-popover trigger="hover">
-                    <template #trigger>
-                      <i class="iconfont icon-edit_light" style="font-size: 20px; color: #111"
-                        @click="editAbandonReason(element,index)"></i>
-                    </template>
-                    <span>编辑</span>
-                  </n-popover>
-                  <n-popover trigger="hover">
-                    <template #trigger>
-                      <i class="iconfont icon-delete_light q-ml-md" style="font-size: 20px; color: #111"
-                        @click="delAbandonReaso(index)"></i>
-                    </template>
-                    <span>删除</span>
-                  </n-popover>
-                </div>
-              </template>
-            </draggable>
-            <div class="flex items-center q-pl-sm q-mt-md">
-              <q-btn color="primary" label="添加" unelevated class="q-ml-lg q-mr-md" @click="addAbandonReason" />
-              已设/可设上限：{{data.AbandonReasonList.length}}/10</div>
-            <q-dialog v-model="AbandonReasonDialog">
-              <q-card>
-                <q-card-section class="row items-center q-pb-none">
-                  <div class="text-h6" v-if="AbandonReasonType==0">添加</div>
-                  <div class="text-h6" v-if="AbandonReasonType==1">编辑</div>
-                  <q-space />
-                  <q-btn icon="close" flat round dense v-close-popup />
-                </q-card-section>
-
-                <q-card-section class="q-py-lg" style="width: 460px;max-width: 600px;">
-                  <n-input maxlength="10" size="large" v-model:value="AbandonReasonText" show-count clearable
-                    placeholder="请输入放弃原因" />
-                </q-card-section>
-
-                <q-card-actions align="right">
-                  <q-btn flat label="取消" color="primary" v-close-popup />
-                  <q-btn unelevated label="确定" color="primary" @click="saveAbandonReason" />
-                </q-card-actions>
-              </q-card>
-            </q-dialog>
-          </div>
-        </div>
+        <Abandon v-model:AabandonType="data.AbandonType" v-model:AbandonDept="data.AbandonDept"
+          v-model:AbandonAudit="data.AbandonAudit" :AbandonReasonList="data.AbandonReasonList"
+          v-model:AbandonReason="data.AbandonReason" v-model:AbandonSelectType="data.AbandonSelectType"
+          :AbandonEmpList="data.AbandonEmpList" :AbandonDeptList="data.AbandonDeptList"
+           />
       </div>
       <div v-if="curItem == 3" class="row">
         <div class="collaborator-title">申请成为协作人：</div>
@@ -124,7 +44,7 @@
             <q-btn color="primary" label="修改" unelevated size="xs" class="q-ml-lg" @click="checkedPublicGetDept" />
           </div>
           <div>
-            <div v-for="item in items" :key="item.id">{{ item }}</div>
+            <!-- <div v-for="item in items" :key="item.id">{{ item }}</div> -->
           </div>
         </div>
       </div>
@@ -136,7 +56,7 @@
             <q-btn color="primary" label="修改" unelevated size="xs" class="q-ml-lg" @click="checkedPublicGetDept" />
           </div>
           <div>
-            <div v-for="item in items" :key="item.id">{{ item }}</div>
+            <!-- <div v-for="item in items" :key="item.id">{{ item }}</div> -->
           </div>
           <div class="flex">
             <q-checkbox v-model="data.AddTeamDept" label="协作人被移除后（若该协作人已添加客户为好友），自动创建新的客户" />
@@ -226,8 +146,8 @@
         </div>
       </div>
     </div>
-    <departmentStaff v-model="showDptDialog" :defaultArray="DptDataTreeDefault" nodeKey="DeptId" 
-      labelKey="DeptName" childrenKey="ChildList" strategy="leaf" :treeData="DptDataTree" @select="getdpt" />
+    <departmentStaff v-model="showDptDialog" :defaultArray="DptDataTreeDefault" nodeKey="newId" labelKey="DeptName"
+      childrenKey="ChildList" strategy="leaf" :treeData="DptDataTree" @select="getdpt" />
   </div>
 </template>
 <script lang="ts">
@@ -236,14 +156,15 @@
     toRefs,
     reactive,
     defineComponent,
-    onMounted
+    onMounted,
+    provide,
+    watch,
   } from 'vue'
+  import message from '@/utils/message'
   import customerSetService from '@/api/customerSet'
   import customerService from '@/api/customer'
   import departmentStaff from '@/components/common/departmentStaff.vue'
-  import requestGroup from '@/components/customer/request-group.vue'
-  import draggable from 'vuedraggable'
-  import message from '@/utils/message'
+  import Abandon from "./CustomerOperationComponents/Abandon.vue"
   interface dataParams {
     data: {
         AbandonReasonList: string[]
@@ -254,8 +175,7 @@
   export default defineComponent({
     components: {
       departmentStaff,
-      requestGroup,
-      draggable
+      Abandon
     },
     setup() {
       const leftList = ref([{
@@ -296,6 +216,7 @@
         }
       ])
       let curItem = ref(1)
+      let DptDataTree = ref < any[] > ([])
       let data = reactive < dataParams > ({
         data: {
           IsPublicAudit: 1,
@@ -305,35 +226,33 @@
           AbandonReasonList: [],
         },
         PublicGetDeptState: false, //以下部门允许领取公海客户
-        AbandonDeptState: false, //以下部门允许将客户放弃到公海
+        PublicGetDeptNameList:[],//允许领取公海客户列表
         showDptDialog: false,
-        AbandonReasonDialog: false, //放弃原因弹窗
-        AbandonReasonText: "", //放弃原因
-        AbandonReasonIndex: 0, //放弃原因index
-        AbandonReasonType: 0, // 修改类型 0：新增,1：编辑
-        DptDataTree: [],
         DptDataTreeDefault: [], //部门默认值
       })
+      provide('DptDataTree', DptDataTree)
+      provide('data', data)
       const changeActive = item => {
         curItem.value = item.Id
       }
       //获取客户操作配置
       const getConfig = () => {
         customerSetService.getCustomerConfig({}).then(res => {
-          console.log('CONFIG', res.data.Data)
+          console.log('客户操作配置', res.data.Data)
           data.data = res.data.Data
           if (data.data.PublicGetDept == -1) {
             data.PublicGetDeptState = false
           } else {
             data.PublicGetDeptState = true
           }
+          
         })
       }
       const getDptTree = () => {
         customerService.getEmployeeData({}).then(res => {
-          data.DptDataTree = res.data.Data
-          if (data.dataTree.length == 0) return
-          data.DptDataTree.forEach(x => {
+          DptDataTree.value = res.data.Data
+          if (DptDataTree.value.length == 0) return
+          DptDataTree.value.forEach(x => {
             x.newId = x.DataType + '-' + x.DeptId
             if (x.ChildList && x.ChildList.length > 0) {
               getChildList(x.ChildList)
@@ -353,21 +272,23 @@
       const setCustomerConfig = () => {
         customerSetService.setCustomerConfig(data.data).then(res => {
           console.log('set', res.data.Data)
+          message.successMsg('设置成功')
+          getConfig()
         })
       }
       //部门弹窗
       const checkedPublicGetDept = () => {
         data.showDptDialog = true
         if (curItem.value === 1) {
-          data.DptDataTreeDefault = data.data.PublicGetDept.split(',')
+          // data.DptDataTreeDefault = data.data.PublicGetDept.split(',')
         } else if (curItem.value === 2) {
-          data.DptDataTreeDefault = data.data.AbandonDept.split(',')
+          // data.DptDataTreeDefault = data.data.AbandonDept.split(',')
         }
 
       }
       const getdpt = val => {
         data.showDptDialog = false
-        const ids = val.map(e => e.Id).toString()
+        const ids = val.map(e => e.Id.slice(2)).toString()
         const dept = JSON.parse(JSON.stringify(val))
         if (curItem.value === 1) {
           data.data.PublicGetDept = ids
@@ -377,7 +298,7 @@
           data.data.AbandonDept = ids
           data.data.AbandonDeptList = dept
         }
-        console.log('dpt', ids)
+        console.log('dpt', dept)
       }
       //以下部门允许领取公海客户
       const ChangePublicGetDeptState = (val) => {
@@ -385,44 +306,13 @@
           data.data.PublicGetDept = '-1'
         }
       }
-      //以下部门允许将客户放弃到公海
-      const ChangeAbandonDeptState = (val) => {
-        if (!val) {
-          data.data.AbandonDept = '-1'
-        }
-      }
-      //新增放弃原因
-      const addAbandonReason = () => {
-        data.AbandonReasonDialog = true
-        data.AbandonReasonText = '',
-          data.AbandonReasonIndex = 0
-        data.AbandonReasonType = 0
-      }
-      //修改放弃原因
-      const editAbandonReason = (val, index) => {
-        data.AbandonReasonDialog = true
-        data.AbandonReasonText = val,
-          data.AbandonReasonIndex = index
-        data.AbandonReasonType = 1
-      }
-      //保存放弃原因
-      const saveAbandonReason = () => {
-        if (!data.AbandonReasonText) {
-          message.warnMsg('不能为空')
-          return
-        }
-        if (data.AbandonReasonType === 0) {
-          data.data.AbandonReasonList.push(data.AbandonReasonText)
-        } else {
-          data.data.AbandonReasonList[data.AbandonReasonIndex] = data.AbandonReasonText
-        }
-        data.AbandonReasonDialog = false
-        data.AbandonReasonText = ''
-      }
-      // 删除放弃原因
-      const delAbandonReaso = (index) => {
-        data.data.AbandonReasonList.splice(index, 1)
-      }
+
+      watch(() => data.data, val => {
+        console.log('watch', val)
+      }, {
+        deep: true
+      })
+
       onMounted(() => {
         getDptTree()
         getConfig()
@@ -432,15 +322,11 @@
         curItem,
         changeActive,
         ...toRefs(data),
+        DptDataTree,
         getdpt,
         checkedPublicGetDept,
         setCustomerConfig,
-        addAbandonReason,
-        editAbandonReason,
-        saveAbandonReason,
-        delAbandonReaso,
         ChangePublicGetDeptState,
-        ChangeAbandonDeptState,
       }
     }
   })
@@ -483,17 +369,6 @@
     overflow: auto;
   }
 
-  .AbandonReasonItem {
-    width: 453px;
-    height: 50px;
-    line-height: 50px;
-    padding-left: 22px;
-    background-color: #fff;
-    border-radius: 5px;
-    border: 1px solid #d7d7d7;
-    margin: 10px;
-  }
-
   .collaborator-title {
     min-width: 80px;
     line-height: 40px;

src/pages/customerManage/customerSet/components/CustomerOperationComponents/Abandon.vue

+<template>
+  <div>
+    <div class="row">
+      <div class="collaborator-title">可放弃客户:</div>
+      <div class="col-10">
+        <div class="q-gutter-sm">
+          <q-radio v-model="Type" :val="1" @update:model-value="changeAbandonType" label="全部客户" />
+          <q-radio v-model="Type" :val="2" @update:model-value="changeAbandonType" label="部分客户" />
+        </div>
+        <div v-if="Type == 2">
+          <requestGroup v-model:addCondition="SelectType" :defaultData="AbandonKHSelect" @change="getCondition"/>
+        </div>
+      </div>
+    </div>
+    <div class="row">
+      <div class="collaborator-title">可操作员工:</div>
+      <div class="col-10">
+        <div class="flex items-center">
+          <q-toggle v-model="AbandonDeptState" @update:model-value="ChangeAbandonDeptState" />以下部门允许将客户放弃到公海
+          <q-btn color="primary" :disable="!AbandonDeptState" label="修改" unelevated size="xs" class="q-ml-lg"
+            @click="checkedPublicGetDept" />
+        </div>
+        <div>
+          <div v-for="(item, index) in AbandonDeptNameList" :key="index" class="dept-item">
+            <div class="flex justify-center items-center">
+              <q-icon name="work" color="primary" v-if="item.Type == 1" />
+              <q-icon name="person" color="primary" v-if="item.Type == 2" />
+              <span class="q-ml-sm">{{ item.DeptName }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="row">
+      <div class="collaborator-title">放弃后审核:</div>
+      <div class="col-10">
+        <div class="flex items-center">
+          <q-toggle v-model="Audit" :true-value="1" :false-value="2" @update:model-value="ChangeAbandonAuditState" />
+          开启后，员工放弃客户时需要企微端设置的部门上级审批，审批同意后才可放弃。</div>
+      </div>
+    </div>
+    <div class="row">
+      <div class="collaborator-title" style="padding-top: 15px">放弃原因:</div>
+      <div class="col-10">
+        <draggable v-model="ReasonList" tag="div" item-key="Id">
+          <template #item="{ element, index }">
+            <div class="flex items-center">
+              <i class="iconfont icon-drag" style="font-size: 20px; color: #777"></i>
+              <div class="AbandonReasonItem flex items-center">{{ element }}</div>
+              <n-popover trigger="hover">
+                <template #trigger>
+                  <i class="iconfont icon-edit_light" style="font-size: 20px; color: #111"
+                    @click="editAbandonReason(element, index)"></i>
+                </template>
+                <span>编辑</span>
+              </n-popover>
+              <n-popover trigger="hover">
+                <template #trigger>
+                  <i class="iconfont icon-delete_light q-ml-md" style="font-size: 20px; color: #111"
+                    @click="delAbandonReaso(index)"></i>
+                </template>
+                <span>删除</span>
+              </n-popover>
+            </div>
+          </template>
+        </draggable>
+        <div class="flex items-center q-pl-sm q-mt-md">
+          <q-btn color="primary" label="添加" unelevated class="q-ml-lg q-mr-md" @click="addAbandonReason" />
+          已设/可设上限：{{ ReasonList.length }}/10
+        </div>
+        <q-dialog v-model="AbandonReasonDialog">
+          <q-card>
+            <q-card-section class="row items-center q-pb-none">
+              <div class="text-h6" v-if="AbandonReasonType == 0">添加</div>
+              <div class="text-h6" v-if="AbandonReasonType == 1">编辑</div>
+              <q-space />
+              <q-btn icon="close" flat round dense v-close-popup />
+            </q-card-section>
+
+            <q-card-section class="q-py-lg" style="width: 460px; max-width: 600px">
+              <n-input maxlength="10" size="large" v-model:value="AbandonReasonText" show-count clearable
+                placeholder="请输入放弃原因" />
+            </q-card-section>
+
+            <q-card-actions align="right">
+              <q-btn flat label="取消" color="primary" v-close-popup />
+              <q-btn unelevated label="确定" color="primary" @click="saveAbandonReason" />
+            </q-card-actions>
+          </q-card>
+        </q-dialog>
+      </div>
+    </div>
+    <departmentStaff v-model="DptDialog" :defaultArray="DptDataDefault" nodeKey="newId" labelKey="DeptName"
+      childrenKey="ChildList" strategy="leaf" :treeData="DptDataTree" @select="getAbandonDpt" />
+  </div>
+</template>
+
+<script lang="ts">
+  import {
+    ref,
+    toRefs,
+    reactive,
+    defineComponent,
+    inject,
+  } from 'vue'
+  import departmentStaff from '@/components/common/departmentStaff.vue'
+  import requestGroup from '@/components/customer/request-group.vue'
+  import draggable from 'vuedraggable'
+  import message from '@/utils/message'
+  interface dataParams {
+    AbandonReasonList: string[]
+      [key: string]: any
+  }
+  export default defineComponent({
+    components: {
+      departmentStaff,
+      requestGroup,
+      draggable
+    },
+    props: {
+      AabandonType: {
+        type: Number,
+        default: 1
+      },
+      AbandonDept: {
+        type: String,
+        default: "-1"
+      },
+      AbandonDeptList: {
+        type: Array,
+        default: () => []
+      },
+      AbandonEmpList: {
+        type: Array,
+        default: () => []
+      },
+      AbandonAudit: {
+        type: Number,
+        default: 2
+      },
+      AbandonReason: {
+        type: String,
+        default: ''
+      },
+      AbandonReasonList: {
+        type: Array,
+        default: () => []
+      },
+      AbandonSelectType: { //可放弃部分客户的查询类型 1并且 2或者
+        type: Number,
+        default: 1
+      },
+    },
+    setup(props, ctx) {
+      const DptDataTree: any = inject('DptDataTree')
+      const FaData: any = inject('data')
+      let DptDialog = ref(false)
+      let DptDataDefault = ref < string[] > ([])
+      let data = reactive < dataParams > ({
+        AbandonDeptNameList: [], //可放弃到公海的部门
+        AbandonReasonDialog: false, //放弃原因弹窗
+        AbandonReasonText: '', //放弃原因
+        AbandonReasonIndex: 0, //放弃原因index
+        AbandonReasonType: 0, //修改类型 0：新增,1：编辑
+        AbandonDeptState: false, //以下部门允许将客户放弃到公海
+        AbandonReasonList: [],
+      })
+      const ReasonList = ref(props.AbandonReasonList)
+
+      if (props.AbandonDept == '-1') {
+        data.AbandonDeptState = false
+      } else {
+        data.AbandonDeptState = true
+        const dept = props.AbandonDeptList.map((e: any) => '1-' + e.DeptId)
+        const deptName = props.AbandonDeptList.map((e: any) => {
+          e.Type = 1
+          return e
+        })
+        const emp = props.AbandonEmpList.map((e: any) => '2-' + e.DeptId)
+        const empName = props.AbandonEmpList.map((e: any) => {
+          e.Type = 2
+           return e
+        })
+        DptDataDefault.value = [...dept, ...emp]
+        data.AbandonDeptNameList = [...deptName, ...empName]
+      }
+      //以下部门允许将客户放弃到公海
+      const ChangeAbandonDeptState = (val) => {
+        if (!val) {
+          ctx.emit("update:AbandonDept", '-1')
+        }
+      }
+      //放弃后是否需要审核
+      const ChangeAbandonAuditState = (val) => {
+        ctx.emit("update:AbandonAudit", val)
+      }
+      //部门弹窗
+      const checkedPublicGetDept = () => {
+        DptDialog.value = true
+      }
+      const getAbandonDpt = val => {
+        DptDialog.value = false
+        const ids = val.map(e => e.Id.slice(2)).toString()
+        const dept = JSON.parse(JSON.stringify(val))
+        data.AbandonDeptNameList = dept
+        ctx.emit("update:AbandonDept", ids)
+      }
+      //新增放弃原因
+      const addAbandonReason = () => {
+        data.AbandonReasonDialog = true
+        data.AbandonReasonText = '',
+          data.AbandonReasonIndex = 0
+        data.AbandonReasonType = 0
+      }
+      //修改放弃原因
+      const editAbandonReason = (val, index) => {
+        data.AbandonReasonDialog = true
+        data.AbandonReasonText = val,
+          data.AbandonReasonIndex = index
+        data.AbandonReasonType = 1
+      }
+      //保存放弃原因
+      const saveAbandonReason = () => {
+        if (!data.AbandonReasonText) {
+          message.warnMsg('不能为空')
+          return
+        }
+        if (data.AbandonReasonType === 0) {
+          ReasonList.value.push(data.AbandonReasonText)
+        } else {
+          ReasonList.value[data.AbandonReasonIndex] = data.AbandonReasonText
+        }
+        ctx.emit("update:AbandonReason", ReasonList.value.toString())
+        data.AbandonReasonDialog = false
+        data.AbandonReasonText = ''
+      }
+      // 删除放弃原因
+      const delAbandonReaso = (index: number) => {
+        ReasonList.value.splice(index, 1)
+      }
+      const changeAbandonType = (val: number) => {
+        ctx.emit('update:AabandonType', val)
+      }
+      const getCondition=(val)=>{
+        FaData.data.AbandonKHSelect=JSON.parse(JSON.stringify(val))
+      }
+      return {
+        Type: ref(props.AabandonType),
+        Audit: ref(props.AbandonAudit),
+        SelectType: ref(props.AbandonSelectType),
+        AbandonKHSelect:ref(FaData.data.AbandonKHSelect),
+        ReasonList,
+        DptDataTree,
+        ...toRefs(data),
+        DptDialog,
+        DptDataDefault,
+        ChangeAbandonDeptState,
+        ChangeAbandonAuditState,
+        addAbandonReason,
+        editAbandonReason,
+        saveAbandonReason,
+        delAbandonReaso,
+        checkedPublicGetDept,
+        getAbandonDpt,
+        changeAbandonType,
+        getCondition
+      }
+    }
+  })
+
+</script>
+<style lang="scss" scoped>
+  .collaborator-title {
+    min-width: 80px;
+    line-height: 40px;
+    text-align: right;
+    margin-right: 10px;
+    font-weight: 600;
+    white-space: nowrap;
+  }
+
+  .AbandonReasonItem {
+    width: 453px;
+    height: 50px;
+    line-height: 50px;
+    padding-left: 22px;
+    background-color: #fff;
+    border-radius: 5px;
+    border: 1px solid #d7d7d7;
+    margin: 10px;
+  }
+
+  .dept-item {
+    border: 1px solid #e1f3d8;
+    background-color: #f0f9eb;
+    color: #67c23a;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    display: inline-block;
+    height: 32px;
+    line-height: 32px;
+    border-radius: 3px;
+    padding: 0 14px;
+    margin: 6px;
+  }
+
+</style>

src/pages/editor/createStageRange.vue

@@ -36,14 +36,14 @@
                             v-if="x.Id.slice(0, 1) == '1'"
                             text-color="white"
                             icon="work"
-                            :label="x.Name"
+                            :label="x.DeptName"
                         ></q-chip>
                         <q-chip
                             color="primary"
                             v-if="x.Id.slice(0, 1) == '2'"
                             text-color="white"
                             icon="person"
-                            :label="x.Name"
+                            :label="x.DeptName"
                         ></q-chip>
                     </div>
                 </div>