Merge branch 'hi-ucs-dev' of http://124.222.94.39:3000/wuhongjian/hi-ucs into hi-ucs-dev

back/public/config/basicConfig.js

@@ -7,8 +7,8 @@
  */
 var _global = {}
 var CONFIGITEM = {
-  // version: 'qingdao', // 青岛
+  version: 'qingdao', // 青岛
-  version: 'xihaian', // 西海岸
+  // version: 'xihaian', // 西海岸
   // version: 'test', // 测试
   // version: 'frp', // 内网穿透
   // version: 'dev', // 开发

back/src/utils/location.js

@@ -1,13 +1,12 @@
 /*
- * @Author: hisense.liangjunhua
+ * @Author: hisense.guoyue
  * @Date: 2022-08-23 10:30:11
- * @LastEditors: hisense.liangjunhua
+ * @LastEditors: hisense.guoyue
- * @LastEditTime: 2022-09-01 16:06:05
+ * @LastEditTime: 2022-10-02 14:47:05
- * @Description: 告诉大家这是什么
+ * @Description: 判断当前环境是西海岸还是青岛市局
  */
 const returnLocationStr = () => {
-  // return 'qingdao'
+  return CONFIGITEM.version
-  return 'xihaian'
 }
 
 export default returnLocationStr

back/src/views/modules/workBench/workBench.vue

@@ -55,7 +55,8 @@ export default {
         num: 0,
         list: [],
         type: 'todo',
-        url: 'activiti-my-todo-task'
+        // url: 'activiti-my-todo-task',
+        url: 'myAgent-CompetencyApplication',
       },
       // 部门已办
       hasToDodoData: {
@@ -67,7 +68,8 @@ export default {
         textColor: '#21b107',
         num: 0,
         list: [],
-        url: 'activiti-my-join-task'
+        // url: 'activiti-my-join-task',
+        url: 'hasToDoTasks-CompetencyApplication',
       },
       // 部门申请
       resourceData: [],

front/src/views/abilityStatistics/components/AbilityTotal.vue

@@ -39,7 +39,9 @@
   ///whole_amount接口
   function snum() {
     totalResourceAggregation().then((res) => {
-      dataList.value = res.data.data
+      dataList.value = res.data.data;
+      console.log('res.data.data------------>', res.data.data);
+      
       res.data.data.map((item, index) => {
         console.log('dataList', dataList.value)
         switch (item.type) {
@@ -55,7 +57,8 @@
           case '用户量':
             dataList.value[index].organization = '人'
             break
-          case '覆盖部门量':
+          // case '覆盖部门量':
+          case '资源汇聚部门量':
             dataList.value[index].organization = '个'
             break
         }

front/src/views/abilityStatistics/components/ResourceAggregation.vue

@@ -11,12 +11,9 @@
           <div v-for="item in dataList.dataList" :key="item.name">
             <div v-if="item.type !== '资源汇聚总量'" class="content-left">
               <div class="name">
-                <span
+                <span class="name-photo" :style="{
-                  class="name-photo"
-                  :style="{
                   backgroundImage: `url(${item.photo}) `,
-                  }"
+                }"></span>
-                ></span>
                 <span class="name-text">{{ item.type }}</span>
               </div>
               <div class="organization-value">
@@ -55,113 +52,132 @@
   </div>
 </template>
 <script setup>
-  import { ref, onMounted, watch } from 'vue'
+import { ref, onMounted, watch } from 'vue'
-  import { selectTotal } from '@/api/home'
+import { selectTotal } from '@/api/home'
-  import {
+import {
   // numberOfResourcesByCategory,
   sourceDepartmentStatistics,
-  } from '@/api/abilityStatistics.js'
+} from '@/api/abilityStatistics.js'
-  // import { zywMessage } from '@/api/home'
+// import { zywMessage } from '@/api/home'
-  import * as echarts from 'echarts'
+import * as echarts from 'echarts'
-  //各类资源汇聚量
+//各类资源汇聚量
-  let dataList = ref({
+let dataList = ref({
   title: '各类资源汇聚量',
   dataList: [],
-  })
+})
-  // let photo = ref([
+// let photo = ref([
-  //   require('../../../assets/abilityStatistics/banner-jc.png'),
+//   require('../../../assets/abilityStatistics/banner-jc.png'),
-  //   require('../../../assets/abilityStatistics/banner-sj.png'),
+//   require('../../../assets/abilityStatistics/banner-sj.png'),
-  //   require('../../../assets/abilityStatistics/banner-zj.png'),
+//   require('../../../assets/abilityStatistics/banner-zj.png'),
-  //   require('../../../assets/abilityStatistics/banner-yy.png'),
+//   require('../../../assets/abilityStatistics/banner-yy.png'),
-  //   require('../../../assets/abilityStatistics/banner-zs.png'),
+//   require('../../../assets/abilityStatistics/banner-zs.png'),
-  // ])
+// ])
-  // let name = ref([])
+// let name = ref([])
-  // 获取数据资源数据
+// 获取数据资源数据
-  // const findZywMessage = () => {
+// const findZywMessage = () => {
-  //   zywMessage().then((res) => {
+//   zywMessage().then((res) => {
-  //     const { data } = res.data
+//     const { data } = res.data
-  //     dataSourceNum.value = data.sxmlcount || 0
+//     dataSourceNum.value = data.sxmlcount || 0
-  //     snum()
+//     snum()
-  //   })
+//   })
-  // }
+// }
-  //各类资源数目接口
+//各类资源数目接口
-  // function snum() {
+// function snum() {
-  //   numberOfResourcesByCategory().then((res) => {
+//   numberOfResourcesByCategory().then((res) => {
-  //     dataList.value.dataList = res.data.data
+//     dataList.value.dataList = res.data.data
-  //     res.data.data.map((item, index) => {
+//     res.data.data.map((item, index) => {
-  //       // if (dataList.value.dataList[index].type === '数据资源') {
+//       // if (dataList.value.dataList[index].type === '数据资源') {
-  //       //   dataList.value.dataList[index].amount = dataSourceNum.value || 0
+//       //   dataList.value.dataList[index].amount = dataSourceNum.value || 0
-  //       // }
+//       // }
-  //       dataList.value.dataList[index].organization = '个'
+//       dataList.value.dataList[index].organization = '个'
-  //       dataList.value.dataList[index].photo = photo.value[index]
+//       dataList.value.dataList[index].photo = photo.value[index]
-  //     })
+//     })
-  //   })
+//   })
-  // }
+// }
-  selectTotal().then((res) => {
+selectTotal().then((res) => {
   console.log('selectTotal===============>', res.data.data)
   // res.data.data.map((item, index) => {
   //   dataList.value.dataList[index].organization = '个'
   //   dataList.value.dataList[index].photo = photo.value[index]
   // })
+  let imgObj = {
+    '组件服务': require('../../../assets/abilityStatistics/banner-zj.png'),
+    '应用资源': require('../../../assets/abilityStatistics/banner-yy.png'),
+    '基础设施': require('../../../assets/abilityStatistics/banner-jc.png'),
+    '数据资源': require('../../../assets/abilityStatistics/banner-sj.png'),
+    '知识库': require('../../../assets/abilityStatistics/banner-zs.png'),
+  }
   res.data.data.total.forEach((val) => {
-      switch (val.type) {
+    let _obj = {
-        case '组件服务':
-          dataList.value.dataList.push({
       organization: '个',
-            type: '组件服务',
+      type: val.type,
-            photo: require('../../../assets/abilityStatistics/banner-zj.png'),
+      photo: val.type && imgObj[val.type],
       amount: val.count,
-          })
+    }
-          break
+    if (val.type == '基础设施') {
-        case '应用资源':
-          dataList.value.dataList.push({
-            organization: '个',
-            type: '应用资源',
-            photo: require('../../../assets/abilityStatistics/banner-yy.png'),
-            amount: val.count,
-          })
-          break
-        case '基础设施':
       if (uavAndIndividualSoldier.num) {
-            val.count = val.count - 0 + uavAndIndividualSoldier.num
+        _obj.amount = val.count - 0 + uavAndIndividualSoldier.num
       }
-          dataList.value.dataList.push({
-            organization: '个',
-            type: '基础设施',
-            photo: require('../../../assets/abilityStatistics/banner-jc.png'),
-            amount: val.count,
-          })
-          break
-        case '数据资源':
-          dataList.value.dataList.push({
-            organization: '个',
-            type: '数据资源',
-            photo: require('../../../assets/abilityStatistics/banner-sj.png'),
-            amount: val.count,
-          })
-          break
-        case '知识库':
-          dataList.value.dataList.push({
-            organization: '个',
-            type: '知识库',
-            photo: require('../../../assets/abilityStatistics/banner-zs.png'),
-            amount: val.count,
-          })
-          break
     }
+    dataList.value.dataList.push(_obj)
+    // switch (val.type) {
+    //   case '组件服务':
+    //     dataList.value.dataList.push({
+    //       organization: '个',
+    //       type: '组件服务',
+    //       photo: require('../../../assets/abilityStatistics/banner-zj.png'),
+    //       amount: val.count,
+    //     })
+    //     break
+    //   case '应用资源':
+    //     dataList.value.dataList.push({
+    //       organization: '个',
+    //       type: '应用资源',
+    //       photo: require('../../../assets/abilityStatistics/banner-yy.png'),
+    //       amount: val.count,
+    //     })
+    //     break
+    //   case '基础设施':
+    //     if (uavAndIndividualSoldier.num) {
+    //       val.count = val.count - 0 + uavAndIndividualSoldier.num
+    //     }
+    //     dataList.value.dataList.push({
+    //       organization: '个',
+    //       type: '基础设施',
+    //       photo: require('../../../assets/abilityStatistics/banner-jc.png'),
+    //       amount: val.count,
+    //     })
+    //     break
+    //   case '数据资源':
+    //     dataList.value.dataList.push({
+    //       organization: '个',
+    //       type: '数据资源',
+    //       photo: require('../../../assets/abilityStatistics/banner-sj.png'),
+    //       amount: val.count,
+    //     })
+    //     break
+    //   case '知识库':
+    //     dataList.value.dataList.push({
+    //       organization: '个',
+    //       type: '知识库',
+    //       photo: require('../../../assets/abilityStatistics/banner-zs.png'),
+    //       amount: val.count,
+    //     })
+    //     break
+    // }
   })
   let arr = ['组件服务', '应用资源', '基础设施', '数据资源', '知识库']
   dataList.value.dataList.sort((a, b) => {
     return arr.indexOf(a.type) - arr.indexOf(b.type)
   })
-  })
+})
-  let datas = ref([])
+let datas = ref([])
-  let laiyuanDataList = ref([])
+let laiyuanDataList = ref([])
-  // let dataSourceNum = ref(0)
+// let dataSourceNum = ref(0)
-  let bumenSum = ref([])
+let bumenSum = ref([])
 
-  //能力统计-来源部门统计接口
+//能力统计-来源部门统计接口
-  const sourceDepartment = () => {
+const sourceDepartment = () => {
   sourceDepartmentStatistics().then((res) => {
     // datas.value = res.data.data.deptTypeCount
     bumenSum.value = res.data.data.deptCount
@@ -190,10 +206,10 @@
     }
     console.log('laiyuanDataList.value', laiyuanDataList.value)
   })
-  }
+}
-  //来源部门饼图
+//来源部门饼图
-  let leftDom = ref(0)
+let leftDom = ref(0)
-  const pieCharti = (dataLists) => {
+const pieCharti = (dataLists) => {
   leftDom.value += 'a'
   echarts.init(document.getElementById('left')).dispose()
   let chartDom = document.getElementById('left')
@@ -291,31 +307,47 @@
   }
 
   option && myChart.setOption(option)
+}
+//来源部门漏斗图
+const funnelPlot = (dataList) => {
+  // 排序
+  let arrCopy = ['0-5', '5-10', '10-15', '15-20', '20以上']
+  // 真实数据
+  dataList.sort((a, b) => {
+    console.log(arrCopy.indexOf(a.fanwei), arrCopy.indexOf(b.fanwei))
+    return arrCopy.indexOf(b.fanwei) - arrCopy.indexOf(a.fanwei)
+  })
+  let _arr = dataList.map(v => v.fanwei) || arrCopy;
+  // 数据配置形成金字塔形状固定
+  let chartData = _arr.map((v, i) => {
+    return {
+      name: v,
+      value: 10 + 10 * i,
     }
-  //来源部门漏斗图
+  })
-  const funnelPlot = (dataList) => {
+
-    // let arr = ['0-5', '5-10', '10-15', '15-20', '20以上']
+  let newArr = [];
-    // dataList.sort((a, b) => {
+  dataList.map(v => {
-    //   console.log(arr.indexOf(a.fanwei), arr.indexOf(b.fanwei))
+    if (v.value && Number(v.value > 0)) {
-    //   return arr.indexOf(b.fanwei) - arr.indexOf(a.fanwei)
+      newArr.push({
-    // })
+        name: v.fanwei,
+        value: v.value
+      })
+    }
+  })
   console.log('============》', dataList)
   echarts.init(document.getElementById('right')).dispose()
   let chartDom = document.getElementById('right')
   let myChart = echarts.init(chartDom)
-    let option
+  let option = {
-
-    option = {
-      // title: {
-      //   text: '汇聚量',
-      // },
     tooltip: {
       trigger: 'item',
-        formatter: function (name) {
+      formatter: function (info) {
+        let _obj = dataList.find(v => v.fanwei == info.data.name) || {}
         let dom = ref()
         dom.value =
-            '部门数<br/>' + name.data.fanwei + ' : ' + name.data.value + '个'
+          '部门数<br/>' + (_obj.fanwei || '--') + ' : ' + (_obj.value || _obj.value === 0 ? _obj.value : '--') + '个'
-          console.log('name', name.data)
+        console.log('name', info.data)
         return dom.value
       },
     },
@@ -340,26 +372,34 @@
       {
         name: '部门数',
         type: 'funnel',
-          left: '20%',
+        left: '28%',
-          top: '10%',
+        right: '35%',
-          width: '60%',
+        top: '15%',
-          height: '80%',
+        bottom: '10%',
-          min: 0,
-          max: 100,
         minSize: '0%',
         maxSize: '100%',
         sort: 'ascending',
-          gap: 2,
         label: {
           show: true,
-            position: 'inside',
+          formatter: function (info) {
+            let _obj = dataList.find(v => v.fanwei == info.data.name) || {}
+            let dom = ref()
+            dom.value = (_obj.fanwei || '--') + ' : ' + (_obj.value || _obj.value === 0 ? _obj.value : '--') + '个';
+            console.log('name', info.data)
+            return dom.value
+          },
+          rich: {
+            b: {
+              fontSize: 14
+            }
+          }
         },
         labelLine: {
-            length: 10,
+          length: 40,
           lineStyle: {
             width: 1,
-              type: 'solid',
+            type: 'solid'
-            },
+          }
         },
         itemStyle: {
           borderColor: '#fff',
@@ -370,61 +410,61 @@
             fontSize: 20,
           },
         },
-          data: dataList,
+        data: chartData,
-        },
+      }
-        {
-          data: [],
-          type: 'bar',
-        },
     ],
   }
 
   option && myChart.setOption(option)
-  }
+}
-  onMounted(() => {
+onMounted(() => {
   // findZywMessage()
   // snum()
   sourceDepartment()
-  })
+})
-  watch(
+watch(
   datas,
   (value) => {
     pieCharti(value)
   },
   { deep: true }
-  )
+)
-  watch(
+watch(
   laiyuanDataList,
   (value) => {
     funnelPlot(value)
     console.log(value, '   laiyuanDataList')
   },
   { deep: true }
-  )
+)
 </script>
 <style lang="less" scoped>
-  @font-face {
+@font-face {
   font-family: 'num-typeface';
   src: url('~@/assets/newHome/font/num-typeface.otf');
-  }
+}
-  @font-face {
+
+@font-face {
   font-family: 'text-typeface';
   src: url('~@/assets/newHome/font/text-typeface.otf');
-  }
+}
-  .num {
+
+.num {
   font-family: num-typeface;
   font-size: 32px;
   font-weight: 600;
   margin-right: 5px;
-  }
+}
-  .hengxian {
+
+.hengxian {
   height: 3px;
   width: 30px;
   border-radius: 1px;
   margin-top: 6px;
   background: #0058e1;
-  }
+}
-  .resource-aggregation {
+
+.resource-aggregation {
   font-size: 18px;
   font-family: text-typeface;
   width: 100%;
@@ -432,6 +472,7 @@
   justify-content: center;
   background: #f3f5f9;
   padding-bottom: 60px;
+
   .resource-aggregation-left {
     background: #fff;
     border: 1px solid #e6e9ed;
@@ -442,12 +483,14 @@
     padding: 20px;
     padding-top: 64px;
     position: relative;
+
     .title {
       position: absolute;
       top: 20px;
       font-size: 18px;
       color: #212121;
     }
+
     .content {
       .content-son {
         .content-left {
@@ -459,10 +502,12 @@
           justify-content: space-between;
           align-items: center;
           border-radius: 1px;
+
           .name {
             display: flex;
             justify-content: center;
             align-items: center;
+
             .name-photo {
               margin-left: 10px;
               display: inline-block;
@@ -471,11 +516,14 @@
               margin-right: 11px;
             }
           }
+
           .organization-value {
             margin-right: 16px;
+
             .num {
               font-size: 26px;
             }
+
             span:nth-child(2) {
               font-size: 16px;
             }
@@ -484,6 +532,7 @@
       }
     }
   }
+
   .resource-aggregation-right {
     background: #fff;
     border: 1px solid #e6e9ed;
@@ -497,6 +546,7 @@
     position: relative;
     display: flex;
     padding-left: 120px;
+
     .title {
       position: absolute;
       top: 20px;
@@ -504,6 +554,7 @@
       font-size: 18px;
       color: #212121;
     }
+
     .bumensnum {
       width: 100px;
       position: absolute;
@@ -516,49 +567,58 @@
       background: rgba(0, 88, 225, 0.1);
       border-right: 1px solid rgba(0, 88, 225, 0.5);
       border-radius: 2px;
+
       .bumensnum-photo {
         height: 50px;
         width: 50px;
-          background: url('~@/assets/abilityStatistics/bumenzongshu.png')
+        background: url('~@/assets/abilityStatistics/bumenzongshu.png') no-repeat;
-            no-repeat;
         margin-bottom: 30px;
       }
+
       p {
         margin-top: 18px;
         color: #0058e1;
+
         .num {
           font-size: 30px;
         }
+
         span:last-child {
           font-size: 16px;
         }
       }
     }
+
     .content {
       width: 779px;
       height: 313px;
       display: flex;
       position: relative;
       background: #f1f4fb;
+
       .left {
         width: 373px;
         height: 313px;
       }
+
       .center {
         height: 240px;
         width: 1px;
         margin-top: 31px;
         background: #d0d4de;
       }
+
       .right {
         width: 406px;
         height: 313px;
       }
+
       .right-son1 {
         position: absolute;
         top: 10px;
         left: 52.5%;
       }
+
       .right-son2 {
         position: absolute;
         top: 10px;
@@ -566,5 +626,5 @@
       }
     }
   }
-  }
+}
 </style>

front/src/views/capacityOnTheShelf/components/PutOnTheShelf.vue

@@ -203,6 +203,7 @@
           </div>
         </div>
       </template>
+      
       <template v-else>
         <div class="bottom">
           <div
@@ -301,6 +302,16 @@
                 :list="props.fileList2"
                 tip="支持文件类型，大小不超过100M"
               ></upload>
+              <upload
+                v-else-if="item.type == 'richText' && item.name == '技术文档'"
+                type="附件"
+                btnName="上传技术文档"
+                :maxCount="1"
+                :data="item"
+                :busType="2"
+                :list="props.fileList2"
+                tip="支持.doc,.docx,.zip,.ppt,.pdf类型，大小不超过100M"
+              ></upload>
               <upload
                 v-else-if="item.type == 'package' && item.name == '上传附件'"
                 type="附件"

front/src/views/components/upload/index.vue

@@ -159,7 +159,7 @@
     width: unset;
     button {
       height: 30px;
-      width: 100px;
+      width: 120px;
       border: 1px solid #bbd3ef;
       border-radius: 6px;
       background: #edf4fc;

front/src/views/home/apply.vue

@@ -8,159 +8,69 @@
         </div>
         <div class="form-container">
           <div v-if="applySuccess">
-            <a-form
+            <a-form ref="formRef" :model="formName" name="basic" :label-col="{ style: { width: '106px' } }"
-              ref="formRef"
+              :wrapper-col="{ style: { width: '230px' } }" labelAlign="left" autocomplete="off">
-              :model="formName"
-              name="basic"
-              :label-col="{ style: { width: '106px' } }"
-              :wrapper-col="{ style: { width: '230px' } }"
-              labelAlign="left"
-              autocomplete="off"
-            >
               <div class="base-info flex-row-start">
-                <a-form-item
+                <a-form-item label="申请标题" name="title" :rules="[{ required: true, message: '请输入申请标题' }]">
-                  label="申请标题"
+                  <a-input placeholder="请输入能力申请标题" v-model:value="formName.title" />
-                  name="title"
-                  :rules="[{ required: true, message: '请输入申请标题' }]"
-                >
-                  <a-input
-                    placeholder="请输入能力申请标题"
-                    v-model:value="formName.title"
-                  />
                 </a-form-item>
                 <!-- 西海岸-摄像头-增加过期时间 -->
-                <a-form-item
+                <a-form-item v-if="isCamera && isXiHaiAn" label="过期时间" name="expireDate"
-                  v-if="isCamera && isXiHaiAn"
+                  :rules="[{ required: true, message: '请选择过期时间' }]" style="margin-left: 22px">
-                  label="过期时间"
+                  <a-select v-model:value="formName.expireDate" placeholder="请选择过期时间" style="width: 200px"
-                  name="expireDate"
+                    :options="expireDateOptions"></a-select>
-                  :rules="[{ required: true, message: '请选择过期时间' }]"
-                  style="margin-left: 22px"
-                >
-                  <a-select
-                    v-model:value="formName.expireDate"
-                    placeholder="请选择过期时间"
-                    style="width: 200px"
-                    :options="expireDateOptions"
-                  ></a-select>
                 </a-form-item>
               </div>
               <div class="base-info">
-                <a-form-item
+                <a-form-item label="申请人信息" name="user" :rules="[{ required: true, message: '请输入申请人' }]">
-                  label="申请人信息"
+                  <a-input placeholder="请输入申请人" v-model:value="formName.user" disabled />
-                  name="user"
-                  :rules="[{ required: true, message: '请输入申请人' }]"
-                >
-                  <a-input
-                    placeholder="请输入申请人"
-                    v-model:value="formName.user"
-                    disabled
-                  />
                 </a-form-item>
-                <a-form-item
+                <a-form-item style="margin: 0 22px" label="电话" name="phone" :rules="[
-                  style="margin: 0 22px"
-                  label="电话"
-                  name="phone"
-                  :rules="[
                   {
                     required: true,
                     pattern: /^1[3456789]\d{9}$/,
                     message: '请输入正确的电话号码',
                   },
-                  ]"
+                ]">
-                >
+                  <a-input placeholder="请输入申请人电话" v-model:value="formName.phone" />
-                  <a-input
-                    placeholder="请输入申请人电话"
-                    v-model:value="formName.phone"
-                  />
                 </a-form-item>
-                <a-form-item
+                <a-form-item label="单位" name="unit" :rules="[{ required: true, message: '请输入单位' }]">
-                  label="单位"
+                  <a-input placeholder="请输入单位" v-model:value="formName.unit" disabled v-if="deptFlage" />
-                  name="unit"
+                  <a-select v-else placeholder="请选择归属部门" v-model:value="formName.unit" @change="deptIdChangeFunction">
-                  :rules="[{ required: true, message: '请输入单位' }]"
+                    <a-select-option v-for="(item, index) in deptNameAll" :key="`${index}-${item}`" :value="item.name">
-                >
-                  <a-input
-                    placeholder="请输入单位"
-                    v-model:value="formName.unit"
-                    disabled
-                    v-if="deptFlage"
-                  />
-                  <a-select
-                    v-else
-                    placeholder="请选择归属部门"
-                    v-model:value="formName.unit"
-                    @change="deptIdChangeFunction"
-                  >
-                    <a-select-option
-                      v-for="(item, index) in deptNameAll"
-                      :key="`${index}-${item}`"
-                      :value="item.name"
-                    >
                       {{ item.name }}
                     </a-select-option>
                   </a-select>
                 </a-form-item>
               </div>
               <div class="base-info" v-if="flag">
-                <a-form-item
+                <div style="margin-bottom: 24px">
-                  label="应用系统"
+                  <a-form-item style="margin-bottom:0" label="应用系统" name="applicationSystem"
-                  name="applicationSystem"
+                    :rules="[{ required: true, message: '请选择应用系统' }]">
-                  :rules="[{ required: true, message: '请选择应用系统' }]"
+                    <a-select v-model:value="formName.applicationSystem" show-search placeholder="请选择应用系统"
-                >
+                      style="width: 230px" :options="systemOptions" @focus="handleFocus" @blur="handleBlur"
-                  <a-tooltip>
+                      @change="systemHandleChange" @search="systemHandleSearch"></a-select>
-                    <template #title>
-                      请输入关键字（如选项没有系统请新增）
-                    </template>
-                    <a-select
-                      v-model:value="formName.applicationSystem"
-                      show-search
-                      placeholder="请输入关键字（如选项没有系统请新增）"
-                      style="width: 230px"
-                      :options="systemOptions"
-                      @focus="handleFocus"
-                      @blur="handleBlur"
-                      @change="systemHandleChange"
-                      @search="systemHandleSearch"
-                    ></a-select>
-                  </a-tooltip>
                   </a-form-item>
-                <a-form-item
+                  <span style="font-size:12px;color:#666;padding-left:106px"> 请输入关键字（如选项没有系统请新增）</span>
-                  class="applicationScene"
+                </div>
-                  label="应用领域"
+                <a-form-item class="applicationScene" label="应用领域" name="applicationScene"
-                  name="applicationScene"
+                  :rules="[{ required: true, message: '请选择应用领域' }]" style="width: 6.93rem">
-                  :rules="[{ required: true, message: '请选择应用领域' }]"
+                  <a-select v-model:value="formName.applicationScene" :options="applicationSceneOpthion" mode="tags"
-                  style="width: 6.93rem"
+                    :size="size" placeholder="请选择应用领域" :filterOption="false" :searchValue="false"
-                >
+                    style="width: 5.87rem"></a-select>
-                  <a-select
-                    v-model:value="formName.applicationScene"
-                    :options="applicationSceneOpthion"
-                    mode="tags"
-                    :size="size"
-                    placeholder="请选择应用领域"
-                    :filterOption="false"
-                    :searchValue="false"
-                    style="width: 5.87rem"
-                  ></a-select>
                 </a-form-item>
               </div>
+
               <div>
-                <a-form-item
+                <a-form-item label="需求依据" name="applicationBackground" :rules="[
-                  label="需求依据"
-                  name="applicationBackground"
-                  :rules="[
                   { required: true, message: '请输入需求依据' },
                   { min: 50, message: '需求依据最少为50个字' },
-                  ]"
+                ]">
-                >
+                  <a-textarea placeholder="请输入需求依据" v-model:value="formName.applicationBackground" :rows="4" />
-                  <a-textarea
-                    placeholder="请输入需求依据"
-                    v-model:value="formName.applicationBackground"
-                    :rows="4"
-                  />
                 </a-form-item>
               </div>
               <div class="bottom-btn">
-                <a-button
+                <a-button style="
-                  style="
                     width: 80px;
                     height: 38px;
                     margin-right: 20px;
@@ -171,15 +81,10 @@
                     border: none;
                     padding: 0;
                     text-align: center;
-                  "
+                  " type="primary" html-type="cancle" @click="resetFields()">
-                  type="primary"
-                  html-type="cancle"
-                  @click="resetFields()"
-                >
                   退出申请
                 </a-button>
-                <a-button
+                <a-button style="
-                  style="
                     width: 80px;
                     height: 38px;
                     background: #0087ff;
@@ -189,11 +94,7 @@
                     border: none;
                     padding: 0;
                     text-align: center;
-                  "
+                  " type="primary" html-type="submit" @click="processStartHandle()">
-                  type="primary"
-                  html-type="submit"
-                  @click="processStartHandle()"
-                >
                   提交申请
                 </a-button>
               </div>
@@ -211,14 +112,14 @@
   </div>
 </template>
 <script>
-  import AbilityToApplyFor from './AbilityToApplyFor.vue'
+import AbilityToApplyFor from './AbilityToApplyFor.vue'
-  import HomeHeader from '@/views/home/components/header'
+import HomeHeader from '@/views/home/components/header'
-  import { reactive, ref, watch, onBeforeUnmount } from 'vue'
+import { reactive, ref, watch, onBeforeUnmount } from 'vue'
-  import { useRouter } from 'vue-router'
+import { useRouter } from 'vue-router'
-  import { message } from 'ant-design-vue'
+import { message } from 'ant-design-vue'
-  import qs from 'qs'
+import qs from 'qs'
-  import { Upload } from 'ant-design-vue'
+import { Upload } from 'ant-design-vue'
-  import {
+import {
   lastestPage,
   tabilityapplication,
   startOfBusinessKey,
@@ -229,17 +130,17 @@
   getUserInfo,
   relaunch,
   selectOne,
-  } from '@/api/home'
+} from '@/api/home'
-  import { getDeptAll } from '@/api/user'
+import { getDeptAll } from '@/api/user'
-  import { getCategoryTreePage, endProcess } from '@/api/personalCenter'
+import { getCategoryTreePage, endProcess } from '@/api/personalCenter'
-  import mybus from '@/myplugins/mybus'
+import mybus from '@/myplugins/mybus'
-  import { sgcDel, getApplyForm } from '@/api/personalCenter'
+import { sgcDel, getApplyForm } from '@/api/personalCenter'
-  import { pageWithAttrs, updateIntegrationServices } from '@/api/home'
+import { pageWithAttrs, updateIntegrationServices } from '@/api/home'
-  import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
+import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
-  import { getIntegrationDetail, soldierApply } from '@/api/home'
+import { getIntegrationDetail, soldierApply } from '@/api/home'
-  import * as moment from 'moment'
+import * as moment from 'moment'
 
-  export default {
+export default {
   name: '',
   props: {},
   components: {
@@ -678,10 +579,10 @@
               processDefinitionKey: processDefinitionKey,
               businessKey: businessKey,
             })
-              updateInstanceId(params).then(() => {})
+            updateInstanceId(params).then(() => { })
           }
         })
