fix:消息列表

src/router/modules/content.ts

@@ -0,0 +1,42 @@
+import type { RouteRecordRaw } from 'vue-router'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: RouteRecordRaw = {
+  path: '/content',
+  component: Layout,
+  redirect: '/content/message',
+  name: 'Content',
+  meta: {
+    title: '内容管理',
+  },
+  children: [
+    {
+      path: 'message',
+      name: 'contentMessage',
+      component: () => import('@/views/contentManagement/message.vue'),
+      meta: {
+        title: '消息通知',
+
+      },
+      children:[
+        {
+          path: 'messageEdit',
+          name: 'messageEdit',
+          component: () => import('@/views/contentManagement/modules/addMessage.vue'),
+          meta: {
+            title: '消息通知',
+            menu:false
+          }, 
+        },
+        
+      ]
+    },
+    
+    
+   
+    
+  ],
+}
+
+export default routes

src/router/routes.ts

@@ -7,6 +7,7 @@ import { setupLayouts } from "virtual:meta-layouts";
 import representative from "./modules/representative";
 import operationManagement from "./modules/operation";
 import personnel from "./modules/personnel";
+import content from "./modules/content"
 // import {  } from "@/store/modules/user";
 // 固定路由（默认路由
 // console.log(useUserStore)
@@ -94,6 +95,13 @@ const asyncRoutes: Route.recordMainRaw[] = [
     },
     children: [representative],
   },
+  {
+    meta: {
+      title: "内容管理",
+      icon: "i-uim:box",
+    },
+    children: [content],
+  },
   
   // {
   //   meta: {

src/views/contentManagement/message.vue

