提交客户代码

fhKeeper/formulahousekeeper/customerBuler-crm/src/pages/contacts/api.ts

@@ -7,9 +7,13 @@ export const GETPERSONNEL = "/user/getSimpleActiveUserList";
 export const GETGENERATEFOEM = `sys-form/getListByCode/${MOD}`
 
 export const URL_PAGECONTACTS = `${URL}/pageContacts`
+export const URL_ADD = `${URL}/addContacts`
+export const URL_UPLOAD = `${URL}/updateContacts`
+export const URL_DETELERECYCLE =  `${URL}/deleteContacts`
+export const URL_BATCHDETELE = `${URL}/confirmDeleteContacts`
 
 export const actionButtons: any[] = [
-    { text: '新建' },
+    { text: '新建联系人' },
     { text: '批量删除' },
     { text: '导入' },
     { text: '导出' },

fhKeeper/formulahousekeeper/customerBuler-crm/src/pages/contacts/index.vue

@@ -25,12 +25,18 @@
       <div class="bg-white w-full h-full p-3 shadow-md rounded-md flex flex-col">
         <div class="flex justify-end pb-3">
           <!-- 操作按钮 -->
-          <el-button v-for="(button, index) in actionButtons" :key="index" type="primary">{{ button.text }}</el-button>
+          <!-- <el-button v-for="(button, index) in actionButtons" :key="index" type="primary">{{ button.text }}</el-button> -->
+          <el-button type="primary" @click="editContacts(false)">新建联系人</el-button>
+          <el-button type="primary" @click="batchDeteleItem" :disabled="batchTableData.length <= 0">批量删除</el-button>
+          <el-button type="primary">回收站</el-button>
+          <el-button type="primary">导入</el-button>
+          <el-button type="primary">导出</el-button>
         </div>
         <div class="flex-1 w-full overflow-hidden">
           <!-- 表格 -->
-          <el-table ref="clueTableRef" :data="formTable" border v-loading="allLoading.formTableLading"
-            style="width: 100%;height: 100%;">
+          <el-table ref="contactsTableRef" :data="formTable" border v-loading="allLoading.formTableLading"
+            style="width: 100%;height: 100%;" @selection-change="changeBatch">
+            <el-table-column type="selection" width="55" />
             <el-table-column v-for="(column, index) in tableColumns" :key="index" :prop="column.prop"
               :label="column.label" :width="column.width">
               <template #default="scope">
@@ -43,32 +49,59 @@
                 </template>
               </template>
             </el-table-column>
-            <el-table-column :label="'操作'" :width="'200px'" fixed="right">
+            <el-table-column :label="'操作'" :width="'140px'" fixed="right">
               <template #default="scope">
-                <el-button link type="primary" size="large">编辑</el-button>
-                <el-button link type="primary" size="large">新建任务</el-button>
-                <el-button link type="danger" size="large">删除</el-button>
+                <el-button link type="primary" size="large" @click="editContacts(scope.row)">编辑</el-button>
+                <el-button link type="danger" size="large"
+                  @click="contactsDeteleItem(scope.row.id, scope.row.customName)">删除</el-button>
               </template>
             </el-table-column>
           </el-table>
         </div>
         <div class="flex justify-end pt-3">
           <!-- 分页 -->
-          <el-pagination layout="total, prev, pager, next, sizes" :total="tableTotal" :hide-on-single-page="true" />
+          <el-pagination layout="total, prev, pager, next, sizes" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange" :total="tableTotal" :hide-on-single-page="true" />
         </div>
       </div>
     </div>
+
+    <!-- 弹窗 -->
+    <el-dialog v-model="allVisible.editContactsVisible" width="1000" :show-close="false" top="10vh">
+      <template #header="{ close, titleId, titleClass }">
+        <div class="flex justify-between items-center border-b pb-3 dialog-header">
+          <h4 :id="titleId">{{ allText.editContactsText }}</h4>
+          <div>
+            <el-button type="primary" :loading="allLoading.editContactsSaveLoading"
+              @click="editContactsSave(true)">保存并新建</el-button>
+            <el-button type="primary" :loading="allLoading.editContactsSaveLoading"
+              @click="editContactsSave(false)">保存</el-button>
+            <el-button @click="closeVisible('editContactsVisible')">取消</el-button>
+          </div>
+        </div>
+      </template>
+      <div class="h-[60vh] overflow-y-auto scroll-bar pt-3">
+        <div class="ml-4 mr-4">
+          <GenerateForm ref="contactsTemplateRef" :data="contactsTemplate" :value="contactsTemplateValue"
+            :key="contactsTemplateRefKey" v-loading="allLoading.contactsTemplateRefLoading" />
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script lang="ts" setup>
 import { ref, reactive, onMounted, inject } from "vue";
-import { getAllListByCode, getFromValue, resetFromValue, getFirstDayOfMonth, getLastDayOfMonth, formatDate } from '@/utils/tools'
+import { getAllListByCode, getFromValue, resetFromValue, getFirstDayOfMonth, getLastDayOfMonth, formatDate, getTemplateKey, confirmAction, createTaskFromType } from '@/utils/tools'
 import { post, get } from "@/utils/request";
-import { actionButtons, tableColumns, GETSYSFILED, GETPERSONNEL, GETGENERATEFOEM, MOD, URL_PAGECONTACTS, getSex } from "./api";
+import { actionButtons, tableColumns, GETSYSFILED, GETPERSONNEL, GETGENERATEFOEM, MOD, URL_PAGECONTACTS, getSex, URL_ADD, URL_UPLOAD, URL_BATCHDETELE, URL_DETELERECYCLE } from "./api";
 import { useRouter, useRoute } from "vue-router";
+import { GenerateForm } from '@zmjs/form-design';
+import { URL_FETALL } from "../customer/api";
+import { ElTable } from "element-plus";
 
 const router = useRouter()
+const globalPopup = inject<GlobalPopup>('globalPopup')
 
 const filterForm = reactive<FilterForm>({ // 筛选条件
   contactPerson: "",
@@ -95,16 +128,110 @@ const filterItems = ref<FilterItem[]>([
   { label: '负责人', key: 'responsibleId', type: 'select', options: selectData.Personnel },
   { label: '创建人', key: 'createId', type: 'select', options: selectData.Personnel },
 ])
-const generateFormData = ref([]) // 自定义表单数据
-
+const contactsTemplate = ref({
+  list: [],
+  config: {}
+})
+const contactsTemplateValue = ref({})
+const contactsTemplateRefKey = ref(1)
+const contactsTemplateRef = ref<typeof GenerateForm>()
+const contactsTableRef = ref<InstanceType<typeof ElTable>>()
 const formTable = ref([]) // 表格数据
+const batchTableData = ref([])
 const allLoading = reactive({ // 按钮加载 Loading
   formTableLading: false,
+  editContactsSaveLoading: false,
+  contactsTemplateRefLoading: false
 })
-const dialogVisible = reactive({
-
+const allVisible = reactive({
+  editContactsVisible: false,
+  taskModalVisible: false,
+})
+const allText = reactive({
+  editContactsText: '新建联系人',
 })
 
+// 方法
+
+function batchDeteleItem() {
+  const value = batchTableData.value.map((item: any) => item.id).join(',')
+  const label = batchTableData.value.map((item: any) => item.customName).join(',')
+  contactsDeteleItem(value, label, true)
+}
+
+function contactsDeteleItem(value: string | number, label: string, batch: boolean = false) {
+  confirmAction(`确定${batch ? '批量' : ''}删除【${label}】客户吗？`).then(() => {
+    let url = batch ? URL_BATCHDETELE : URL_DETELERECYCLE
+    post(url, { ids: value }).then(res => {
+      if (res.code != 'ok') {
+        globalPopup?.showError(res.msg)
+        return
+      }
+      globalPopup?.showSuccess('删除成功')
+      changeBatch(false)
+      getContactPerson()
+    }).catch((err) => {
+      globalPopup?.showError(err.message)
+    })
+  })
+}
+
+function changeBatch(flag: boolean = true) {
+  if (flag) {
+    batchTableData.value = contactsTableRef.value && contactsTableRef.value.getSelectionRows()
+  } else {
+    batchTableData.value = []
+    contactsTableRef.value && contactsTableRef.value.clearSelection()
+  }
+}
+
+
+function editContactsSave(flag: boolean) {
+  contactsTemplateRef.value?.getData().then((res: any) => {
+    allLoading.editContactsSaveLoading = true
+    let url = allText.editContactsText == '新建联系人' ? URL_ADD : URL_UPLOAD
+    post(url, { ...contactsTemplateValue.value, ...res }).then((_res) => {
+      allVisible.editContactsVisible = flag
+      globalPopup?.showSuccess('保存成功')
+      if (flag) {
+        contactsTemplateRef.value?.reset()
+        allText.editContactsText = '新建联系人'
+      }
+      getContactPerson()
+    }).finally(() => {
+      allLoading.editContactsSaveLoading = false
+    })
+  }).catch((_err: any) => {
+    console.log(_err)
+    globalPopup?.showError('请填写完整')
+  })
+}
+
+function editContacts(row: any) { // row 有数据代表编辑
+  showVisible('editContactsVisible')
+  if (row) {
+    const templateKey = getTemplateKey(contactsTemplate.value.list)
+    const formVal: templateKey = { id: row.id }
+    for (let i in templateKey) {
+      formVal[templateKey[i]] = templateKey[i] == 'sex' ? row[templateKey[i]] + '' : row[templateKey[i]]
+    }
+    setTemplateVal(formVal)
+    allText.editContactsText = '编辑联系人'
+  } else {
+    setTemplateVal()
+    allText.editContactsText = '新建联系人'
+  }
+}
+
+function setTemplateVal(val: any = {}) {
+  contactsTemplateValue.value = val
+  allLoading.contactsTemplateRefLoading = true
+  setTimeout(() => {
+    contactsTemplateRefKey.value++
+    allLoading.contactsTemplateRefLoading = false
+  }, 1000);
+}
+
 function toDetali(row: any) {
   router.push({
     path: `${MOD}/detail`,
@@ -116,7 +243,7 @@ function getContactPerson() {
   allLoading.formTableLading = true
   const formVal = getFromValue(filterForm)
   post(URL_PAGECONTACTS, { ...formVal, ...formTablePaging }).then((res) => {
-    const { records, total } =  res.data
+    const { records, total } = res.data
     formTable.value = records
     tableTotal.value = total
   }).finally(() => {
@@ -125,20 +252,12 @@ function getContactPerson() {
 }
 
 function resetForm() {
-  console.log('重置联系人');
+  let newResetForm = resetFromValue(filterForm)
+  Object.assign(filterForm, newResetForm)
+  getContactPerson()
 }
 
 async function getSystemField() {
-  const systemField = getAllListByCode([])
-  for (let i in systemField) {
-    const { data } = await get(`${GETSYSFILED}?code=${systemField[i]}`)
-    for (let key of Object.keys(selectData)) {
-      if (systemField[i] == key) {
-        Object.assign(selectData, { [key]: data })
-      }
-    }
-  }
-
   const { data } = await post(GETPERSONNEL, {})
   selectData.Personnel = data.map((item: any) => {
     const { id, name, phone, jobNumber } = item
@@ -147,12 +266,40 @@ async function getSystemField() {
     }
   })
 
-  // const res = await get(GETGENERATEFOEM)
-  // generateFormData.value = JSON.parse(res.data[0].config)
+  const res = await get(URL_FETALL, {})
+  selectData.Customer = (res.data || []).map((item: any) => {
+    const { id, customName } = item
+    return {
+      id,
+      name: customName
+    }
+  })
+
+  const datas = await get(GETGENERATEFOEM)
+  contactsTemplate.value = JSON.parse(datas.data[0].config)
 
   setFilterItems()
 }
 
+function handleSizeChange(val: number) {
+  formTablePaging.pageIndex = 1
+  formTablePaging.pageSize = val
+  getContactPerson()
+}
+
+function handleCurrentChange(val: number) {
+  formTablePaging.pageIndex = val
+  getContactPerson()
+}
+
+function showVisible(type: keyof typeof allVisible) {
+  allVisible[type] = true
+}
+
+function closeVisible(type: keyof typeof allVisible) {
+  allVisible[type] = false
+}
+
 function setFilterItems() {
   console.log(selectData)
   filterItems.value = [