更新会议

src/components/MyComponents/ChooseUser/index.vue

@@ -146,7 +146,16 @@ const form = ref({});
 const tableData = ref([]);
 const emits = defineEmits(["update:modelValue", "choosedUsers"]);
 onMounted(() => {
-  handleFilter();
+});
+
+watch(()=>props.modelValue, (val) => {
+  if (val) {
+    nextTick(() => {
+      getListData();
+    });
+  } 
+},{
+  immediate: true
 });
 const closed = () => {
   emits("update:modelValue", false);

src/components/aboutTable/Search.vue

@@ -42,6 +42,17 @@
           :disabledDate="disabledDate"
           value-format="YYYY-MM-DD"
         />
+        <el-date-picker
+          v-else-if="item.showType === 'datetimerange'"
+          v-model="searchObj[item.prop]"
+          type="datetimerange"
+          unlink-panels
+          :range-separator="item.rangeSeparator || '至'"
+          :start-placeholder="item.startPlaceholder || '开始日期'"
+          :end-placeholder="item.endPlaceholder || '结束日期'"
+          :shortcuts="item.shortcuts"
+          value-format="YYYY-MM-DD HH:mm:ss"
+        />
         <el-date-picker
           v-else-if="item.showType === 'date'"
           v-model="searchObj[item.prop]"
@@ -583,4 +594,8 @@ watchEffect(() => {
     }
   }
 }
+
+ ::v-deep .el-date-editor .el-range-separator{
+  color: #333;
+}
 </style>

src/views/backOfficeSystem/MeetingRoom/components/detailForm.vue

@@ -1,13 +1,119 @@
 <template>
-  <div>22</div>
+  <div class="dialog" v-if="dialogForm">
+    <div class="head_box">
+      <span class="title">网上会议室{{ title }} </span>
+      <div>
+        <el-button type="primary" size="small" :loading="loading" @click="submit" >保存</el-button>
+        <el-button size="small" @click="close">关闭</el-button>
+      </div>
+    </div>
+    <div class="form_cnt">
+      <FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
+        <template #glxsmc>
+          <el-input placeholder="请选择关联线索" @click="chooseVisiblexS = true" readonly v-model="listQuery.glxsmc"></el-input>
+        </template>
+        <template #chryList>
+          <el-input placeholder="请选择参会人员" @click="chooseVisible = true" readonly v-model="listQuery.rymc"></el-input>
+        </template>
+      </FormMessage>
+    </div>
+  </div>
+  <ChooseUser v-model="chooseVisible" :Single="false" @choosedUsers="handleUserSelected" :roleIds="roleIds" />
+  <Xslist v-model="chooseVisiblexS" @choosed="choosed" :roleIds="roleIdsxs"></Xslist>
 </template>
 
-<script>
+<script setup>
-export default {
+import ChooseUser from "@/components/MyComponents/ChooseUser/index.vue";
+import Xslist from '@/components/MyComponents/ChooseXs/index.vue'
+import FormMessage from "@/components/aboutTable/FormMessage.vue";
+import { qcckGet, qcckPost } from "@/api/qcckApi.js";
+import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, } from "vue";
+const emit = defineEmits(["updateDate"]);
 