@@ -0,0 +1,399 @@
+<template>
+  <div class="institution">
+    <div class="institution-main">
+          <el-form label-position="left" label-width="auto">
+            <el-row :gutter="24">
+              <el-col :span="6">
+                <el-form-item label="成员信息">
+                  <el-input
+                    v-model="formAccessibility.firstName"
+                    placeholder="输入成员信息查找"
+                    :prefix-icon="Search"
+                  />
+                </el-form-item>
+              </el-col>
+              <el-col :span="6">
+                <el-form-item label="归属机构">
+                  <el-cascader
+                    clearable
+                    style="width: 100%"
+                    v-model="info.deptId"
+                    :options="institutionList"
+                    :props="tableProps"
+                    
+                  />
+                </el-form-item>
+              </el-col>
+
+              <el-col :span="4">
+                <el-form-item label="">
+                  <el-button type="primary">查询</el-button>
+                  <el-button type="primary" plain @click="reset"
+                    >重置</el-button
+                  >
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+
+          <Table
+            :tableData="tableData"
+            :columns="columns"
+            :showIndex="false"
+            :showSelect="true"
+            :pageInfo="pageInfo"
+            @getList="getList"
+            :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
+            @select-all-change="selectAllChange"
+            @select-change="selectChange"
+          >
+            <template v-slot:table-title-btn>
+              <div>
+                <!-- <el-button type="primary" @click="add(ruleFormRef)">
+              <el-icon><Plus /></el-icon>添加机构</el-button
+            > -->
+                <el-button @click="router.push({path:'/content/message/messageEdit'})"><el-icon><Position /></el-icon>发布新的通知</el-button>
+              </div>
+            </template>
+            <template v-slot:operation="scope">
+              <el-button
+                type="primary"
+                link
+                @click="editor(scope.operationData.row)"
+              >
+                详情
+              </el-button>
+            </template>
+            <template v-slot:search="scope">
+              {{ scope.slotData.label }}
+            </template>
+          </Table>
+        </div>
+
+    
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, watch, onMounted } from "vue";
+import type {
+  ComponentSize,
+  FormInstance,
+  FormRules,
+  TabsPaneContext,
+} from "element-plus";
+import { Plus, Search,Position } from "@element-plus/icons-vue";
+import { useRouter } from "vue-router";
+
+// import universalTable from "../"
+import { ElMessage, ElMessageBox, ElPopconfirm, ElTree } from "element-plus";
+import api from "@/api";
+import { h } from "vue";
+import setDept from "@/components/DialogSetDeptLeader/index.vue";
+interface Tree {
+  [key: string]: any;
+}
+
+const filterText = ref("");
+const treeRef = ref<InstanceType<typeof ElTree>>();
+const activeName = ref("hold");
+const defaultProps = {
+  children: "children",
+  label: "label",
+};
+
+//批量设置负责人
+
+watch(filterText, (val) => {
+  treeRef.value!.filter(val);
+});
+
+const formAccessibility = reactive({
+  fullName: "",
+  firstName: "",
+  lastName: "",
+  phone: "",
+});
+const ruleFormRef = ref<FormInstance>();
+let form = reactive({
+  name: "", //机构名称
+  parentId: "", //上级机构id
+  comType: "", //机构类型
+  exhibitionScope: "", //展业范围
+  address: "", //地址
+  leaderId: "", //负责人id
+  area: [], //地区
+});
+
+interface PageInfo {
+  pageNum: number;
+  pageSize: number;
+  sizes: number[];
+  total: number;
+  show: boolean;
+}
+
+const dialogVisible = ref(false);
+
+// import Select from "@/components/select/selectMain.vue";
+// import TestTable from "@/components/Table/index.vue";
+//业务员列表
+type tableType = {
+  id: string;
+  name: string;
+};
+const tableData = ref<tableType[]>([]);
+const tableProps = ref({
+  value: "id",
+  label: "name",
+  children: "children",
+  checkStrictly: true,
+});
+const typeformatter = (row: any, column: any, cellValue: any) => {
+  let comType = "";
+  comTypeList.value.map((ele) => {
+    if (ele.value == row.comType) {
+      comType = ele.label;
+    }
+  });
+
+  return () => h("div", {}, comType);
+};
+const columns = [
+  { prop: "name", label: "发布消息" },
+  { prop: "mobile", label: "发布机构" },
+  // { prop: "id", label: "工号" },
+  { prop: "deptName", label: "下级机构是否发布" },
+  {
+    prop: "username",
+    label: "是否强制查看",
+  },
+  { prop: "createTime", label: "查看人数" },
+
+];
+
+const pageInfo = {
+  pageNum: 1,
+  pageSize: 10,
+  sizes: [10, 20, 30, 40, 50],
+  total: 0,
+  show: true,
+};
+//分页列表功能
+const getList = (item: PageInfo) => {
+  pageInfo.pageNum = item.pageNum;
+  pageInfo.pageSize = item.pageSize;
+  salesmanAuth();
+};
+
+const checkTableIdList = ref([]);
+//表格选择事件
+function selectAllChange(list: any) {
+  checkTableIdList.value = list;
+}
+
+function selectChange(list: any) {
+  checkTableIdList.value = list;
+}
+//审核
+const userInfoId = ref("");
+const toExamine = (item: any, type: string) => {
+  if (type == "success") {
+    ElMessageBox.confirm(`确定审核通过${item.name}账号吗?`, "审核通过", {
+      confirmButtonText: "确认",
+      cancelButtonText: "取消",
+      type: "warning",
+      center: true,
+    })
+      .then(() => {
+        api.representativeApi
+          .salesmanAuthSuccess({
+            userInfoId: item.id,
+          })
+          .then((res: any) => {
+            if (res.code == 200) {
+              ElMessage.success("操作成功");
+              salesmanAuth(); //业务员列表
+            } else {
+              ElMessage.error(res.msg);
+              // salesmanAuth(); //业务员列表
+            }
+          });
+      })
+      .catch(() => {
+        ElMessage.warning("用户取消操作");
+      });
+  } else {
+    dialogVisible.value = true;
+    userInfoId.value = item.id;
+    // ElMessageBox.confirm(`<textarea placeholder='请输入审核不通过原因' oninput='handleText()' style="width:300px"></textarea>`, "审核不通过", {
+    //   confirmButtonText: "确认",
+    //   cancelButtonText: "取消",
+    //   dangerouslyUseHTMLString: true ,
+    //   type: "warning",
+    //   center: true,
+
+    // })
+    //   .then(() => {
+    //     api.representativeApi.salesmanAuthFailed({}).then((res: any) => {
+    //       if (res.code == 200) {
+    //         ElMessage.success("操作成功");
+    //         salesmanAuth(); //业务员列表
+    //       } else {
+    //         ElMessage.error(res.msg);
+    //         // salesmanAuth(); //业务员列表
+    //       }
+    //     });
+    //   })
+    //   .catch(() => {
+    //     ElMessage.warning("用户取消操作");
+    //   });
+  }
+};
+function cancel() {
+  ElMessage.warning("用户取消操作");
+  dialogVisible.value = false;
+}
+const textValue = ref("");
+//审核不通过
+function confirm() {
+  api.representativeApi
+    .salesmanAuthFailed({
+      userInfoId: userInfoId.value,
+      approvalOpinion: textValue.value,
+    })
+    .then((res: any) => {
+      if (res.code == 200) {
+        ElMessage.success("操作成功");
+        salesmanAuth(); //业务员列表
+        dialogVisible.value = false;
+      }
+    });
+}
+
+interface institutionData {
+  typeAttr: string;
+  deptId: string;
+  status: number;
+}
+const info = ref<institutionData>({
+  typeAttr: "2",
+  deptId: "",
+  status: 4,
+});
+
+const router = useRouter();
+
+//详情
+const editor = (item: any) => {
+  console.log(item);
+  router.push({
+    path: "/representative/member/memberMessage",
+    query: {
+      id: item.userId,
+    },
+  });
+  // pageInfo.pageNum=item.pageNum
+  // pageInfo.pageSize=item.pageSize
+};
+
+//获取机构类型字典值
+type comType = {
+  value: string;
+  label: string;
+};
+let comTypeList = ref<comType[]>([]);
+
+const handleClick = (tab: TabsPaneContext, event: Event) => {
+  // console.log(tab.props.name);
+  if (tab.props.name == "pass") {
+    info.value.status = 5;
+    salesmanAuth();
+  } else {
+    info.value.status = 4;
+    salesmanAuth();
+  }
+};
+
+//获取成员员列表
+const salesmanAuth = () => {
+  api.representativeApi
+    .getUserInfoList({
+      ...info.value,
+      pages: pageInfo.pageNum,
+      size: pageInfo.pageSize,
+    })
+    .then((res) => {
+      tableData.value = res.data.records;
+      pageInfo.total = res.data.total;
+    });
+};
+
+//机构列表
+const institutionList = ref([]);
+const getAllMemberList = () => {
+  api.institutionApi.institutionList({}).then((res: any) => {
+    if (res.code === 200) institutionList.value = res.data;
+  });
+  // pageInfo.pageSize=item.pageSize
+};
+
+const reset = (item: any) => {
+  // ElMessage({})
+};
+
+onMounted(() => {
+  // 对 asyncRoutes 进行预处理并转换为树形结构
+  salesmanAuth(); //业务员列表
+  // getAreaList(); //省市区级联数据
+  // getSystemList(); //机构类型字典
+  // getExhibitionScopeSystemList(); //展业范围字段
+  getAllMemberList(); //机构列表
+});
+</script>
+<style lang="scss" scoped>
+:deep(.table-title-btn) {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  > div {
+    display: flex;
+  }
+}
+.institution {
+  background: #fff;
+  width: 100%;
+  // height: 100%;
+  // padding: 20px;
+  box-sizing: border-box;
+  display: flex;
+ 
+  .institution-main {
+    flex: 1;
+    // width: 80%;
+    padding: 20px;
+    box-sizing: border-box;
+  }
+}
+:deep(.el-dropdown-link) {
+  cursor: pointer;
+  color: var(--el-color-primary);
+  display: flex;
+  align-items: center;
+  margin-left: 15px;
+}
+.custom-tree-node {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 14px;
+  padding-right: 8px;
+}
+:deep(.el-message-box__container) {
+  width: 100% !important;
+  .el-message-box__message {
+    width: 100% !important;
+  }
+}
+</style>

