【EDI】前端暂存

Web/src/components/ediTtablePage/index.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="app-container" v-loading="state.loading">
     <!-- 查询头部 -->
-    <el-card class="search-container" v-if="!props.hideSearch">
+    <el-card class="search-container" v-if="!(props.hideSearch && props.hideSetColums)">
-      <el-form :inline="true">
+      <el-form :inline="true" v-if="!props.hideSearch">
         <el-form-item 
           v-auth="props.apiName + state.searchBtnOptions['search'].auth"
           v-for="(item,index) in props.searchOptions"
@@ -31,6 +31,7 @@
             end-placeholder="结束时间"
             format="YYYY-MM-DD HH:mm:ss"
             value-format="YYYY-MM-DD HH:mm:ss"
+            style="width:370px"
           />
           <!-- 选择框 -->
           <el-select
@@ -69,7 +70,16 @@
           v-auth="btn.sAuth || props.apiName + btn.auth"
           :type="btn.type"
           @click="searchRightBtnHandle(btn)"
+          style="margin-right: 10px"
         >{{btn.label}}</el-button>
+        <!-- 字段设置 -->
+        <setColumsPop 
+          style="margin-left: auto;"
+          :localTableColumnsName="state.localTableColumnsName" 
+          :initTableColums="state.initTableColums" 
+          :tableColumns="getTableColumns()"
+          v-if="!props.hideSetColums"
+        ></setColumsPop>
       </div>
     </el-card>
     <!-- 头部详情 -->
@@ -158,7 +168,8 @@
   import { ElMessageBox, ElMessage,ElTable, ElTableColumn } from 'element-plus'
   import elTable from '@/components/elTable/index.vue'
   import elPager from '@/components/elPager/index.vue'
-  import { getPageParamsForFilter } from '@/utils/common/index'
+  import setColumsPop from '@/components/setColumsPop/index.vue'
+  import { getPageParamsForFilter,getLocalTableColumnsName } from '@/utils/common/index'
   import { downloadByData } from '@/utils/download'
   import importPop from '@/components/importPop/index.vue'
   import apiEditPop from '@/components/apiEditPop/index.vue'
@@ -205,6 +216,9 @@
     stage_tableData:[],
     // 暂存更改的行数（用于保留校验更改行数）
     stage_indexs:[],
+    //初始化表头，未从缓存获取之前
+    initTableColums:[],
+    localTableColumnsName:null,
     //tabel内部表单验证
     tableFormRulesData:null,
   })
@@ -323,11 +337,24 @@
         // {prop:'releaseEdition',ruleValue:'2024121901'},
       ]
     },
+    // 隐藏字段设置
+    hideSetColums:{
+      type: Boolean,
+      default: false
+    }
   })
   
   // 获取表头
   function getTableColumns(){
-    return props.tableColumns || apiTableColumns[props.apiName]
+    state.localTableColumnsName = getLocalTableColumnsName(useRoute().name)
+    if(props.apiType == 'detailApi'){
+      state.localTableColumnsName = getLocalTableColumnsName(props.apiName+'Detail')
+    }
+    let _local = JSON.parse(localStorage.getItem(state.localTableColumnsName))
+    state.initTableColums = props.tableColumns || apiTableColumns[props.apiName]
+    let _list = _local && _local != null && _local != undefined ? _local : JSON.parse(JSON.stringify(state.initTableColums))
+    return _list
+    // return props.tableColumns || apiTableColumns[props.apiName]
   }
 
   const emits = defineEmits([

Web/src/components/importPop/index.vue

@@ -70,7 +70,7 @@ const props = defineProps({
   },
 })
 const mode = import.meta.env.MODE
-let app_base_api = mode == 'prod' ? systemConfig.baseUrl : import.meta.env.VITE_API_BASE_URL
+let app_base_api = mode == 'production' ? systemConfig.baseUrl : import.meta.env.VITE_API_BASE_URL
 const importUrl =  `${app_base_api}/api/${props.apiName}/import`
 console.log('importUrl',importUrl)
 

Web/src/main.js

@@ -25,6 +25,11 @@ import { directive } from '@/directive/index'
 // 上传附件注册
 import { Boot } from '@wangeditor/editor'
 import attachmentModule from '@wangeditor/plugin-upload-attachment'
+
+// localStorage监听
+import { dispatchEventStroage } from "@/utils/common/localStorage"
+dispatchEventStroage()
+
 // 注册。要在创建编辑器之前注册，且只能注册一次，不可重复注册。
 Boot.registerModule(attachmentModule)
 

Web/src/settings.js

@@ -1,5 +1,5 @@
 const mode = import.meta.env.MODE
-const _title = mode == 'prod' ? systemConfig.title : 'EDI接口平台'
+const _title = mode == 'production' ? systemConfig.title : 'EDI接口平台'
 export default {
   title: _title,
 

Web/src/styles/index.scss

@@ -87,7 +87,7 @@ div:focus {
       }
       //全局input输入框长度不设置时clearable会导致宽度自动变更
       .el-input {
-        width: 200px !important;
+        width: 180px !important;
       }
     }
   }

Web/src/utils/common/apiTableColumns.js

@@ -357,7 +357,7 @@ const apiTableColumns = {
         {prop:'creationTime',title:'创建时间',width:180},
     ],
     // 采购订单风险确认-明细
