工作管理、工作动态对接数据

.env.development

@@ -18,4 +18,5 @@ VITE_PROXY = [ ["/dev-api", "http://192.168.110.186:8017" ],["/dev-img-api", "ht
 # 
 VITE_GLOB_UPLOAD_URL=/dev-api
 VITE_UPLOAD_IMG_URL=/dev-img-api
+VITE_UPLOAD_URL = http://192.168.110.186
 VITE_IFRAMEURL=http://192.168.110.39:8010

src/api/Work.ts

@@ -0,0 +1,70 @@
+import request from "@/utils/request";
+//工作管理
+/**
+ *工作类型列表
+ */
+export function wkTypes(params) {
+  return request({
+    url: `/admin/work/wkTypes`,
+    method: "GET",
+    params:params
+  });
+}
+
+/**
+ *新增工作
+ */
+ export function workAdd(params) {
+  return request({
+    url: `/admin/work/workAdd`,
+    method: "POST",
+    data:params
+  });
+}
+/**
+ *发布工作分页
+ */
+ export function sendWorkPage(params) {
+  return request({
+    url: `/admin/work/sendWorkPage`,
+    method: "GET",
+    params:params
+  });
+}
+/**
+ *工作详情
+ */
+ export function workDetail(workId) {
+  return request({
+    url: `/admin/work/workDetail/${workId}`,
+    method: "GET",
+  });
+}
+
+//工作动态
+/**
+ *工作动态分页
+ */
+ export function wkDynamicsPage(params) {
+  return request({
+    url: `/admin/work/wkDynamicsPage`,
+    method: "GET",
+    params:params
+  });
+}
+/**
+ *工作动态分页
+ */
+ export function wkDynamicsAdd(params) {
+  return request({
+    url: `/admin/work/wkDynamicsAdd`,
+    method: "POST",
+    data:params
+  });
+}
+
+
+
+
+
+

src/api/file.ts

@@ -71,7 +71,7 @@ export function uploadFile(
   /**
  *文件删除
  */
- export function delFile(documentId:string) {
+ export function delFile(documentId) {
   return request({
     url: `/common/upload/delFile`,
     method: "GET",

src/assets/styles/element-ui.scss

@@ -243,6 +243,15 @@
             color: #226cb6;
         }
     }
+    .notViewed {
+        color: #fb4e33;
+    }
+    .viewed {
+        color: #f4a914;
+    }
+    .completed {
+        color: green;
+    }
 }
 .look {
     color: #1d86fb;

src/utils/common.ts

@@ -24,6 +24,10 @@ export enum FileType {
   entEmResourse = "entEmResourse", //应急物资台账
   enterpriseFrontImg = "enterpriseFrontImg", //企业自查-整改前
   enterpriseAfterImg = "enterpriseAfterImg", //企业自查-整改后
+
+  //道孚
+  workManagement = 'workManagement',//工作管理
+  workDynamics = 'workDynamics',//工作管理
 }
 // 文件接口类型
 export enum ApiFile {

src/views/system/base/govuser/details.vue

@@ -24,10 +24,11 @@
             v-model="addPostFactorForm.sysusername"
           ></el-input>
         </el-form-item>
-        <el-form-item label="密码：" prop="password">
+        <el-form-item label="密码：" prop="syspassword">
           <el-input
             placeholder="请输入密码"
-            v-model="addPostFactorForm.password"
+            v-model="addPostFactorForm.syspassword"
+            type="password"
             @focus="pwdFocus"
           ></el-input>
         </el-form-item>
@@ -59,6 +60,7 @@
             v-model="addPostFactorForm.systitle"
             :data="postList"
             :props="postProps"
+            check-strictly
             :render-after-expand="false"
             style="width: 240px;"
           />
@@ -110,7 +112,7 @@ const userId = ref(user.value.userId);
 const uuid = ref("");
 const ruleForm = reactive<FormRules>({
   sysusername: [{ required: true, message: "请输入账号", trigger: "blur" }],
-  password: [{ required: true, message: "请输入密码", trigger: "blur" }],
+  syspassword: [{ required: true,pattern: "^(?=.*[a-zA-Z])(?=.*\\d).{10,}$", message: "请输入10位密码包括英文与数字", trigger: "blur" }],
   chinaname: [{ required: true, message: "请输入中文名", trigger: "blur" }],
   userroles: [{ required: true, message: "请选择角色", trigger: "change" }],
   sysunitorentid: [
@@ -136,12 +138,24 @@ const props = defineProps({
 });
 const addPostFactorForm = ref(<any>{});
 const emits = defineEmits(["close", "onSubmit"]);
+const password = ref('');
+const newpassword = ref('');
 //保存并退出
 const handleSubmit = () => {
   formRef.value?.validate((valid) => {
     if (valid) {
       addPostFactorForm.value.sysuserid = addPostFactorForm.value.sysuserid||uuid.value;
-      saveUser(addPostFactorForm.value).then((res: any) => {
+      if(props.form.syspassword){
+        if (addPostFactorForm.value.syspassword == newpassword.value) {
+        addPostFactorForm.value.syspassword = password.value
+      }
+      }
+      console.log(addPostFactorForm,'addPostFactorForm==>');
+      let params = {
+        ...addPostFactorForm.value,
+        password:addPostFactorForm.value.syspassword
+      }
+      saveUser(params).then((res: any) => {
         if (res.code == 1) {
           ElMessage.success({
             message: "保存成功",
@@ -172,7 +186,7 @@ const getRoleList = () => {
 const postList = ref([]);
 const postProps = {
   value: "listperformid",
-  label: "parentName",
+  label: "performclassname",
   children: "children",
 };
 const ListperformTree = () => {
@@ -184,6 +198,8 @@ const ListperformTree = () => {
 };
 //关闭弹窗
 const onclone = () => {
+  addPostFactorForm.value = {}
+  password.value = ''
   emits("close");
 };
 onMounted(() => {
@@ -195,7 +211,10 @@ watch(
   (val) => {
     uuid.value = getUUID();
     if (props.form.sysuserid) {
+      password.value = props.form.syspassword;
       addPostFactorForm.value = val;
+      newpassword.value = props.form.syspassword.slice(0, 8)
+      addPostFactorForm.value.syspassword = props.form.syspassword.slice(0, 10)
     }else{
       addPostFactorForm.value.delState = 1
     }

src/views/system/base/govuser/index.vue

@@ -212,8 +212,6 @@ const getList = () => {
     unitId: null,
   };
   getUserPage(params).then((res: any) => {
-    console.log(res, "res==>");
-
     tableData.value = res.data.list;
     total.value = res.data.total;
     tableDataloading.value = false;

src/views/system/base/org/add-or-edit.vue

@@ -44,7 +44,7 @@
           >
           </el-input>
         </el-form-item>
-        <el-form-item label="排序：">
+        <el-form-item label="排序：" prop="sortid">
           <el-input
             placeholder="请输入"
             v-model="addPostFactorForm.sortid"
@@ -98,6 +98,7 @@ const ruleForm = reactive<FormRules>({
     { required: true, message: "请输入组织名", trigger: "blur" },
   ],
   areaCode: [{ required: true, message: "请选择地区", trigger: "blur" }],
+  sortid:[{ required: true, message: "输入排序", trigger: "blur" }],
   // performname: [{ required: true, message: "请输入负责人", trigger: "blur" }],
 });
 

src/views/system/base/org/index.vue

@@ -73,7 +73,7 @@
         <el-table-column
           :resizable="true"
           align="center"
-          width="200"
+          width="250"
           label="操作"
         >
           <template #default="scope">

src/views/work-manage/components/Add.vue

@@ -0,0 +1,420 @@
+
+<template>
+  <BaseDialog
+    :dialogVisible="props.visible"
+    @close="onclone"
+    :titleName="props.form.workId ? '编辑事件' : '新增事件'"
+    width="50%"
+    @onSubmit="handleSubmit"
+    :footerclosed="true"
+    :diafooter="true"
+    :footerkeepnaem="props.readonly ? false : true"
+  >
+    <div class="detailForm-content">
+      <el-form
+        ref="formRef"
+        label-position="right"
+        label-width="150px"
+        :rules="ruleForm"
+        :model="form"
+      >
+        <el-form-item label="工作内容：" prop="title" style="width: 100%;">
+          <el-input
+            :disabled="props.readonly"
+            placeholder="请输入工作内容"
+            v-model="form.title"
+            :rows="3"
+            type="textarea"
+          >
+          </el-input>
+        </el-form-item>
+        <el-form-item label="时间：" prop="time">
+          <el-date-picker
+            :disabled="props.readonly"
+            v-model="form.time"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            size="default"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+          />
+        </el-form-item>
+        <el-form-item label="所属组织：" prop="listperformid">
+          <el-tree-select
+            :disabled="props.readonly"
+            v-model="form.listperformid"
+            :data="postTree"
+            :render-after-expand="false"
+            check-strictly
+            :filter-node-method="filterPostMethod"
+            filterable
+          />
+        </el-form-item>
+        <el-form-item label="装备照片：" style="width: 100%;">
+          <el-upload
+            class="avatar-uploader"
+            ref="uploadAfter"
+            action="#"
+            list-type="upload-demo"
+            :file-list="afterList"
+            :http-request="handleUploadAfter"
+          >
+            <el-icon class="avatar-uploader-icon">
+              <Plus />
+            </el-icon>
+            <template #file="{ file }">
+              <div>
+                <span class="el-upload-list__item-actions">
+                  <span class="el-upload-list__item-preview">
+                    <el-icon>
+                      <Document />
+                    </el-icon>
+                    <span>{{ file.realfilename }}</span>
+                  </span>
+                  <span
+                    class="el-upload-list__item-preview"
+                    @click="handleInfo(file)"
+                  >
+                    <el-icon><zoom-in /></el-icon>
+                  </span>
+                  <span
+                    class="el-upload-list__item-preview"
+                    @click="handleDownload(file)"
+                  >
+                    <el-icon>
+                      <Download />
+                    </el-icon>
+                  </span>
+                  <span
+                    class="el-upload-list__item-preview"
+                    @click="handleRemove(file)"
+                  >
+                    <el-icon>
+                      <Delete />
+                    </el-icon>
+                  </span>
+                </span>
+              </div>
+            </template>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+      <el-dialog v-model="upVisible">
+        <img w-full :src="upImageUrl" alt="Preview Image" />
+      </el-dialog>
+    </div>
+    <div v-if="props.readonly">
+      <el-table
+      ref="loading"
+      class="table"
+      v-loading="tableDataloading"
+      :data="tableData"
+      header-row-class-name="el-one-header"
+      border
+    >
+      <el-table-column type="index" align="center" label="序号" width="80"/>
+      <el-table-column prop="chinaName" align="center" label="接收人姓名" />
+      <el-table-column prop="postName" align="center" label="接收人岗位"  />
+      <el-table-column prop="workState" align="center" label="工作状态" >
+        <template #default="scope">
+          <span class="notViewed" v-if="scope.row.workState==1">未查看</span>
+          <span class="viewed" v-if="scope.row.workState==2">已查看</span>
+          <span class="completed" v-if="scope.row.workState==3">已完成</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    </div>
+  </BaseDialog>
+</template>
+<script setup lang="ts" >
+import { reactive, ref, onMounted, watch, getCurrentInstance } from "vue";
+import useUserStore from "@/store/modules/user";
+import { ElMessage, FormInstance, FormRules } from "element-plus";
+import type { UploadUserFile } from "element-plus";
+import { getYears, getUUID, FileType } from "@/utils/common";
+import { uploadFile, getFile, delFile } from "@/api/file";
+import { getListperformTree } from "@/api/Sys";
+import { workAdd,workDetail } from "@/api/Work";
+
+const formRef = ref<FormInstance>();
+const userStore = useUserStore();
+const user = ref(JSON.parse(userStore.userInfo));
+const userId = ref(user.value.userId);
+const uuid = ref(getUUID());
+const ruleForm = reactive<FormRules>({
+  title: [
+    {
+      required: true,
+      message: "请输入工作内容",
+      trigger: "blur",
+    },
+  ],
+  processedBy: [
+    {
+      required: true,
+      message: "请输入处理人",
+      trigger: "blur",
+    },
+  ],
+  time: [
+    {
+      required: true,
+      message: "请选择时间",
+      trigger: "blur",
+    },
+  ],
+  listperformid: [
+    {
+      required: true,
+      message: "请选择所属组织",
+      trigger: "blur",
+    },
+  ],
+});
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    default: false,
+  },
+  form: Object,
+  readonly: {
+    type: Boolean,
+    default: false,
+  },
+  typeId: {
+    type: String,
+  },
+});
+const form = ref(<any>{});
+const emits = defineEmits(["close", "onSubmit"]);
+//组织list
+const postTree = ref([]);
+/**筛选组织*/
+const filterPostMethod = (value, data) => data.label.includes(value);
+/**
+ * 获取组织
+ */
+const getPostTree = () => {
+  getListperformTree({}).then((res: any) => {
+    if (res.code == 1) postTree.value = handlePostData(res.data);
+  });
+};
+/**处理组织数据 */
+let handlePostData = (list) => {
+  let data = list.map((item) => {
+    return {
+      label: item.performclassname,
+      value: item.listperformid,
+      children: item.children ? handlePostData(item.children) : [],
+    };
+  });
+  return data;
+};
+//保存并退出
+const handleSubmit = () => {
+  formRef.value?.validate((valid) => {
+    if (valid) {
+      let params = {
+        workId: form.value.workId || uuid.value,
+        title: form.value.title,
+        listperformid: form.value.listperformid,
+        typeId: props.typeId,
+        userId: form.value.userId || userId.value,
+        startTime: form.value.time[0],
+        endTime: form.value.time[1],
+      };
+      workAdd(params).then((res: any) => {
+        if (res.code == 1) {
+          ElMessage.success({
+            message: "保存成功",
+            type: "success",
+          });
+          onclone();
+        } else {
+          ElMessage.error({
+            message: res.message,
+            type: "error",
+          });
+        }
+      });
+    }
+    return false;
+  });
+};
+// 文件上传
+const afterList = ref<UploadUserFile[]>([]);
+const handleUploadAfter = (file: any) => {
+  // if (afterList.value.length != 0) {
+  //   ElMessage.error("只能上传一份文件！");
+  //   getCheckDangers(form.value.workId || uuid.value);
+  // } else {
+  // }
+    const newFile = new FormData();
+    newFile.append("file", file.file);
+    uploadFile(userId.value, form.value.workId || uuid.value, FileType.workManagement, newFile).then((res) => {
+    	if (res) {
+    		ElMessage.success("上传成功！");
+    		getCheckDangers(form.value.workId || uuid.value)
+    	}
+    })
+  
+};
+//文件显示
+const baseImgUrl = ref(import.meta.env.VITE_UPLOAD_URL);
+const getCheckDangers = (id) => {
+  getFile(
+  	id,
+  	FileType.workManagement
+  ).then((res: any) => {
+  	afterList.value = res.data.map(item => {
+  		let arr = item;
+  		let index = item.filepath.indexOf(".");//获取第一个"_"的位置
+  		let after1 = item.filepath.substring(index + 1);
+  		switch (after1) {
+  			case 'xlsx':
+  				arr.url = 'src/assets/images/exl.png';
+  				break;
+  			case 'exl':
+  				arr.url = 'src/assets/images/exl.png';
+  				break;
+  			case 'pdf':
+  				arr.url = 'src/assets/images/pdf.png';
+  				break;
+  			case 'word':
+  				arr.url = 'src/assets/images/word.png';
+  				break;
+  			default:
+  				arr.url = baseImgUrl.value + item.filepath;
+  				break;
+  		}
+  		return arr;
+  	});
+  })
+};
+//删除附件
+const handleRemove = (file) => {
+  delFile(file.sysdocumentid).then((res: any) => {
+    if (res) {
+    		ElMessage.success("删除成功！");
+    	}
+  	getCheckDangers(form.value.workId || uuid.value);
+  })
+};
+//下载附件
+const handleDownload = (file) => {
+  function text() {
+    const x = new XMLHttpRequest();
+    x.open("GET", baseImgUrl.value + file.filepath, true);
+    x.responseType = "blob";
+    x.onload = function () {
+      const url = window.URL.createObjectURL(x.response);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = file.name;
+      a.click();
+    };
+    x.send();
+  }
+  let index = file.filepath.indexOf("."); //获取第一个"_"的位置
+  let after1 = file.filepath.substring(index + 1);
+  switch (after1) {
+    case "xlsx":
+      text();
+      break;
+    case "exl":
+      text();
+      break;
+    case "pdf":
+      text();
+      break;
+    case "word":
+      text();
+      break;
+    default:
+      window.open(baseImgUrl.value + file.filepath, "_blank");
+      break;
+  }
+};
+const upVisible = ref(false);
+const upImageUrl = ref("");
+//查看附件
+const handleInfo = (file) => {
+  upImageUrl.value = file.url!;
+  upVisible.value = true;
+};
+//关闭弹窗
+const onclone = () => {
+  afterList.value = [];
+  form.value = {};
+  emits("close");
+};
+//获取列表
+const tableData = ref([]);
+const getCompanyList = (workId) => {
+  workDetail(workId).then((res: any) => {
+    tableData.value = res.data.wkUsers;
+    
+  });
+};
+
+
+onMounted(() => {});
+watch(
+  () => props.form.workId,
+  (val) => {
+    uuid.value = getUUID();
+    if (val) {
+      form.value = props.form;
+      form.value.time = [form.value.startTime, form.value.endTime];
+      getCheckDangers(form.value.workId || uuid.value)
+    }
+  }
+);
+watch(
+  () => props.readonly,
+  (val) => {
+    if (val) {
+      getCompanyList(props.form.workId);
+    }
+    
+  }
+);
+watch(
+  () => props.visible,
+  (val) => {
+    if (val) getPostTree();
+  },
+  { deep: true }
+);
+</script>
+
+<style lang="scss" scoped>
+.detailForm-content {
+    margin-right: 30px;
+}
+:deep(.el-form) {
+    display: flex;
+    flex-wrap: wrap;
+    // justify-content: space-around;
+    justify-content: space-between;
+}
+:deep(.el-form-item) {
+    width: 47%;
+}
+::v-deep(.el-upload-list__item-actions) {
+    display: flex;
+    > span:nth-child(2) {
+        margin-left: 10px;
+    }
+}
+::v-deep(.el-upload-list__item-preview) {
+    margin-right: 10px;
+    display: flex;
+    align-items: center;
+    > span {
+        margin-left: 10px;
+    }
+}
+</style>

src/views/work-manage/components/cg.vue

@@ -4,6 +4,13 @@
     <div class="h-layout space-between h-center">
       <div>
         <div class="h-layout">
+          <div
+              class="tool-item"
+              @click="(dialogVisible = true), (form = {}), (readonly = false)"
+            >
+              <svg-icon name="add" class="icon" />
+              <span>新增</span>
+            </div>
           <div class="tool-item" @click="getList">
             <svg-icon name="refurbish" class="icon" />
             <span>刷新</span>
@@ -23,10 +30,43 @@
       header-row-class-name="el-one-header"
       border
     >
-      <el-table-column prop="year" align="center" label="年份" width="120"/>
+      <el-table-column type="index" align="center" label="序号" width="80"/>
-      <el-table-column prop="year" align="center" label="工作内容" />
+      <el-table-column prop="title" align="center" label="工作内容" />
-      <el-table-column prop="year" align="center" label="状态" width="120"/>
+      <el-table-column prop="startTime" align="center" label="开始时间"  width="150"/>
-      <el-table-column prop="year" align="center" label="处理人" width="200"/>
+      <el-table-column prop="endTime" align="center" label="结束时间" width="150"/>
+      <el-table-column prop="chinaName" align="center" label="发布人" width="120"/>
+      <el-table-column prop="postName" align="center" label="发布人岗位" width="150"/>
+      <el-table-column
+          :resizable="true"
+          align="center"
+          width="260"
+          label="操作"
+        >
+          <template #default="scope">
+            <!-- <span
+              class="operate"
+              @click="
+                (dialogVisible = true), (form = scope.row), (readonly = false)
+              "
+            >
+              <svg-icon name="edit" class="icon"></svg-icon>
+              <span class="edit">编辑</span>
+            </span> -->
+            <span
+              class="operate"
+              @click="
+                (dialogVisible = true), (form = scope.row), (readonly = true)
+              "
+            >
+              <svg-icon name="detail" class="icon"></svg-icon>
+              <span class="detail">详情</span>
+            </span>
+            <span class="operate" @click="deletelist(scope.row)">
+              <svg-icon name="delete" class="icon"></svg-icon>
+              <span class="func">删除</span>
+            </span>
+          </template>
+        </el-table-column>
     </el-table>
     <!-- 分页 -->
     <el-pagination
@@ -39,18 +79,118 @@
       background
     >
     </el-pagination>
+    <!-- 新增 -->
+    <Add
+        :visible="dialogVisible"
+        :form="form"
+        :readonly="readonly"
+        @close="onclone"
+        :typeId="typeId"
+      />
   </div>
 </template>
 
 <script lang='ts' setup>
 import { onMounted, reactive, ref } from "vue";
 import { ElMessageBox } from "element-plus";
-
+import Add from "./Add.vue";
+import { sendWorkPage } from "@/api/Work";
+import useUserStore from "@/store/modules/user";
+const userStore = useUserStore();
+const user = ref(JSON.parse(userStore.userInfo));
+const userId = ref(user.value.userId);
+const props = defineProps({
+  tabIndex: {
+    type: Number,
+    default: 1,
+  },
+  typeId:{
+    type: String,
+    default:''
+  }
+});
+const typeId = ref('')
 const search = ref([]);
 const currentPage = ref(1);
 const pageSize = ref(10);
 const total = ref(0);
-const tableData = ref([{ year: "2023" }, { year: "2024" }]);
+
+
+//获取列表
+const tableDataloading = ref(false);
+const tableData = ref([]);
+const getSendWorkPage = () => {
+  tableDataloading.value = true;
+  let params = {
+    userId:userId.value,
+    limit: pageSize.value,
+    page: currentPage.value,
+    typeId:typeId.value,
+  };
+  sendWorkPage(params).then((res: any) => {
+    tableData.value = res.data.list;
+    total.value = res.data.total;
+    tableDataloading.value = false;
+  });
+};
+
+//新增弹窗
+const dialogVisible = ref(false);
+const form = ref({});
+const readonly = ref(false);
+//关闭新增弹窗
+const onclone = () => {
+  dialogVisible.value = false;
+  form.value = {};
+  getList();
+};
+//删除
+const deletelist = (data)=>{
+  console.log(data,'===>');
+  // ElMessageBox.confirm("是否确认删除?", "提示", {
+  //   confirmButtonText: "是",
+  //   cancelButtonText: "否",
+  //   type: "warning",
+  // }).then(() => {
+  //   delOthequipment(id, userId.value).then((res: any) => {
+  //     if (res.code == 1) {
+  //       ElMessage.success({
+  //         message: "删除成功",
+  //         type: "success",
+  //       });
+  //     } else {
+  //       ElMessage.error({
+  //         message: res.message,
+  //         type: "error",
+  //       });
+  //     }
+  //     getSendWorkPage();
+  //   });
+  // });
+  
+}
+const getList = ()=>{
+  currentPage.value = 1;
+  getSendWorkPage();
+}
+onMounted(() => {
+  
+});
+watch(
+  () => props.tabIndex,
+  (val) => {
+    typeId.value = props.typeId;
+    getSendWorkPage();
+    
+  }
+);
+watch(
+  () => props.typeId,
+  (val) => {
+    getSendWorkPage();
+    
+  }
+);
 </script>
 
 <style lang="scss" scoped>

src/views/work-manage/components/db.vue

@@ -1,10 +0,0 @@
-<template>
-    <div>督办工作</div>
-  </template>
-  
-  <script lang='ts' setup>
-  </script>
-  
-  <style lang="scss" scoped>
-  </style>
-  

src/views/work-manage/components/tj.vue

@@ -1,10 +0,0 @@
-<template>
-  <div>调解工作</div>
-</template>
-  
-  <script lang='ts' setup>
-</script>
-  
-  <style lang="scss" scoped>
-</style>
-  

src/views/work-manage/components/yj.vue

@@ -1,10 +0,0 @@
-<template>
-  <div>应急工作</div>
-</template>
-    
-    <script lang='ts' setup>
-</script>
-    
-    <style lang="scss" scoped>
-</style>
-    

src/views/work-manage/index.vue

@@ -1,33 +1,53 @@
 <template>
   <div class="percentage-content">
-    <el-radio-group class="rg" v-model="tabIndex">
+    <el-radio-group class="rg" v-model="tabIndex" @change="clickRadio">
-      <template v-for="item in tabs" :key="item.val">
+      <template v-for="item in tabs" :key="item.sortId">
-        <el-radio-button :label="item.val">{{ item.name }}</el-radio-button>
+        <el-radio-button :label="item.sortId">{{ item.typeName }}</el-radio-button>
       </template>
     </el-radio-group>
     <div class="content">
-      <transition name="main" mode="out-in" appear>
+      <!-- <transition name="main" mode="out-in" appear>
         <component :is="tabs[tabIndex].compon" />
-      </transition>
+      </transition> -->
+      <CG :tabIndex="tabIndex" :typeId="typeId"></CG>
     </div>
   </div>
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref } from "vue";
+import { onMounted, ref } from "vue";
-import { ElMessageBox } from "element-plus";
+// import { ElMessageBox } from "element-plus";
+import { wkTypes } from "@/api/Work";
 import CG from "./components/cg.vue";
-import DB from "./components/db.vue";
-import YJ from "./components/yj.vue";
-import TJ from "./components/tj.vue";
 
 const tabIndex = ref(0);
 const tabs = ref([
-  { name: "常规工作", val: 0, compon: CG },
+  { typeName: "常规工作", sortId: 1, },
-  { name: "督办工作", val: 1, compon: DB },
-  { name: "应急事件", val: 2, compon: YJ },
-  { name: "调解工作", val: 3, compon: TJ },
 ]);
+const typeId = ref('');
+//头部点击取id
+const clickRadio = ()=>{
+  tabs.value.forEach(item => {
+    if (item.sortId == tabIndex.value) {
+      typeId.value = item.typeId
+    }
+    
+  });
+}
+//工作类型
+const getWkTypes = ()=>{
+  let params = {
+    classify:1
+  }
+  wkTypes(params).then((res: any) => {
+    tabs.value = res.data;
+    typeId.value = res.data[0].typeId;
+    tabIndex.value = 1;
+  });
+}
+onMounted(() => {
+  getWkTypes();
+});
 </script>
 
 <style lang="scss" scoped>
@@ -35,16 +55,14 @@ const tabs = ref([
     height: auto;
     display: flex;
     flex-direction: column;
-
     .rg {
         padding: 16px;
-    background: #ffffff;
+        background: #fff;
-    box-shadow: 0px 0px 6px rgba(0, 120, 255, 0.1);
+        box-shadow: 0 0 6px rgb(0 120 255 / 10%);
         border-radius: 6px;
         display: flex;
         flex-direction: row;
         margin-bottom: 10px;
-
         :deep(.el-radio-button__inner) {
             min-width: 150px;
         }
@@ -53,16 +71,11 @@ const tabs = ref([
         width: 100%;
         background: #fff;
         border-radius: 0.26042vw;
-    box-shadow: 0 0 0.41667vw 0 rgba(8, 33, 85, 0.1);
+        box-shadow: 0 0 0.41667vw 0 rgb(8 33 85 / 10%);
         padding: 0.83333vw;
         overflow-y: auto;
         overflow-x: hidden !important;
-    -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box;
-    -o-box-sizing: border-box;
-    -ms-box-sizing: border-box;
         box-sizing: border-box;
-
         .table {
             margin-top: 16px;
         }

src/views/work-trends/components/Add.vue

@@ -0,0 +1,349 @@
+
+<template>
+  <BaseDialog
+    :dialogVisible="props.visible"
+    @close="onclone"
+    :titleName="props.form.dynamicsId ? '编辑事件' : '新增事件'"
+    width="50%"
+    @onSubmit="handleSubmit"
+    :footerclosed="true"
+    :diafooter="true"
+    :footerkeepnaem="props.readonly ? false : true"
+  >
+    <div class="detailForm-content">
+      <el-form
+        ref="formRef"
+        label-position="right"
+        label-width="150px"
+        :rules="ruleForm"
+        :model="form"
+      >
+      <el-form-item label="动态标题：" prop="title" style="width: 100%;">
+          <el-input
+            :disabled="props.readonly"
+            placeholder="请输入动态标题"
+            v-model="form.title"
+          >
+          </el-input>
+        </el-form-item>
+        <el-form-item label="动态内容：" prop="detail" style="width: 100%;">
+          <el-input
+            :disabled="props.readonly"
+            placeholder="请输入动态内容"
+            v-model="form.detail"
+            :rows="3"
+            type="textarea"
+          >
+          </el-input>
+        </el-form-item>
+        <el-form-item label="时间：" prop="time">
+          <el-date-picker
+            :disabled="props.readonly"
+            v-model="form.time"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            size="default"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+          />
+        </el-form-item>
+        <el-form-item label="装备照片：" style="width: 100%;">
+          <el-upload
+            class="avatar-uploader"
+            ref="uploadAfter"
+            action="#"
+            list-type="upload-demo"
+            :file-list="afterList"
+            :http-request="handleUploadAfter"
+          >
+            <el-icon class="avatar-uploader-icon">
+              <Plus />
+            </el-icon>
+            <template #file="{ file }">
+              <div>
+                <span class="el-upload-list__item-actions">
+                  <span class="el-upload-list__item-preview">
+                    <el-icon>
+                      <Document />
+                    </el-icon>
+                    <span>{{ file.realfilename }}</span>
+                  </span>
+                  <span
+                    class="el-upload-list__item-preview"
+                    @click="handleInfo(file)"
+                  >
+                    <el-icon><zoom-in /></el-icon>
+                  </span>
+                  <span
+                    class="el-upload-list__item-preview"
+                    @click="handleDownload(file)"
+                  >
+                    <el-icon>
+                      <Download />
+                    </el-icon>
+                  </span>
+                  <span
+                    class="el-upload-list__item-preview"
+                    @click="handleRemove(file)"
+                  >
+                    <el-icon>
+                      <Delete />
+                    </el-icon>
+                  </span>
+                </span>
+              </div>
+            </template>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+      <el-dialog v-model="upVisible">
+        <img w-full :src="upImageUrl" alt="Preview Image" />
+      </el-dialog>
+    </div>
+  </BaseDialog>
+</template>
+<script setup lang="ts" >
+import { reactive, ref, onMounted, watch, getCurrentInstance } from "vue";
+import useUserStore from "@/store/modules/user";
+import { ElMessage, FormInstance, FormRules } from "element-plus";
+import type { UploadUserFile } from "element-plus";
+import { getYears, getUUID, FileType } from "@/utils/common";
+import { uploadFile, getFile, delFile } from "@/api/file";
+import { getListperformTree } from "@/api/Sys";
+import { wkDynamicsAdd } from "@/api/Work";
+
+const formRef = ref<FormInstance>();
+const userStore = useUserStore();
+const user = ref(JSON.parse(userStore.userInfo));
+const userId = ref(user.value.userId);
+const uuid = ref(getUUID());
+const ruleForm = reactive<FormRules>({
+  detail: [
+    {
+      required: true,
+      message: "请输入动态内容",
+      trigger: "blur",
+    },
+  ],
+  processedBy: [
+    {
+      required: true,
+      message: "请输入处理人",
+      trigger: "blur",
+    },
+  ],
+  time: [
+    {
+      required: true,
+      message: "请选择时间",
+      trigger: "blur",
+    },
+  ],
+  title:[
+  {
+      required: true,
+      message: "请输入动态标题",
+      trigger: "blur",
+    },
+  ]
+});
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    default: false,
+  },
+  form: Object,
+  readonly: {
+    type: Boolean,
+    default: false,
+  },
+  typeId: {
+    type: String,
+  },
+});
+const form = ref(<any>{});
+const emits = defineEmits(["close", "onSubmit"]);
+//保存并退出
+const handleSubmit = () => {
+  formRef.value?.validate((valid) => {
+    if (valid) {
+      let params = {
+        dynamicsId: form.value.dynamicsId || uuid.value,
+        detail: form.value.detail,
+        title: form.value.title,
+        typeId: props.typeId,
+        userId: form.value.userId || userId.value,
+        startTime: form.value.time[0],
+        endTime: form.value.time[1],
+      };
+      wkDynamicsAdd(params).then((res: any) => {
+        if (res.code == 1) {
+          ElMessage.success({
+            message: "保存成功",
+            type: "success",
+          });
+          onclone();
+        } else {
+          ElMessage.error({
+            message: res.message,
+            type: "error",
+          });
+        }
+      });
+    }
+    return false;
+  });
+};
+// 文件上传
+const afterList = ref<UploadUserFile[]>([]);
+const handleUploadAfter = (file: any) => {
+  // if (afterList.value.length != 0) {
+  //   ElMessage.error("只能上传一份文件！");
+  //   getCheckDangers(form.value.dynamicsId || uuid.value);
+  // } else {
+  // }
+    const newFile = new FormData();
+    newFile.append("file", file.file);
+    uploadFile(userId.value, form.value.dynamicsId || uuid.value, FileType.workDynamics, newFile).then((res) => {
+    	if (res) {
+    		ElMessage.success("上传成功！");
+    		getCheckDangers(form.value.dynamicsId || uuid.value)
+    	}
+    })
+  
+};
+//文件显示
+const baseImgUrl = ref(import.meta.env.VITE_UPLOAD_URL);
+const getCheckDangers = (id) => {
+  getFile(
+  	id,
+  	FileType.workDynamics
+  ).then((res: any) => {
+  	afterList.value = res.data.map(item => {
+  		let arr = item;
+  		let index = item.filepath.indexOf(".");//获取第一个"_"的位置
+  		let after1 = item.filepath.substring(index + 1);
+  		switch (after1) {
+  			case 'xlsx':
+  				arr.url = 'src/assets/images/exl.png';
+  				break;
+  			case 'exl':
+  				arr.url = 'src/assets/images/exl.png';
+  				break;
+  			case 'pdf':
+  				arr.url = 'src/assets/images/pdf.png';
+  				break;
+  			case 'word':
+  				arr.url = 'src/assets/images/word.png';
+  				break;
+  			default:
+  				arr.url = baseImgUrl.value + item.filepath;
+  				break;
+  		}
+  		return arr;
+  	});
+  })
+};
+//删除附件
+const handleRemove = (file) => {
+  delFile(file.sysdocumentid).then((res: any) => {
+    if (res) {
+    		ElMessage.success("删除成功！");
+    	}
+  	getCheckDangers(form.value.dynamicsId || uuid.value);
+  })
+};
+//下载附件
+const handleDownload = (file) => {
+  function text() {
+    const x = new XMLHttpRequest();
+    x.open("GET", baseImgUrl.value + file.filepath, true);
+    x.responseType = "blob";
+    x.onload = function () {
+      const url = window.URL.createObjectURL(x.response);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = file.name;
+      a.click();
+    };
+    x.send();
+  }
+  let index = file.filepath.indexOf("."); //获取第一个"_"的位置
+  let after1 = file.filepath.substring(index + 1);
+  switch (after1) {
+    case "xlsx":
+      text();
+      break;
+    case "exl":
+      text();
+      break;
+    case "pdf":
+      text();
+      break;
+    case "word":
+      text();
+      break;
+    default:
+      window.open(baseImgUrl.value + file.filepath, "_blank");
+      break;
+  }
+};
+const upVisible = ref(false);
+const upImageUrl = ref("");
+//查看附件
+const handleInfo = (file) => {
+  upImageUrl.value = file.url!;
+  upVisible.value = true;
+};
+//关闭弹窗
+const onclone = () => {
+  afterList.value = [];
+  form.value = {};
+  emits("close");
+};
+
+
+onMounted(() => {});
+watch(
+  () => props.form.dynamicsId,
+  (val) => {
+    uuid.value = getUUID();
+    if (val) {
+      form.value = props.form;
+      form.value.time = [form.value.startTime, form.value.endTime];
+      getCheckDangers(form.value.dynamicsId || uuid.value)
+    }
+  }
+);
+</script>
+
+<style lang="scss" scoped>
+.detailForm-content {
+    margin-right: 30px;
+}
+:deep(.el-form) {
+    display: flex;
+    flex-wrap: wrap;
+    // justify-content: space-around;
+    justify-content: space-between;
+}
+:deep(.el-form-item) {
+    width: 47%;
+}
+::v-deep(.el-upload-list__item-actions) {
+    display: flex;
+    > span:nth-child(2) {
+        margin-left: 10px;
+    }
+}
+::v-deep(.el-upload-list__item-preview) {
+    margin-right: 10px;
+    display: flex;
+    align-items: center;
+    > span {
+        margin-left: 10px;
+    }
+}
+</style>

src/views/work-trends/index.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="percentage-content">
-    <el-radio-group class="rg" v-model="tabIndex">
+    <el-radio-group class="rg" v-model="tabIndex" @change="clickRadio">
-      <template v-for="item in tabs" :key="item.val">
+      <template v-for="item in tabs" :key="item.sortId">
-        <el-radio-button :label="item.val">{{ item.name }}</el-radio-button>
+        <el-radio-button :label="item.sortId">{{ item.typeName }}</el-radio-button>
       </template>
     </el-radio-group>
     <div class="content">
@@ -13,13 +13,13 @@
               <svg-icon name="refurbish" class="icon" />
               <span>刷新</span>
             </div>
-            <div class="tool-item">
+            <div class="tool-item" @click="(dialogVisible = true), (form = {}), (readonly = false)">
               <svg-icon name="add" class="icon" />
               <span>新增</span>
             </div>
           </div>
         </div>
-        <div style="width: 30%">
+        <div style="width: 30%;">
           <div>
             <el-input
               v-model="search"
@@ -56,24 +56,36 @@
           </template>
         </el-table-column>
         <el-table-column
-          prop="cName"
+          prop="title"
           :resizable="true"
           align="center"
-          label="村庄名称"
+          label="动态标题"
+          width="150"
         >
         </el-table-column>
         <el-table-column
-          prop="name"
+          prop="detail"
           :resizable="true"
           align="center"
-          label="村长"
+          label="动态内容"
+        >
+        </el-table-column>
+        <el-table-column prop="startTime" align="center" label="开始时间"  width="190"/>
+      <el-table-column prop="endTime" align="center" label="结束时间" width="190"/>
+        <el-table-column
+          prop="chinaName"
+          :resizable="true"
+          align="center"
+          label="发布人"
+          width="120"
         >
         </el-table-column>
         <el-table-column
-          prop="phone"
+          prop="postName"
           :resizable="true"
           align="center"
-          label="联系电话"
+          label="	发布人岗位"
+          width="180"
         >
         </el-table-column>
         <el-table-column
@@ -83,21 +95,22 @@
           label="操作"
         >
           <template #default="scope">
-            <span
+            <!-- <span
               class="operate"
-              @click="(dialogVisible = true), (currentItem = scope.row)"
+              @click="(dialogVisible = true), (form = scope.row),(readonly = false)"
             >
               <svg-icon name="edit" class="icon"></svg-icon>
               <span class="edit">编辑</span>
-            </span>
+            </span> -->
             <span
               class="operate"
-              @click="(currentItem = scope.row), (visible = true)"
+              @click="(form = scope.row), (dialogVisible = true),(readonly = true)"
             >
               <svg-icon name="detail" class="icon"></svg-icon>
               <span class="detail">详情</span>
             </span>
-            <span class="operate" @click="del(scope.row, '删除')">
+
+            <span class="operate" @click="deletelist(scope.row)">
               <svg-icon name="delete" class="icon"></svg-icon>
               <span class="func">删除</span>
             </span>
@@ -115,32 +128,103 @@
         background
       >
       </el-pagination>
+      <!-- 新增 -->
+    <Add
+        :visible="dialogVisible"
+        :form="form"
+        :readonly="readonly"
+        @close="onclone"
+        :typeId="typeId"
+      />
     </div>
   </div>
 </template>
 
 <script lang='ts' setup>
 import { onMounted, reactive, ref } from "vue";
+import Add from "./components/Add.vue";
 import { ElMessageBox } from "element-plus";
+import { wkTypes,wkDynamicsPage } from "@/api/Work";
+import useUserStore from "@/store/modules/user";
+const userStore = useUserStore();
+const user = ref(JSON.parse(userStore.userInfo));
+const userId = ref(user.value.userId);
 
 const tabIndex = ref(0);
 const tabs = ref([
-  { name: "党建统领", val: 0 },
+{ typeName: "常规工作", sortId: 1, },
-  { name: "经济生态", val: 1 },
-  { name: "公共服务", val: 2 },
-  { name: "平安法治", val: 3 },
 ]);
 
 const search = ref([]);
 const currentPage = ref(1);
 const pageSize = ref(10);
 const total = ref(0);
+
+const readonly = ref(false);
+const dialogVisible = ref(false);
+const form = ref({});
+
+
+//获取列表
+const tableDataloading = ref(false);
 const tableData = ref([
   { cName: "xxx村名", name: "村长名称", phone: "村长电话" },
 ]);
-
+const getWkDynamicsPage = () => {
-const dialogVisible = ref(false);
+  tableDataloading.value = true;
-const currentItem = ref({});
+  let params = {
+    userId:userId.value,
+    limit: pageSize.value,
+    page: currentPage.value,
+    typeId:typeId.value,
+  };
+  wkDynamicsPage(params).then((res: any) => {
+    console.log(res,'res==>');
+    tableData.value = res.data.list;
+    total.value = res.data.total;
+    tableDataloading.value = false;
+  });
+};
+//头部点击取id
+const clickRadio = ()=>{
+  tabs.value.forEach(item => {
+    if (item.sortId == tabIndex.value) {
+      typeId.value = item.typeId;
+    }
+  });
+  getList()
+}
+//关闭新增弹窗
+const onclone = () => {
+  dialogVisible.value = false;
+  form.value = {};
+  getList();
+};
+//工作类型
+const typeId = ref('')
+const getWkTypes = ()=>{
+  let params = {
+    classify:2
+  }
+  wkTypes(params).then((res: any) => {
+    tabs.value = res.data;
+    typeId.value = res.data[0].typeId;
+    tabIndex.value = 1;
+  });
+}
+//刷新
+const getList = ()=>{
+  currentPage.value = 1;
+  getWkDynamicsPage();
+}
+//删除
+const deletelist = (data)=>{
+  console.log(data);
+}
+onMounted(() => {
+  getWkTypes();
+  getWkDynamicsPage();
+});
 </script>
 
 <style lang="scss" scoped>
@@ -148,16 +232,14 @@ const currentItem = ref({});
     height: auto;
     display: flex;
     flex-direction: column;
-
     .rg {
         padding: 16px;
-    background: #ffffff;
+        background: #fff;
-    box-shadow: 0px 0px 6px rgba(0, 120, 255, 0.1);
+        box-shadow: 0 0 6px rgb(0 120 255 / 10%);
         border-radius: 6px;
         display: flex;
         flex-direction: row;
         margin-bottom: 10px;
-
         :deep(.el-radio-button__inner) {
             min-width: 150px;
         }
@@ -166,17 +248,12 @@ const currentItem = ref({});
         width: 100%;
         background: #fff;
         border-radius: 0.26042vw;
-    box-shadow: 0 0 0.41667vw 0 rgba(8, 33, 85, 0.1);
+        box-shadow: 0 0 0.41667vw 0 rgb(8 33 85 / 10%);
         height: 100%;
         padding: 0.83333vw;
         overflow-y: auto;
         overflow-x: hidden !important;
-    -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box;
-    -o-box-sizing: border-box;
-    -ms-box-sizing: border-box;
         box-sizing: border-box;
-
         .table {
             margin-top: 16px;
         }