src/views/contentManagement/modules/addMessage.vue

@@ -0,0 +1,208 @@
+<template>
+  <div class="message-main">
+    <h4>基本信息</h4>
+    <el-form
+      ref="ruleFormRef"
+      :model="ruleForm"
+      :rules="rules"
+      label-width="auto"
+      class="demo-ruleForm"
+      :size="formSize"
+      :inline="true"
+      status-icon
+    >
+      <el-row :gutter="24">
+        <el-col :span="9">
+          <el-form-item label="标题" prop="name">
+            <el-input v-model="ruleForm.name" clearable style="width: 400px" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="9">
+          <el-form-item label="发布机构" prop="region">
+            <el-cascader
+              clearable
+              style="width: 400px"
+              v-model="ruleForm.deptId"
+              :options="institutionList"
+              :props="tableProps"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="24">
+        <el-col :span="9">
+          <el-form-item label="子机构是否发布" prop="resource">
+            <el-radio-group v-model="ruleForm.resource">
+              <el-radio value="是">是</el-radio>
+              <el-radio value="否">否</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-col>
+        <el-col :span="9">
+          <el-form-item label="是否强制查看" prop="resource">
+            <el-radio-group v-model="ruleForm.resource">
+              <el-radio value="是">是</el-radio>
+              <el-radio value="否">否</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-form-item label="消息内容" prop="desc">
+        <el-input
+          style="width: 400px"
+          v-model="ruleForm.desc"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-row style="justify-content: center;">
+        <el-form-item>
+          <el-button @click="resetForm(ruleFormRef)">取消</el-button>
+
+          <el-button type="primary" @click="submitForm(ruleFormRef)">
+            保存
+          </el-button>
+        </el-form-item>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, onMounted } from "vue";
+import type { ComponentSize, FormInstance, FormRules } from "element-plus";
+import api from "@/api";
+interface RuleForm {
+  name: string;
+  region: string;
+  count: string;
+  date1: string;
+  date2: string;
+  delivery: boolean;
+  location: string;
+  type: string[];
+  resource: string;
+  desc: string;
+}
+const tableProps = ref({
+  value: "id",
+  label: "name",
+  children: "children",
+  checkStrictly: true,
+});
+onMounted(() => {
+  getAllMemberList(); //机构列表
+});
+
+const formSize = ref<ComponentSize>("default");
+const ruleFormRef = ref<FormInstance>();
+const ruleForm = reactive<RuleForm>({
+  name: "",
+  region: "",
+  count: "",
+  date1: "",
+  date2: "",
+  delivery: false,
+  location: "",
+  type: [],
+  resource: "",
+  desc: "",
+});
+
+const rules = reactive<FormRules<RuleForm>>({
+  name: [
+    { required: true, message: "Please input Activity name", trigger: "blur" },
+    { min: 3, max: 5, message: "Length should be 3 to 5", trigger: "blur" },
+  ],
+  region: [
+    {
+      required: true,
+      message: "Please select Activity zone",
+      trigger: "change",
+    },
+  ],
+  count: [
+    {
+      required: true,
+      message: "Please select Activity count",
+      trigger: "change",
+    },
+  ],
+  date1: [
+    {
+      type: "date",
+      required: true,
+      message: "Please pick a date",
+      trigger: "change",
+    },
+  ],
+  date2: [
+    {
+      type: "date",
+      required: true,
+      message: "Please pick a time",
+      trigger: "change",
+    },
+  ],
+  location: [
+    {
+      required: true,
+      message: "Please select a location",
+      trigger: "change",
+    },
+  ],
+  type: [
+    {
+      type: "array",
+      required: true,
+      message: "Please select at least one activity type",
+      trigger: "change",
+    },
+  ],
+  resource: [
+    {
+      required: true,
+      message: "Please select activity resource",
+      trigger: "change",
+    },
+  ],
+  desc: [
+    { required: true, message: "Please input activity form", trigger: "blur" },
+  ],
+});
+
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      console.log("submit!");
+    } else {
+      console.log("error submit!", fields);
+    }
+  });
+};
+
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  formEl.resetFields();
+};
+
+//机构列表
+const institutionList = ref([]);
+const getAllMemberList = () => {
+  api.institutionApi.institutionList({}).then((res: any) => {
+    if (res.code === 200) institutionList.value = res.data;
+  });
+  // pageInfo.pageSize=item.pageSize
+};
+</script>
+<style lang="scss" scoped>
+.message-main {
+  flex: 1;
+  width: 100%;
+  height: 100%;
+  background: #fff;
+  padding: 15px;
+  box-sizing: border-box;
+}
+</style>