-}
+const roleIds = ref([]); //角色id
+const chooseVisible = ref(false);
+const roleIdsxs = ref([]); //角色id
+const chooseVisiblexS = ref(false);
+const { proxy } = getCurrentInstance();
+const dialogForm = ref(false); //弹窗
+const rules = reactive({
+  hskssj: [{ required: true, message: "请选择会商开始时间", trigger: "change" }],
+  hsjssj: [{ required: true, message: "请选择会商结束时间", trigger: "change" }],
+  hsnr: [{ required: true, message: "请输入会商内容", trigger: "blur" }],
+  hsbt: [{ required: true, message: "请输入会商标题", trigger: "blur" }],
+  glxsmc: [{ required: true, message: "请选择关联线索", trigger: "change" }],
+  chryList: [{ required: true, message: "请选择参会人员", trigger: "change" }],
+});
+const formData = ref([
+  { label: "会商开始时间", prop: "hskssj", type: "datetime" },
+  { label: "会商结束时间", prop: "hsjssj", type: "datetime" },
+  { label: "会商内容", prop: "hsnr", type: "textarea", width: "100%" },
+  { label: "关联线索", prop: "glxsmc", type: "slot", },
+  { label: "会商标题", prop: "hsbt", type: "input" },
+  { label: "参会人员", prop: "chryList", type: "slot" ,width:'100%'},
+]);
+const listQuery = ref({}); //表单
+const loading = ref(false);
+const elform = ref();
+const title = ref("");
+
+// 初始化数据
+const init = (type, row) => {
+  dialogForm.value = true;
+  title.value = type == "add" ? "新增" : "编辑";
+  if (row) getDataById(row.id);
+};
+// 根据id查询详情
+const getDataById = (id) => {
+  qcckGet({id}, "/mosty-gsxt/wshs/selectByid").then((res) => {
+    res.rymc = res.chryList ? res.chryList.map(v=>v.chryxm).join(","):'';
+    res.chryList = res.chryList ? res.chryList.map(item => item.chryid) : [];
+    roleIds.value = res.chryList;
+    roleIdsxs.value = res.glxsid ? [res.glxsid] : [];
+    listQuery.value = res;
+  });
+};
+
+const handleUserSelected = (userData) => {
+  roleIds.value = userData.map(item => item.id);
+  listQuery.value.chryList = userData.map(item => item.id)
+  listQuery.value.rymc = userData.map(item => item.userName).join("、");
+};
+
+const choosed = (data) => {
+  listQuery.value.glxsmc = data[0].xsMc;
+  listQuery.value.glxsid = data[0].id;
+  roleIdsxs.value = data.map(item => item.id);
+};
+
+// 提交
+const submit = () => {
+  elform.value.submit((data) => {
+    let url = title.value == "新增" ? "/mosty-gsxt/wshs/add" : "/mosty-gsxt/wshs/update";
+    let params = { ...data };
+    loading.value = true;
+    qcckPost(params, url).then(() => {
+      loading.value = false;
+      proxy.$message({ type: "success", message: title.value + "成功" });
+      emit("updateDate");
+      close();
+    }).catch(() => {loading.value = false;});
+  });
+};
+
+// 关闭
+const close = () => {
+  listQuery.value = {};
+  roleIds.value = [];
+  roleIdsxs.value = [];
+  dialogForm.value = false;
+  loading.value = false;
+};
+
+defineExpose({ init });
 </script>
 
-<style>
+<style lang="scss" scoped>
-
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
 </style>

src/views/backOfficeSystem/MeetingRoom/index.vue

@@ -1,29 +1,27 @@
 <template>
   <div class="titleBox">
-    <PageTitle title="网上会议室" />
+    <PageTitle title="网上会议室">
+      <el-button type="primary" @click="addEdit('add', '')">
+        <el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
+        <span style="vertical-align: middle">新增</span>
+      </el-button>
+    </PageTitle>
   </div>
   <!-- 搜索 -->
   <div ref="searchBox">
-    <Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
+    <Search :searchArr="searchConfiger" @submit="onSearch" />
   </div>
   <!-- 表格 -->
   <div class="tabBox">
-    <div class="flexcb">
+    <ul class="list noScollLine" v-loading="pageData.loading">
-      <div class="btns">
+      <li class="list-item" v-for="(item, index) in pageData.list" :key="`tableData${index}`">
-        <el-button type="primary">新增</el-button>
-        <el-button type="danger">删除</el-button>
-      </div>
-      <Search :searchArr="searchArrMeet" @submit="onSearch" :key="pageData.keyCount + 1" class="search" />
-    </div>
-
-    <div class="list noScollLine">
-      <div class="list-item" v-for="(item, index) in pageData.tableData" :key="`tableData${index}`" @onmouseover="">
         <div class="top">
-          <div class="title ellipsis">{{ item.title }}</div>
+          <div class="title ellipsis">{{ item.hsbt }}</div>
-          <div class="info h20 ellipsis">会商内容：{{ item.hynr }}</div>
+          <div class="info h20 ellipsis">会商内容：{{ item.hsnr }}</div>
-          <div class="info h20 ellipsis">关联线索：{{ item.lxxs }}</div>
+          <div class="info h20 ellipsis">关联线索：{{ item.glxsmc }}</div>
           <div class="info h20 ellipsis">涉及人员：{{ item.sjry }}</div>
-          <div class="info h20 ellipsis">会商处置意见：xxxxxxx线索</div>
+          <div class="info h20 ellipsis">会商处置意见：{{ item.czyj }}</div>
+          <div class="info h20 ellipsis">会议时间：{{ item.hskssj }} - {{ item.hsjssj }}</div>
         </div>
 
         <div class="mid">