-          .catch(() => {})
+        .catch(() => { })
     }
     const options = ref([
       {
@@ -902,10 +803,10 @@
       expireDateOptions,
     }
   },
-  }
+}
 </script>
 <style scoped lang="less">
-  #apply-container {
+#apply-container {
   // background-color: #f5f8fc;
   height: 100%;
   width: 100%;
@@ -984,9 +885,9 @@
     font-weight: bold;
     color: #000;
   }
-  }
+}
 
-  .applicationScene {
+.applicationScene {
   :deep(.ant-select-selector) {
     overflow-x: scroll;
   }
@@ -994,16 +895,16 @@
   :deep(.ant-select-selection-overflow) {
     flex-wrap: nowrap;
   }
-  }
+}
 
-  textarea {
+textarea {
   resize: none;
   font-size: 14px;
-  }
+}
 
-  .bottom-btn {
+.bottom-btn {
   display: flex;
   justify-content: center;
   // position: fixed;
-  }
+}
 </style>

front/src/views/mynoticeView/components/NoticeList.vue

@@ -15,12 +15,7 @@
     </a-breadcrumb>
     <div class="top">
       <div class="left">
-        <div
+        <div class="item" :class="{ select: selectNav == nav.key }" v-for="nav in navList" :key="nav.key">
-          class="item"
-          :class="{ select: selectNav == nav.key }"
-          v-for="nav in navList"
-          :key="nav.key"
-        >
           <i :class="nav.key" @click="changeNav(nav)"></i>
           <div>{{ nav.title + '(' + nav.num + ')' }}</div>
         </div>
