设置动态列表抽取到顶部 2022年12月13日 sxm

src/api/table.js

@@ -25,6 +25,9 @@ export const updateTableUser = data => createAPI(`gridTableUser/updateTableUser`
 // 删除
 export const removerUser = data => createAPI(`gridTableUser/removerUser`,'post',data)
 
+// 获取功能对应下的所有表格
+export const getMenuTableList = data => createAPI(`gridTableDefault/getMenuTableList`,'post',data)
+
 
 
 

src/icons/svg/icon-editTable.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1670914070507" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2012" width="48" height="48" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M895.9 288.5v62.4h2.8c21.9 0 42.9 5.8 61.3 16.7v-79.1h-64.1z m-211.2 164v-164h-64.1v164H404.4v-164h-64.1v164H129.1v-164H65v388h-1v64h1v219h279.1l60.2-119.3v-99.7h49.9l30.4-60.8 17.6 17.5 20.7-20.7H404.4v-160h216.2V579l108.3-108.1 18.4-18.4h-62.6z m-344.4 443H129.1v-155h211.2v155z m0-219H129.1v-160h211.2v160zM898.7 640.7v-0.1l-2.8 2.8v33.1h-33.1l-64.1 64h97.2v155H684.7v-8.6l-145.3 72.6H960V579.4z" fill="#17b3a3" p-id="2013"></path><path d="M684.7 879.3v-24.9l-12.5 12.5z" fill="#17b3a3" p-id="2014"></path><path d="M896 288.5v62.4h1.8c22.3 0 43.6 6 62.2 17.3v-79.7h-64z m-767 0H65v608h-1v63h280.3l31.5-63H129v-608z m768.8 352.1l-1.8 1.8v254.1H664.9l-126 63H960V578.4l-62.2 62.2z" fill="#17b3a3" p-id="2015"></path><path d="M937.4 431.3c-21.9-21.9-57.3-21.9-79.2 0l-39.6 39.6 39.1 39.1c0.2 0.2 0.4 0.4 0.5 0.6 0.2 0.2 0.4 0.4 0.6 0.5l39 39.1 39.6-39.6c21.9-22 21.9-57.4 0-79.3zM541.4 748.105l237.586-237.586 79.195 79.196L620.595 827.3zM422.6 946.1L581 866.9l-79.2-79.2z" fill="#17b3a3" p-id="2016"></path><path d="M65 64.5h895v224H65z" fill="#17b3a3" p-id="2017"></path></svg>

src/views/main-navbar.vue

@@ -21,6 +21,11 @@
       <el-menu
         class="site-navbar__menu site-navbar__menu--right"
         mode="horizontal">
+        <el-menu-item class="site-navbar__avatar" index="1">
+         <span class="el-dropdown-link" @click="userSetting">
+            <icon-svg name="editTable"  style="width: 25px;height: 25px;margin-top: 5px"></icon-svg>
+          </span>
+        </el-menu-item>
         <el-menu-item v-if="isAuth('review:show')" class="site-navbar__avatar" index="1">
          <span class="el-dropdown-link">
             <router-link :to="{path:'purchaseorder-procurementReview',query:{'': ''}}">
@@ -75,6 +80,9 @@
     <FileListView ref="fileListView" v-if="helpFileVisible"></FileListView>
     <!-- 打印机列表 -->
     <UserPrintList ref="userPrintList" v-if="printListVisible"></UserPrintList>
+
+    <!-- 动态列    -->
+    <column v-if="visible" ref="column" @refreshData="getTableUserColumn" v-drag></column>
   </nav>
 </template>
 
@@ -84,6 +92,7 @@
 import {clearLoginInfo} from '@/utils'
 import FileListView from './modules/common/file-list-view'
 import UserPrintList from './modules/common/user-print-list'
+import column from "./modules/common/column";
 import {
   searchFunctionButtonList,
   saveButtonList,
@@ -98,6 +107,7 @@
 export default {
   data() {
     return {
+      visible: false,
       updatePassowrdVisible: false,
       updateLanguageVisible: false,
       helpFileVisible: false,
@@ -212,7 +222,8 @@
     UpdatePassword,
     UpdateLanguage,
     FileListView,
-      UserPrintList
+    UserPrintList,
+    column,
   },
   computed: {
     navbarLayoutType: {
@@ -252,6 +263,24 @@
     clearInterval(this.toolReviewTimer);
   },
   methods: {
+    // 打开页面设置
+    userSetting() {
+      this.visible = true;
+      let queryTable = {
+        userId: this.$store.state.user.name,
+        functionId: this.$route.meta.menuId,
+        languageCode: this.$i18n.locale,
+        tableId: '',
+      }
+      this.$nextTick(() => {
+        this.$refs.column.init(queryTable);
+      })
+    },
+    getTableUserColumn() {
+      this.$nextTick(() => {
+        this.$router.go(0)
+      })
+    },
     // 获取待审核的是工具申请单数量
     getReviewToolCount() {
       getReviewToolCount(this.queryToolReview).then(({data}) => {

src/views/modules/common/column.vue

@@ -1,8 +1,14 @@
 <template>
-  <el-dialog :close-on-click-modal="false" :show-close="false" :close-on-press-escape="false" title="设置表格栏位"
+  <el-dialog :modal-append-to-body="false"
+             :close-on-click-modal="false" :show-close="false" :close-on-press-escape="false" title="设置表格栏位"
              :visible.sync="visible"
              class="cl"
              width="958px" v-drag>
+    <el-select v-model="this.queryTable.tableId">
+      <el-option @change="getTableUserList" :value="item.tableId" :label="item.tableName" v-for="(item,index) in tableList" :key="index">
+
+      </el-option>
+    </el-select>
     <el-table
       :height="height"
       :data="userColumnList"
@@ -90,7 +96,6 @@
     </el-table>
 
 
-
     <span slot="footer" class="dialog-footer">
       <el-button type="primary" @click="updateColumnList()">确定</el-button>
       <el-button @click="visible = false" type="primary">取消</el-button>
@@ -105,7 +110,8 @@
 import {
   saveTableUser,
   getTableDefaultListLanguage,
-    getTableUserListLanguage
+  getTableUserListLanguage,
+  getMenuTableList
 } from "@/api/table.js"
 
 export default {
@@ -214,6 +220,7 @@
         },
 
       ],
+      tableList: [],
       dataList: [],
       // 用户table 配置集合
       userColumnList: [],
@@ -225,20 +232,33 @@
   methods: {
 
     // 获取 用户的配置
-      init(queryTable) {
+    async init(queryTable) {
+      if (!queryTable.functionId) return;
       this.visible = true
       this.queryTable = queryTable
-        getTableUserListLanguage(queryTable).then(({data}) => {
+      this.dataListLoading = true
+
+      // 先获取功能下的所有tableId 和tableName
+      await getMenuTableList(queryTable).then(({data}) => {
+        if (data && data.code == 0) {
+          this.tableList = data.data
+          this.queryTable.tableId = data.data.length>0?data.data[0].tableId:'-1'
+        }
+      })
+      await this.getTableUserList()
+    },
+    async getTableUserList(){
+      await getTableUserListLanguage(this.queryTable).then(({data}) => {
          if (data.code == 0) {
+           this.dataListLoading = false
            this.userColumnList = data.rows
            if (data.rows.length <= 0) {
-              getTableDefaultListLanguage(queryTable).then(({data}) => {
+             getTableDefaultListLanguage(this.queryTable).then(({data}) => {
                this.userColumnList = data.rows
              })
            }
          }
        })
-
      },
     // 修改 table 列
     updateColumnList() {