src/views/login.vue

@@ -26,12 +26,12 @@ onBeforeMount(() => {
 
   treeData.value = convertToTreeData(0, processedRoutes);
 
-  // api.roleApi
-  //   .updateConfig({
-  //     sysConfig: JSON.stringify(processedRoutes),
-  //     sysPerms: JSON.stringify(treeData.value),
-  //   })
-  //   .then((res) => {});
+  api.roleApi
+    .updateConfig({
+      sysConfig: JSON.stringify(processedRoutes),
+      sysPerms: JSON.stringify(treeData.value),
+    })
+    .then((res) => {});
 });
 
 const route = useRoute();

src/views/representative/member.vue

@@ -16,18 +16,15 @@
               </el-col>
               <el-col :span="6">
                 <el-form-item label="归属机构">
-                  <el-select
-                    v-model="form.leaderId"
-                    placeholder="归属机构"
+                  
+                  <el-cascader
                     clearable
-                  >
-                    <el-option
-                      v-for="item in memberList"
-                      :key="item.id"
-                      :label="item.name"
-                      :value="item.id"
-                    />
-                  </el-select>
+                    style="width: 100%"
+                    v-model="info.deptId"
+                    :options="institutionList"
+                    :props="tableProps"
+                    
+                  />
                 </el-form-item>
               </el-col>
 
