Merge pull request 'feat : 通讯录管理' (#57) from dd into master

Reviewed-on: http://git.feashow.cn/feashow/SmartOpsWeb/pulls/57
2024-09-15 14:59:02 +00:00
parent c38ed50d8b 1fcaddb5d5
commit dc802bc199
5 changed files with 300 additions and 78 deletions
--- a/src/views/phone-traffic-management/address-book-management/index.vue
+++ b/src/views/phone-traffic-management/address-book-management/index.vue
@@ -1,29 +1,105 @@
 <template>
-  <fvSearchForm :searchConfig="searchConfig" @search="search">
-  </fvSearchForm>
-  <fvTable ref="tableIns" :tableConfig="tableConfig" :data="mockData" @headBtnClick="headBtnClick"></fvTable>
+  <fvSearchForm :searchConfig="searchConfig" @search="search"></fvSearchForm>
+  <fvTable ref="tableIns" :tableConfig="tableConfig" @headBtnClick="headBtnClick"></fvTable>
+  <fvFormDialog ref="formDialogRef" :isVisited="showAddOrEditAddressBookDialog"  :title="dialogTitle" :dialogType="dialogType"
+                :form-schema="formSchema" :form-rules="formRules" @dialogCancel="handleCancel"
+                @dialogSubmit="handleSubmit"></fvFormDialog>
 </template>

 <script setup lang="jsx">
+import fvSelect from '@/fvcomponents/fvSelect/index.vue'
+import {addContact,editContact,getContactDetail,deleteContact} from "@/api/address-book";
+import {ElMessage, ElMessageBox} from "element-plus";
+
 const router = useRouter()
 const tableIns = ref()
-const mockData = ref([
-  {
-    workOrderNumber: 1211,
-    workOrderTime: '2022-02-09 00 : 12',
-    state: 0,
-    callState: 0
-  },
-  {
-    workOrderNumber: 232,
-    state: 1,
-    callState: 1
-  }
-])
+const formDialogRef = ref()
+const dialogTitle = ref("");
+const dialogType = ref("");
+const formRules = reactive({
+  siteName: [
+    {required: true, message: "请输入电站", trigger: ["change", "blur"]}
+  ],
+  role: [
+    {required: true, message: "请选择角色", trigger: ["change", "blur"]}
+  ],
+  name: [
+    {required: true, message: "请输入姓名", trigger: ["change", "blur"]}
+  ],
+  phone: [
+    {required: true, message: "请输入手机号", trigger: ["change", "blur"]}
+  ]
+});
+const formSchema = computed(() => {
+  return [
+    {
+      label: '电站',
+      prop: 'siteName',
+      component: 'el-input',
+      colProps: {
+        span: 24
+      },
+      props: {
+        placeholder: '请输入电站',
+        clearable: true,
+      }
+    },
+    {
+      label: '角色',
+      prop: 'role',
+      component: shallowRef(fvSelect),
+      colProps: {
+        span: 24
+      },
+      props: {
+        placeholder: '请选择角色',
+        cacheKey: 'address_book_role',
+        clearable: true,
+        filterable: true,
+      }
+    },
+    {
+      label: '姓名',
+      prop: 'name',
+      component: 'el-input',
+      colProps: {
+        span: 24
+      },
+      props: {
+        placeholder: '请输入姓名',
+        clearable: true,
+      }
+    },
+    {
+      label: '手机号',
+      prop: 'phone',
+      component: 'el-input',
+      colProps: {
+        span: 24
+      },
+      props: {
+        placeholder: '请输入手机号',
+        clearable: true,
+      },
+    },
+    {
+      label: '规则',
+      prop: 'rule',
+      component: 'el-input',
+      colProps: {
+        span: 24
+      },
+      props: {
+        placeholder: '请输入规则',
+        clearable: true,
+      },
+    }
+  ]
+})
 const searchConfig = reactive([
  {
    label: '电站',
-    prop: 'requirementName',
+    prop: 'siteName',
    props: {
      placeholder: '请输入电站查询',
      clearable: true,
@@ -33,17 +109,18 @@ const searchConfig = reactive([
  },
  {
    label: '角色',
-    prop: 'requirementName',
+    prop: 'role',
+    component: shallowRef(fvSelect),
    props: {
-      placeholder: '请输入角色查询',
+      placeholder: '请选择角色查询',
+      cacheKey: 'address_book_role',
      clearable: true,
-      checkStrictly: true
+      filterable: true,
    },
-    component: 'el-input',
  },
  {
    label: '姓名',
-    prop: 'requirementName',
+    prop: 'name',
    props: {
      placeholder: '请输入姓名查询',
      clearable: true,
@@ -62,37 +139,85 @@ const tableConfig = reactive({
      width: 80,
    },
    {
-      prop: 'workOrderNumber',
+      prop: 'siteName',
      label: '电站',
      align: 'center'
    },
-    {
-      prop: 'workOrderNumber',
+    {//0：运维；1：地面调度；2：现场调度
+      prop: 'role',
      label: '角色',
-      align: 'center'
+      align: 'center',
+      showOverflowTooltip: false,
+      currentRender: ({row, index}) => {
+        if (row.role !== null) {
+          return (<Tag dictType={'address_book_role'} value={row.role}/>)
+        } else {
+          return '--'
+        }
+      }
    },
    {
-      prop: 'workOrderNumber',
+      prop: 'name',
      label: '姓名',
      align: 'center'
    },
    {
-      prop: 'workOrderNumber',
+      prop: 'phone',
      label: '手机号',
      align: 'center'
    },
    {
-      prop: 'workOrderNumber',
+      prop: 'rule',
      label: '规则',
      align: 'center'
+    },
+    {
+      prop: 'oper',
+      label: '操作',
+      align: 'center',
+      fixed: 'right',
+      width: 150,
+      showOverflowTooltip: false,
+      currentRender: ({ row, index }) => {
+        let btn = []
+        btn.push({ label: '编辑', func: () => handleEdit(row), type: 'primary' })
+        btn.push({ label: '删除', func: () => handleDelete(row), type: 'danger' })
+        return (
+            <div style={{ width: '100%' }}>
+              {
+                btn.map(item => (
+                    <el-button
+                        type={item.type}
+                        // v-perm={item.prem}
+                        onClick={() => item.func()}
+                        link
+                    >
+                      {item.label}
+                    </el-button>
+                ))
+              }
+            </div>
+        )
+      }
    }
  ],
-  api: '',
+  api: '/contact/list',
  params: {},
  btns: [
-    {name: '新增', key: 'add',type:'primary',icon:'Plus'},
+    {name: '新增', key: 'add', type: 'primary', icon: 'Plus'},
  ]
 })
+const search = (val) => {
+  let obj = {...val}
+  if (obj.dateValue) {
+    obj.startTime = obj.dateValue[0]
+    obj.endTime = obj.dateValue[1]
+    delete obj.dateValue
+  }
+  tableConfig.params = obj
+  tableIns.value.refresh()
+}
+
 const headBtnClick = (key) => {
  switch (key) {
    case 'add':
@@ -100,6 +225,80 @@ const headBtnClick = (key) => {
      break;
  }
 }
+
+const handleAdd = () => {
+  formDialogRef.value.openOrCloseDialog(true)
+  dialogTitle.value = "新增通讯录";
+  dialogType.value = "add";
+  nextTick(() => {
+    // 清空校验
+    formDialogRef.value.getFormInstance().clearValidate()
+    formDialogRef.value.getFormInstance().resetFields()
+  })
+}
+const handleEdit = (row) => {
+  formDialogRef.value.openOrCloseDialog(true)
+  getDetail(row)
+  dialogTitle.value = "编辑通讯录";
+  dialogType.value = "edit";
+}
+const getDetail=(row)=>{
+  getContactDetail(row.contactsId).then(res => {
+    if (res.code === 1000) {
+      ElMessage.success(res.msg)
+      nextTick(() => {
+        formDialogRef.value.getFormInstance().setValues(res.data)
+        // 清空校验
+        formDialogRef.value.getFormInstance().clearValidate()
+      })
+    } else {
+    }
+  })
+}
+const handleDelete = (row) => {
+  ElMessageBox.confirm(`确认删除姓名为${row.name}的通讯录吗?`, '系统提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  }).then(() => {
+    deleteContact(row.contactsId).then(res => {
+      if (res.code === 1000) {
+        ElMessage.success(res.msg)
+        tableIns.value.refresh()
+      } else {
+        ElMessage.error(res.msg)
+      }
+    })
+  })
+}
+
+//提交
+const handleSubmit = async (formInstance) => {
+  if (!formInstance) return;
+  let validate = await formInstance.validate()
+  if (!validate.isValidate) return;
+  if (dialogType.value === "add") {
+    addContact(formInstance.getValues()).then(res => {
+      if (res.code === 1000) {
+        ElMessage.success(res.msg);
+        tableIns.value.refresh()
+        formDialogRef.value.openOrCloseDialog(false)
+      } else {
+        ElMessage.error(res.msg);
+      }
+    });
+  } else {
+    editContact(formInstance.getValues()).then(res => {
+      if (res.code === 1000) {
+        ElMessage.success(res.msg);
+        tableIns.value.refresh()
+        formDialogRef.value.openOrCloseDialog(false)
+      } else {
+        ElMessage.error(res.msg);
+      }
+    });
+  }
+}
 </script>

 <style scoped>
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -1,7 +1,7 @@
 <template>
  <fvSearchForm :searchConfig="searchConfig" @search="search"></fvSearchForm>
  <fvTable ref="tableIns" :tableConfig="tableConfig" @headBtnClick="headBtnClick"></fvTable>
-  <fvFormDialog v-if="showAddOrEditUserDialog" ref="formDialogRef" :title="title" :form-schema="formSchema" :form-rules="formRules" @dialogCancel="handleCancel" @dialogSubmit="handleSubmit"></fvFormDialog>
+  <fvFormDialog v-if="showAddOrEditUserDialog" ref="formDialogRef" :title="dialogTitle" :form-schema="formSchema" :form-rules="formRules" @dialogCancel="handleCancel" @dialogSubmit="handleSubmit"></fvFormDialog>
 </template>

 <script setup>
@@ -12,6 +12,7 @@ import {useCacheStore} from "@/stores/cache.js";
 const tableIns = ref()
 const formDialogRef = ref()
 const showAddOrEditUserDialog = ref(false)
+const dialogTitle = ref("");
 const searchConfig = reactive([
  {
    label: '用户名称',
@@ -181,7 +182,7 @@ const handleAdd = () => {
  // showAddOrEditUserDialog.value = true
  // formRules.value.password[0].required = true
  // restForm();
-  // title.value = "新增用户";
+  // dialogTitle.value = "新增用户";
  // nextTick(()=>{
  //   // 清空校验
  //   formDialogRef.value.getFormInstance().clearValidate()
@@ -190,7 +191,6 @@ const handleAdd = () => {
 };
 //取消
 const handleCancel = () => {
-  // restForm();
  showAddOrEditUserDialog.value = false;
 };

@@ -199,35 +199,16 @@ const handleSubmit = async (formInstance) => {
  if (!formInstance) return;
  formInstance.validate(async (valid) => {
    if (!valid) return;
-    if (title.value === "新增用户") {
-      addUser(userForm.value).then(res => {
-        if (res.code === 1000) {
-          ElMessage.success(res.msg);
-          isVisited.value = false;
-        } else {
-          ElMessage.error(res.msg);
-        }
-      });
-    }
+    // if (title.value === "新增用户") {
+    //   addUser(userForm.value).then(res => {
+    //     if (res.code === 1000) {
+    //       ElMessage.success(res.msg);
+    //       isVisited.value = false;
+    //     } else {
+    //       ElMessage.error(res.msg);
+    //     }
+    //   });
+    // }
  })
 }
-
-const userForm = ref({});
-const formInstance = ref();
-const isVisited = ref(false);
-const title = ref("");
-// const restForm = () => {
-//   userForm.value = {
-//     userName: null,
-//     nickName: null,
-//     phoneNumber: null,
-//     email: null,
-//     password: null,
-//     sex: null,
-//     state: "1",
-//   };
-// };
-
-
-
 </script>