@@ -31,25 +29,32 @@
             <div class="title ellipsis">参会人员：{{ item.chry }}</div>
             <div class="desc">
               <div class="info ellipsis" v-for="(el, i) in item.cqcs" :key="i">{{ i + 1 }}.{{ el }}</div>
-              <!-- <div class="info ellipsis">2.应抓捕赵某，王某XXXXXXXXX王某XXXXXXXXXXXXXXXX等人</div> -->
             </div>
           </div>
           <div class="right">
-            <el-button type="primary" size="small">加入会议</el-button>
+            <el-button type="primary" size="small" @click="joinMeeting(item)">加入会议</el-button>
             <el-button type="primary" size="small">反馈情况</el-button>
             <el-button type="primary" size="small">处置下发</el-button>
           </div>
         </div>
 
         <div class="bottom">
+           <el-popover placement="top" :visible="item.visible" :width="400" trigger="click">
+            <template #reference>
               <el-link type="primary"><el-icon><ChatDotSquare /></el-icon>评论</el-link>
-          <el-link type="primary"><el-icon><VideoPlay /></el-icon>会议回放</el-link>
+            </template>
-          <el-link type="primary"><el-icon><Edit /></el-icon>详情</el-link>
+              <MOSTY.Other filterable style="width: 100%;" v-model="comments" type="textarea" rows="3" clearable placeholder="发表评论"/>
-          <el-link type="danger"><el-icon><Delete /></el-icon>删除</el-link>
+            <div class="mt10 flex just-center">
+              <el-button size="small" type="primary" @click.stop="handleSumbit(item)">发送</el-button>
             </div>
+          </el-popover>
+          <el-link type="primary" ><el-icon><VideoPlay /></el-icon>会议回放</el-link>
+          <el-link type="primary" @click="addEdit('edit', item)"><el-icon><Edit /></el-icon>编辑</el-link>
+          <el-link type="danger" @click="delDictItem(item.id)"><el-icon><Delete /></el-icon>删除</el-link>
         </div>
-    </div>
+      </li>
-
+       <MOSTY.Empty :show="!pageData.loading && pageData.list.length <= 0"></MOSTY.Empty>
+    </ul>
     <Pages
       @changeNo="changeNo"
       @changeSize="changeSize"
@@ -61,10 +66,11 @@
     ></Pages>
   </div>
   <!-- 详情 -->
-  <DetailForm ref="detailDiloag" />
+  <DetailForm ref="detailDiloag" @updateDate="getList" />
 </template>
 
 <script setup>
+import * as MOSTY from "@/components/MyComponents/index";
   import PageTitle from "@/components/aboutTable/PageTitle.vue";
   import Pages from "@/components/aboutTable/Pages.vue";
   import Search from "@/components/aboutTable/Search.vue";
@@ -78,134 +84,26 @@
   const searchConfiger = ref([
     {
       label: "会议主题",
-      prop: "businessNo",
+      prop: "hsbt",
       placeholder: "请输入会议主题",
       showType: "input"
     },
     {
-      label: "关联线索",
+      label: "会议时间",
-      prop: "goodsName",
+      prop: "daterange",
-      placeholder: "请选择关联线索",
+      showType: "datetimerange"
-      showType: "select"
     },
-    {
-      label: "涉及人员",
-      prop: "businessNo",
-      placeholder: "请输入涉及人员",
-      showType: "input"
-    },
-    {
-      label: "会议内容",
-      prop: "businessNo",
-      placeholder: "请输入会议内容",
-      showType: "input"
-    }
   ]);
-  const searchArrMeet = ref([
+  const comments = ref(''); // 评论内容
-    {
-      label: "",
-      prop: "title",
-      placeholder: "请输入关键字",
-      showType: "input"
-    }
-  ]);
-
   const queryFrom = ref({});
   const pageData = reactive({
-    tableData: [
+    list: [],
-      {
+    loading: false,
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      },
-      {
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      },
-      {
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      },
-      {
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      },
-      {
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      },
-      {
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      },
-      {
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      },
-      {
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      },
-      {
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      },
-      {
-        title: "林芝市XX地区发生的重大案件处理",
-        hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
-        sjry: "王某、赵某、.....",
-        chry: "王某、赵某、赵某赵某赵某.....",
-        cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
-      }
-    ],
-    keyCount: 0,
-    tableConfiger: {
-      rowHieght: 61,
-      showSelectType: "null",
-      loading: false
-    },
     total: 0,
     pageConfiger: {
       pageSize: 20,
       pageCurrent: 1
     },
-    controlsWidth: 120
   });
 
   onMounted(() => {
@@ -214,36 +112,77 @@
   });
 
   // 搜索