@@ -117,18 +114,14 @@
               </el-col>
               <el-col :span="6">
                 <el-form-item label="归属机构">
-                  <el-select
-                    v-model="form.leaderId"
-                    placeholder="归属机构"
+                  <el-cascader
                     clearable
-                  >
-                    <el-option
-                      v-for="item in memberList"
-                      :key="item.id"
-                      :label="item.name"
-                      :value="item.id"
-                    />
-                  </el-select>
+                    style="width: 100%"
+                    v-model="info.deptId"
+                    :options="institutionList"
+                    :props="tableProps"
+                    
+                  />
                 </el-form-item>
               </el-col>
 
@@ -276,6 +269,12 @@ type tableType = {
   name: string;
 };
 const tableData = ref<tableType[]>([]);
+const tableProps = ref({
+  value: "id",
+  label: "name",
+  children: "children",
+  checkStrictly: true,
+});
 const typeformatter = (row: any, column: any, cellValue: any) => {
   let comType = "";
   comTypeList.value.map((ele) => {
@@ -457,10 +456,10 @@ const salesmanAuth = () => {
 };
 
 //成员列表
-const memberList = ref([]);
+const institutionList = ref([]);
 const getAllMemberList = () => {
-  api.userApi.AllMemberList({}).then((res: any) => {
-    if (res.code === 200) memberList.value = res.data;
+  api.institutionApi.institutionList({}).then((res: any) => {
+    if (res.code === 200) institutionList.value = res.data;
   });
   // pageInfo.pageSize=item.pageSize
 };