@@ -42,13 +37,7 @@
     </div>
     <div class="btn">
       <div class="left">
-        <a-select
+        <a-select ref="select" v-model:value="value" style="width: 120px" @focus="focus" @change="handleChange">
-          ref="select"
-          v-model:value="value"
-          style="width: 120px"
-          @focus="focus"
-          @change="handleChange"
-        >
           <a-select-option value="全部消息">全部消息</a-select-option>
           <a-select-option value="已读消息">已读消息</a-select-option>
           <a-select-option value="未读消息">未读消息</a-select-option>
@@ -62,33 +51,26 @@
         </div>
       </div>
       <div class="right">
-        <a-checkbox
+        <a-checkbox :checked="
-          :checked="
           selectData.length !== 0 && selectData.length === data.length
-          "
+        " stlye="margin-right:0.3rem;" @change="changeCheckAll()"></a-checkbox>
-          stlye="margin-right:0.3rem;"
-          @change="changeCheckAll()"
-        ></a-checkbox>
         <div>全选当前页</div>
         <span @click="read()">标记为已读</span>
       </div>
     </div>
     <div class="main">
       <a-list item-layout="horizontal" :data-source="data">
-        <template #renderItem="{ item }">
+        <template #renderItem="{ item }" @click="goNoticePage(item)">
           <a-list-item>
             <a-list-item-meta description="">
               <template #title>