-    cherysupplierconPoDetail:[
+    cherysupplierconpoDetail:[
         {prop:'purchaseOrder',title:'采购订单号',width:120},
         {prop:'serialNumber',title:'行项目号'},
         {prop:'plantId',title:'工厂代码'},

Web/src/utils/common/index.js

@@ -1,6 +1,10 @@
 import apiServeNames from '@/utils/common/apiServeNames'
 import apiTableColumns from '@/utils/common/apiTableColumns'
 
+import store from '@/stores'
+const userStore = store.userStore()
+const userInfo = userStore.state
+
 // filter中空字符转义
 export function getPageParamsForFilter(pageParams){
     if(pageParams.filters && JSON.stringify(pageParams.filters) != "{}"){
@@ -39,6 +43,17 @@ export async function downLoadJSONByString(stringData,title){
 }
 
 // 法根据tableName获取api
+export function getApiByServeName(value,prop='tableName'){
+    let _api = null
+    for(let i in apiServeNames){
+        if(apiServeNames[i][prop] == value){
+            _api = i
+        }
+    }
+    return _api
+}
+
+// 法根据tableName获取api对应的Coloums
 export function getColoumsByServeName(value,prop='tableName',noEdit){
     let _api = null
     for(let i in apiServeNames){
@@ -49,8 +64,15 @@ export function getColoumsByServeName(value,prop='tableName',noEdit){
     let __colums = JSON.parse(JSON.stringify(apiTableColumns[_api]))
     if(noEdit){
         __colums.forEach(item => {
-            item.type = null
+            if(item.type == 'input' || item.type == 'numberInput' || item.type == 'filterSelect' || item.type == 'datetimeInput'){
+                item.type = null
+            }
         });
     }
     return __colums
 }
+
+// 获取字段设置暂存的key值
+export function getLocalTableColumnsName(pageName){
+    return `tableColumns_${userInfo.userName}_${pageName}`
+}

Web/src/utils/common/localStorage.js

@@ -0,0 +1,11 @@
+// 重写setItem事件，当使用setItem的时候，触发，window.dispatchEvent派发事件
+export function dispatchEventStroage () {
+    const signSetItem = localStorage.setItem
+    localStorage.setItem = function (key, val) {
+      let setEvent = new Event('setItemEvent')
+      setEvent.key = key
+      setEvent.newValue = val
+      window.dispatchEvent(setEvent)
+      signSetItem.apply(this, arguments)
+    }
+}

Web/src/utils/request.js

@@ -4,7 +4,7 @@ import store from '@/stores'
 const mode = import.meta.env.MODE
 console.log('mode',mode)
 let app_base_api = import.meta.env.VITE_API_BASE_URL
-if(mode == 'prod'){
+if(mode == 'production'){
   app_base_api = systemConfig.baseUrl
 }
 // create an axios instance

Web/src/views/logisticsPlan/supplierConPo/index.vue

@@ -5,7 +5,7 @@
     :searchOptions="state.searchOptions"
     :searchFilter="state.searchFilter"
     :rightOperation="state.rightOperation"
-    :detailColumName="'cherysupplierconPoDetail'"
+    :detailColumName="'cherysupplierconpoDetail'"
     :searchButtons="['search','export','outputMany']"
     :multipleTable="state.auths.hasPermission(state.apiName+':outputMany')"
   ></ediTtablePage>
@@ -13,7 +13,7 @@
 
 
 <script setup>
-// 日物料需求计划风险确认
+// 采购订单风险确认
 defineOptions({ name: 'supplierConPo' })
 import store from '@/stores'
 import { reactive, ref, onMounted } from 'vue'

Web/src/views/task/logisticsPlanLog/index.vue

@@ -9,6 +9,7 @@
       :leftOperation="state.leftOperation"
       :leftOperationColumnWidth="180"
       :authName="'logisticsPlanLog'"
+      :searchFilterOptions="state.searchFilterOptions"
     ></tablePage>
 
     <!-- 明细抽屉 -->
@@ -68,6 +69,7 @@
       {type:'input',prop:'taskName',label:'任务名称'},
       {type:'datetimerange',prop:'creationTime',label:'创建时间'},
     ],
+    searchFilterOptions:{ module:{action:'=='} },
     leftOperation:[
       {label:'查看详情',name:'showInfo',link:true,type:'primary'},
       {label:'下载JSON',name:'downloadJSON',link:true,type:'warning'},

Web/src/views/task/productionQualityLog/index.vue

@@ -9,6 +9,7 @@
       :leftOperation="state.leftOperation"
       :leftOperationColumnWidth="180"
       :authName="'productionQualityLog'"
+      :searchFilterOptions="state.searchFilterOptions"
     ></tablePage>
 
     <!-- 明细抽屉 -->
@@ -68,6 +69,7 @@
       {type:'input',prop:'taskName',label:'任务名称'},
       {type:'datetimerange',prop:'creationTime',label:'创建时间'},
     ],
+    searchFilterOptions:{ module:{action:'=='} },
     leftOperation:[
       {label:'查看详情',name:'showInfo',link:true,type:'primary'},
       {label:'下载JSON',name:'downloadJSON',link:true,type:'warning'},