feat(*): 菜单选中效果添加，显示颜色优化

src/layout/menuCom.vue

@@ -6,7 +6,10 @@
         @open="handleOpen"
         @close="handleClose"
         :collapse="sidebar"
+        :active-text-color="'#1890FF'"
+        :default-active="activeMenu"
         :collapse-transition="false"
+        :router="true"
       >
         <template v-for="(item, index) in routerList" :key="item.path">
           <el-sub-menu
@@ -20,15 +23,16 @@
             </template>
               <el-menu-item v-for="(item_son, index_son) in item.children"
                             :key="item_son.path"
-                            :index="index + '_' + index_son"
+                            :index="item_son.path"
                             @click="handleClick(item_son.path)"
                             class="submenu-title-noDropdown"
               >
                 <span>{{getMenuTitle(item_son)}}</span>
               </el-menu-item>
           </el-sub-menu>
-          <el-menu-item v-else :index="index + ''"
+          <el-menu-item v-else :index="item.path"
                         class="submenu-box"
+                        :class="{'ns-active': item.path === activeMenu}"
                         @click="handleClick(item.path)"
           >
             <el-icon>
@@ -43,6 +47,7 @@
 </template>
 
 <script setup>
+import { computed } from 'vue';
 import {
   Document,
   Menu as IconMenu,
@@ -50,9 +55,10 @@ import {
   Setting,
 } from "@element-plus/icons-vue";
 import {routes} from "../router/index.js";
-import { useRouter } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router';
 import { menuStore } from '@/pinia/menu.js';
 import { storeToRefs } from 'pinia';
+const route = useRoute();
 const router = useRouter();
 const { sidebar } = storeToRefs(menuStore());
 const handleClick = (path) => {
@@ -65,6 +71,13 @@ const handleClick = (path) => {
 }
 
 const routerList = routes[0].children;
+
+const activeMenu = computed(()=>{
+   console.log('123--', route.path);
+   return route.path;
+});
+
+
 const handleOpen = (key, keyPath) => {
   console.log(key, keyPath);
 };
@@ -91,13 +104,25 @@ const getMenuTitle = (item) => {
 }
 
 
-.is-active {
-  color: #fff !important;
-  background: #03a1b3 !important;
-  span {
-    color: #fff !important;
+  .is-active {
+    .el-submenu__title {
+      color: #FFFFFFFF !important;
+      background: #03A1B3FF !important;
+
+      .el-icon-arrow-down {
+        color: #FFFFFFFF;
+      }
+      .svg-icon {
+        opacity: 1;
+      }
+    }
+  }
+  .ns-active {
+    background-color: #fff !important;
+    span {
+      color: #055f7c !important;
+    }
   }
-}
 </style>
 
 <style lang="scss">
@@ -121,10 +146,22 @@ const getMenuTitle = (item) => {
 // menu hover
 .submenu-title-noDropdown,
 .el-submenu__title {
-  background: transparent;
+  background: linear-gradient(225deg, rgba(128, 255, 178, .2), rgba(58, 120, 255, .1) 100%, #0049fa 0) !important;
   color: #FFFFFF !important;
   &:hover {
     background-color: #03a1b3 !important;
   }
 }
+
+.el-menu-item {
+  background: #055F7CFF !important;
+}
+
+.submenu-box .is-active {
+  background-color: #fff !important;
+  span {
+    color: #055f7c !important;
+  }
+}
+
 </style>
\ No newline at end of file

src/views/closeManage/myAgency.vue

@@ -55,6 +55,7 @@
       :data="tableData"
       :columns="tableColumns"
       :default-page-size="20"
+      :total="total"
       @pagination-change="handlePaginationChange"
       :pagination-texts="{
             total: '共',
@@ -588,6 +589,37 @@
         </el-form-item>
       </el-form>
     </common-dialog>
+    <common-dialog
+      :show-dialog="bagDialog.show"
+      :title="bagDialog.title"
+      :btn-group="bagDialog.btnGroup"
+      :width="bagDialog.width"
+      @handleBtn="saveBag"
+      @close:showDialog="bagDialog.show = false"
+    >
+      <el-form>
+        <el-form-item label="第几行：">
+          <el-select v-model="bagRow" placeholder="请选择第几行" @change="getCol">
+            <el-option
+              v-for="item in rowList" :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="第几列：">
+          <el-select v-model="bagCol" placeholder="请选择第几列">
+            <el-option
+                v-for="item in colList" :key="item.id"
+                :label="item.name"
+                :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+    </common-dialog>
   </div>
 </template>
 
@@ -595,14 +627,16 @@
 import { ref, reactive, onMounted, onBeforeUnmount,computed } from 'vue'
 import CommonTable from "@/components/commonTable/index.vue";
 import commonDialog from "./components/dialog.vue";
-import { getData, getDataFun, postDataJson, postDataJSON } from '@/request/method.js';
+import { getData, getDataFun, postData, postDataJson, postDataJSON } from '@/request/method.js';
 import moment from 'moment';
 import { getToken } from '@/utils/auth.js';
 import { ElMessage } from 'element-plus'
 import { storeToRefs } from 'pinia'
 
 import { useUsersStore } from "@/pinia/user.js";
+
 const { functionAuthority } =  storeToRefs(useUsersStore());
+const total = ref(0);
 const formInline = ref({
   eventName: '',
   keyword: '',
@@ -647,6 +681,80 @@ const assignDialog = ref({
     }
   ]
 });
+
+const bagDialog = ref({
+  title: '更换布袋',
+  show: false,
+  width: '30%',
+  btnGroup: [
+    {
+      attrKey: 'save',
+      label: '保存'
+    }
+  ]
+});
+
+const bagRow = ref('');
+const bagCol = ref('');
+const rowList = ref([]);
+const colList = ref([]);
+
+
+const saveBag = ()=>{
+   if (bagRow.value === '') {
+     ElMessage({
+       type: 'warning',
+       message: '请选择第几行'
+     });
+     return;
+   }
+   if (bagCol.value === '') {
+     ElMessage({
+       type: 'warning',
+       message: '请选择第几列'
+     });
+     return;
+   }
+   const params = {
+     workTicketNo: workTicketNo.value,
+     row: bagRow.value,
+     column: bagCol.value
+   };
+   postDataJSON('/transaction/doc/changeBag',params).then(res => {
+     if (res.code === 1) {
+       ElMessage({
+         type: 'success',
+         message: '更换布袋成功'
+       });
+       bagDialog.value.show = false;
+      }
+   });
+}
+const rowLineMap = ref(null);
+const getBagRowLine = (no) => {
+  const url = '/bag/cycle/getCompartEnumList';
+  const params = {
+    deviceNo: no
+  }
+  getDataFun((url,params).then(res => {
+    if (res.code === 1) {
+      rowLineMap.value = res.data;
+      res.data.forEach(item => {
+        rowList.value.push(item.row);
+      });
+    }
+  })
+  )
+}
+
+const getCol = ()=>{
+  rowLineMap.value.forEach(item => {
+    if (item.row === bagRow.value) {
+      colList.value.push(item.column);
+    }
+  });
+}
+
 const personTag = ref([]);
 
 const addPerson = ()=>{
@@ -880,7 +988,9 @@ const getDetail = (workTicketNo) => {
 }
 
 const changeBag = (data)=>{
-
+   workTicketNo.value = data.workTicketNo;
+   getBagRowLine(data.deviceNo);
+   bagDialog.value.show = true;
 }
 
 const tableData = ref([]);
@@ -1018,6 +1128,7 @@ const getTableData = ()=> {
   getDataFun(url,params).then(res => {
     if (res && res.code === 1) {
       const { list } = res.data;
+      total.value = res.data.total;
       disposeType(list);
       tableData.value = list;
     }

src/views/closeManage/myDone.vue

@@ -55,6 +55,7 @@
           :data="tableData"
           :columns="tableColumns"
           :default-page-size="20"
+          :total="total"
           @pagination-change="handlePaginationChange"
           :pagination-texts="{
             total: '共',
@@ -698,6 +699,37 @@
         </el-row>
       </el-form>
     </common-dialog>
+    <common-dialog
+        :show-dialog="bagDialog.show"
+        :title="bagDialog.title"
+        :btn-group="bagDialog.btnGroup"
+        :width="bagDialog.width"
+        @handleBtn="saveBag"
+        @close:showDialog="bagDialog.show = false"
+    >
+      <el-form>
+        <el-form-item label="第几行：">
+          <el-select v-model="bagRow" placeholder="请选择第几行" @change="getCol">
+            <el-option
+                v-for="item in rowList" :key="item.id"
+                :label="item.name"
+                :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="第几列：">
+          <el-select v-model="bagCol" placeholder="请选择第几列">
+            <el-option
+                v-for="item in colList" :key="item.id"
+                :label="item.name"
+                :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+    </common-dialog>
   </div>
 </template>
 
@@ -709,6 +741,7 @@ import { getData, getDataFun, postDataJSON } from '@/request/method.js';
 import moment from 'moment';
 import { getToken } from '@/utils/auth.js';
 import { ElMessage } from 'element-plus';
+import { router } from '@/router/index.js';
 const formInline = ref({
   eventName: '',
   keyword: '',
@@ -731,6 +764,78 @@ const viewDialog = ref({
   width: '45%',
 });
 
+const bagDialog = ref({
+  title: '更换布袋',
+  show: false,
+  width: '30%',
+  btnGroup: [
+    {
+      attrKey: 'save',
+      label: '保存'
+    }
+  ]
+});
+
+const bagRow = ref('');
+const bagCol = ref('');
+const rowList = ref([]);
+const colList = ref([]);
+
+const saveBag = ()=>{
+  if (bagRow.value === '') {
+    ElMessage({
+      type: 'warning',
+      message: '请选择第几行'
+    });
+    return;
+  }
+  if (bagCol.value === '') {
+    ElMessage({
+      type: 'warning',
+      message: '请选择第几列'
+    });
+    return;
+  }
+  const params = {
+    workTicketNo: workTicketNo.value,
+    row: bagRow.value,
+    column: bagCol.value
+  };
+  postDataJSON('/transaction/doc/changeBag',params).then(res => {
+    if (res.code === 1) {
+      ElMessage({
+        type: 'success',
+        message: '更换布袋成功'
+      });
+      bagDialog.value.show = false;
+    }
+  });
+}
+const rowLineMap = ref(null);
+const getBagRowLine = (no) => {
+  const url = '/bag/cycle/getCompartEnumList';
+  const params = {
+    deviceNo: no
+  }
+  getDataFun((url,params).then(res => {
+        if (res.code === 1) {
+          rowLineMap.value = res.data;
+          res.data.forEach(item => {
+            rowList.value.push(item.row);
+          });
+        }
+      })
+  )
+}
+
+const getCol = ()=>{
+  rowLineMap.value.forEach(item => {
+    if (item.row === bagRow.value) {
+      colList.value.push(item.column);
+    }
+  });
+}
+
 const viewData = {
   D: "在线监控(监测)仪器仪表故障",
   B: "在线监控(监测)仪器仪表与数采通讯异常",
@@ -898,7 +1003,8 @@ const saveReject = ()=>{
   const params = {
     workTicketNo:  workTicketNo.value,
     rejectType: rejectType.value,
-    rejectReason: rejectReason.value
+    rejectReason: rejectReason.value,
+    isDcTom: 1
   }
   postDataJSON(url,params).then(res => {
     workTicketNo.value = '';
@@ -930,7 +1036,9 @@ const getDetail = (workTicketNo) => {
 }
 
 const changeBag = (data)=>{
-
+  workTicketNo.value = data.workTicketNo;
+  getBagRowLine(data.deviceNo);
+  bagDialog.value.show = true;
 }
 
 const tableData = ref([]);
@@ -1040,6 +1148,8 @@ const searchData = ()=>{
   getTableData();
 }
 
+const total = ref(0);
+
 const getTableData = ()=> {
   let keyWord = formInline.value.keyword?.replace(/#/g, '%23');
   const params = {
@@ -1061,6 +1171,7 @@ const getTableData = ()=> {
   getDataFun(url,params).then(res => {
     if (res && res.code === 1) {
       const { list } = res.data;
+      total.value = res.data.total;
       disposeType(list);
       tableData.value = list;
     }