-  const onSearch = val => {
+  const onSearch = (val) => {
     queryFrom.value = { ...val };
+    if (val.daterange && val.daterange.length > 0) {
+      queryFrom.value.startTime = val.daterange[0];
+      queryFrom.value.endTime = val.daterange[1];
+    } else {
+      queryFrom.value.startTime = '';
+      queryFrom.value.endTime = '';
+    }
     pageData.pageConfiger.pageCurrent = 1;
     getList();
   };
 
-  const changeNo = val => {
+  const changeNo = (val) => {
     pageData.pageConfiger.pageNum = val;
     getList();
   };
-  const changeSize = val => {
+  const changeSize = (val) => {
     pageData.pageConfiger.pageSize = val;
     getList();
   };
 
   // 获取列表
-  const getList = val => {
+  const getList = () => {
-    // pageData.tableConfiger.loading = true;
+    pageData.loading = true;
     let data = { ...pageData.pageConfiger, ...queryFrom.value };
-    // let url = '/mosty-lzcj/tbDwMbkf/queryList';
+    delete data.daterange; // 删除daterange字段
-    // qcckPost(data,url).then(res=>{
+    qcckGet(data,'/mosty-gsxt/wshs/selectPage').then(res=>{
-    //   pageData.tableData = res.records || [];
+      let arr = res.records || [];
-    //   pageData.total = res.total;
+      arr.forEach(item => {
-    //   pageData.tableConfiger.loading = false;
+        item.chry = item.chryList ? item.chryList.map(el => el.chryxm).join('、') : '';
-    // }).catch(()=>{ pageData.tableConfiger.loading = false; })
+        item.sjry = item.xsryList ? item.xsryList.map(el => el.xm).join('、') : '';
+      });
+      pageData.list = arr;
+      pageData.total = res.total;
+      pageData.loading = false;
+    }).catch(()=>{ pageData.loading = false; })
   };
 
+  const handleSumbit = (item) => {
+    if (!comments.value) {
+      return proxy.$message({ type: "warning", message: "评论内容不能为空" });
+    }
+    item.visible = false; // 关闭评论弹窗
+    // 这里可以添加评论提交的逻辑
+    proxy.$message({ type: "success", message: "评论已发送" });
+    comments.value = ''; // 清空评论内容
+  };
+  const joinMeeting = (item) => {
+    qcckPost({id:item.id},'/mosty-gsxt/wshs/addWshyRy').then((res)=>{
+      console.log(res);
+    })
+    // proxy.$message({
+    //   type: "info",
+    //   message: `加入会议：${item.hsbt}`,
+    // });
+  };
+
+  // 删除
+const delDictItem = (id) =>{
+  proxy.$confirm("确定要删除", "警告", {type: "warning"}).then(() => {
+    qcckPost({id},'/mosty-gsxt/wshs/delete').then(()=>{
+      proxy.$message({ type: "success",  message: "删除成功" });
+      getList();
+    })
+  }).catch(() => {});
+}
+
   // 详情
   const addEdit = (type, row) => {
-    // detailDiloag.value.init(type, row);
+    detailDiloag.value.init(type, row);
   };
 
   // 表格高度计算
@@ -274,15 +213,14 @@
     padding: 10px 20px;
   }
   .list {
-    height: calc(100% - 62px);
+    height: calc(100% - 40px);
-
     gap: 10px;
     margin: 0 15px;
     overflow: auto;
     .list-item {
       display: inline-block;
       border: 1px solid #ccc;
-      height: 254px;
+      height: 270px;
       width: 380px;
       box-sizing: border-box;
       border-radius: 5px;
@@ -324,6 +262,19 @@
         padding: 10px 0;
         display: flex;
         justify-content: space-between;
+        .left {
+          width: calc(100% - 80px);
+          .title {
+            font-size: 14px;
+            color: black;
+            margin-bottom: 5px;
+          }
+          .info {
+            font-size: 12px;
+            color: #a5a1a1;
+            line-height: 1.5;
+          }
+        }
 
         .right {
           width: 80px;

src/views/backOfficeSystem/ResearchJudgment/InformationFlows/InstructionInformation/components/detailForm.vue

@@ -23,7 +23,7 @@
 </template>
 
 <script setup>
-import Xslist from './xslist.vue'
+import Xslist from '@/components/MyComponents/ChooseXs/index.vue'
 import FormMessage from '@/components/aboutTable/FormMessage.vue'
 import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
 import * as rule from "@/utils/rules.js";