-                <div class="left" @click="read(item)">
+                <div class="left" @click="read(item)" :class="item.readStatus === 0 ? 'bold-text' : ''">
                   {{ item.content }}
                 </div>
                 <div class="right">{{ '发布时间：' + item.senderDate }}</div>
               </template>
               <template #avatar>
-                <a-checkbox
+                <a-checkbox :checked="item.checked" @change="changeCheckBox(item)"></a-checkbox>
-                  :checked="item.checked"
-                  @change="changeCheckBox(item)"
-                ></a-checkbox>
                 <a-badge dot :offset="[-30, 5]" v-show="item.readStatus == 0">
                   <a-avatar :src="item.src" />
                 </a-badge>
@@ -100,30 +82,24 @@
         </template>
       </a-list>
     </div>
-    <a-pagination
+    <a-pagination v-model:current="pageNum" v-model:pageSize="pageSize" :total="total" show-less-items
-      v-model:current="pageNum"
+      :show-size-changer="false" @change="changePageNum" />
-      v-model:pageSize="pageSize"
-      :total="total"
-      show-less-items
-      :show-size-changer="false"
-      @change="changePageNum"
-    />
   </div>
 </template>
 <script setup>
-  // import { SearchOutlined } from '@ant-design/icons-vue'
+// import { SearchOutlined } from '@ant-design/icons-vue'
-  import { ref, reactive, onBeforeUnmount } from 'vue'
+import { ref, reactive, onBeforeUnmount } from 'vue'
-  import mybus from '@/myplugins/mybus'
+import mybus from '@/myplugins/mybus'
-  import { message } from 'ant-design-vue'
+import { message } from 'ant-design-vue'
-  import { mynotice, mynoticeRead } from '@/api/home'
+import { mynotice, mynoticeRead } from '@/api/home'
-  import { useRouter } from 'vue-router'
+import { useRouter } from 'vue-router'
-  const router = useRouter()
+const router = useRouter()
-  const total = ref(0)
+const total = ref(0)
-  const pageSize = ref(8)
+const pageSize = ref(8)
-  const pageNum = ref(1)
+const pageNum = ref(1)
-  const value = ref('全部消息')
+const value = ref('全部消息')
-  const obj = reactive({ page: pageNum.value, limit: pageSize.value })
+const obj = reactive({ page: pageNum.value, limit: pageSize.value })
-  const navList = reactive([
+const navList = reactive([
   {
     title: '全部',
     key: 'all',
@@ -144,11 +120,11 @@
     key: 'other',
     num: 0,
   },
-  ])
+])
-  const selectNav = ref('all')
+const selectNav = ref('all')
-  const selectData = ref([])
+const selectData = ref([])
-  const data = ref([])
+const data = ref([])
-  const changeNav = (nav) => {
+const changeNav = (nav) => {
   selectNav.value = nav.key
   if (nav.key === 'all') {
     delete obj.from
@@ -158,16 +134,16 @@
   value.value = '全部消息'
   delete obj.readStatus
   init()
-  }
+}
-  const changeCheckBox = (item) => {
+const changeCheckBox = (item) => {
   item.checked = !item.checked
   if (item.checked) {
     selectData.value.push(item.id)
   } else {
     selectData.value = selectData.value.filter((val) => val !== item.id)
   }
-  }
+}
-  const changeCheckAll = () => {
+const changeCheckAll = () => {
   if (selectData.value.length == data.value.length) {
     selectData.value = []
     data.value.forEach((val) => {
@@ -180,13 +156,13 @@
       selectData.value.push(val.id)
     })
   }
-  }
+}
-  const changePageNum = (page) => {
+const changePageNum = (page) => {
   pageNum.value = page
   obj.page = pageNum.value
   init()
-  }
+}
-  const handleChange = () => {
+const handleChange = () => {
   pageNum.value = 1
   obj.page = pageNum.value
   switch (value.value) {
@@ -204,35 +180,28 @@
       break
   }
   init()
-  }
+}
-  const goBack = (url) => {
+const goBack = (url) => {
   router.push({
     path: url,
   })
-  }
+}
-  const read = (item) => {
+const read = (item) => {
   // console.log(item)
   if (selectData.value.length === 0 && !item) {
     message.error('未选择消息！')
     return
   }
   console.log(selectData.value)
-    // let str = ''
-    // selectData.value.forEach((val, index) => {
-    //   str += val
-    //   if (index < selectData.value.length - 1) {
-    //     str += ';'
-    //   }
-    // })
   if (item) {
+    // 已读状态
+    if (item.readStatus === 1) {
+      return
+    }
+
     mynoticeRead(item.id).then((res) => {
-        if (res.data.code == 0 ) {
+      if (res.data.code == 0) {
         message.success('通知已读！')
-        //    if(item.readStatus == 1){
-        //   message.success('通知已读！')
-        // }  if(item.readStatus == 0){
-        //   message.success('通知已设为已读！')
-        // }
         mybus.emit('getMynotice')
         init()
       } else {
@@ -253,8 +222,8 @@
       })
     })
   }
-  }
+}
-  const init = () => {
+const init = () => {
   // from 通知 评论 readStatus 0 未读  1 已读
   mynotice(obj).then((res) => {
     console.log('消息=============>', res.data.data)
@@ -272,8 +241,8 @@
     total.value = res.data.data.total
     selectData.value = []
   })
-  }
+}
-  navList.forEach((val) => {
+navList.forEach((val) => {
   if (val.title === '全部') {
     mynotice({ page: pageNum.value, limit: pageSize.value }).then((res) => {
       val.num = res.data.data.total
@@ -287,30 +256,36 @@
       val.num = res.data.data.total
     })
   }
-  })
+})
+init()
+mybus.on('noticeListInit', () => {
   init()
-  mybus.on('noticeListInit', () => {
+})
-    init()
+onBeforeUnmount(() => {
-  })
-  onBeforeUnmount(() => {
   mybus.off('noticeListInit')
-  })
+})
 </script>
 <style lang="less" scoped>
-  .notice-list {
+.notice-list {
   padding: 0.64rem 0 0;
   background: #f4f5f8;
+
   .ant-breadcrumb {
     padding: 0.1rem 3.1rem;
   }
+
   .top {
     background: #fff;
     padding: 0.18rem 3.1rem 0;
     display: flex;
     justify-content: space-between;
     align-items: center;
+
+
+
     .left {
       display: flex;
+
       .item {
         display: flex;
         flex-direction: column;
@@ -319,6 +294,7 @@
         margin-left: 1.28rem;
         margin-bottom: 0.16rem;
         border-bottom: 3px solid #fff;
+
         i {
           display: inline-block;
           width: 0.48rem;
@@ -326,78 +302,98 @@
           margin-bottom: 0.15rem;
           cursor: pointer;
         }
+
         .all {
           background: url('~@/assets/mynoticeView/all.png') no-repeat;
           background-size: 100%;
         }
+
         .notice {
           background: url('~@/assets/mynoticeView/notice.png') no-repeat;
           background-size: 100%;
         }
+
         .comment {
           background: url('~@/assets/mynoticeView/comment.png') no-repeat;
           background-size: 100%;
         }
+
         .other {
           background: url('~@/assets/mynoticeView/other.png') no-repeat;
           background-size: 100%;
         }
       }
+
       .item:nth-of-type(1) {
         margin-left: 0;
       }
+
       .select {
         border-bottom: 3px solid #0058e1;
         color: #0058e1;
       }
     }
+
     .right {
       display: flex;
       align-items: center;
       height: 0.32rem;
+
       div {
         width: 0.5rem;
       }
+
       .reset {
         color: #0058e1;
         cursor: pointer;
       }
     }
   }
+
   .btn {
     background: #fff;
     margin-top: 0.16rem;
     padding: 0.14rem 3.1rem 0;
     display: flex;
     justify-content: space-between;
+
     .left {
       display: flex;
       align-items: center;
+
       .ant-select {
         margin-right: 0.24rem;
       }
+
+
       .check {
         display: flex;
         align-items: center;
+
         div {
           margin-left: 0.24rem;
+
           span {
             font-size: 18px;
             color: #0058e1;
           }
         }
+
         div:nth-of-type(1) {
           margin-left: 0.12rem;
         }
       }
     }
+
     .right {
       display: flex;
       justify-content: space-around;
       align-items: center;
+
       div {
         margin: 0 0.1rem;
       }
+
       span {
         cursor: pointer;
         color: #0058e1;
@@ -411,23 +407,32 @@
       }
     }
   }
+
   .main {
     background: #fff;
     padding: 0 3.1rem;
     height: 4.75rem;
     overflow-y: scroll;
+
     :deep(.ant-list-item-meta) {
       display: flex;
       align-items: center;
+
       .ant-checkbox-wrapper {
         margin-right: 0.3rem;
       }
+
       .ant-list-item-meta-title {
         display: flex;
         justify-content: space-between;
         align-items: center;
-          .left {
+
+        .bold-text {
+          font-weight: bold;
           cursor: pointer;
+        }
+
+        .left {
           width: 9.2rem;
           max-height: 0.43rem;
           overflow: hidden;
@@ -437,16 +442,23 @@
           -webkit-box-orient: vertical;
           word-break: break-all;
         }
+
+        .ant-badge-dot {
+          width: 8px;
+          height: 8px;
+        }
+
         .left:hover {
           color: #0058e1;
         }
       }
     }
   }
+
   .ant-pagination {
     background: #fff;
     margin-top: 0;
     padding: 0.2rem 0 0.2rem;
   }
-  }
+}
 </style>