Просмотр исходного кода

更新固定表格之后的排列问题

shaogen1995 3 лет назад
Родитель
Сommit
f9dcf0f787
4 измененных файлов с 49 добавлено и 14 удалено
  1. 8 0
      src/utils/api.js
  2. 2 2
      src/utils/request.js
  3. 25 4
      src/views/Layout.vue
  4. 14 8
      src/views/Tab6/index.vue

+ 8 - 0
src/utils/api.js

@@ -218,4 +218,12 @@ export const userAuth = (projectIds,userId) => {
     method: 'get',
     url: `/sys/user/auth/${userId}?projectIds=${projectIds}`,
   })
+}
+
+// 获取用户KEY
+export const getUserKey = (id) => {
+  return axios({
+    method: 'get',
+    url: `/sys/user/getUserKey/${id}`,
+  })
 }

+ 2 - 2
src/utils/request.js

@@ -1,8 +1,8 @@
 import axios from 'axios'
 const service = axios.create({
   // baseURL: 'http://192.168.0.135:8023', // 本地调试
-  baseURL: 'http://8.135.106.227:8023', // 线上调试
-  // baseURL: '', // build
+  // baseURL: 'http://8.135.106.227:8023', // 线上调试
+  baseURL: '', // build
   timeout: 5000
 })
 // 请求拦截器

+ 25 - 4
src/views/Layout.vue

@@ -6,8 +6,8 @@
         <h3>自定义云数据库</h3>
       </div>
       <div class="right">
-        <img src="../assets/img/user.png" alt="" />
-        <p>{{ userInfo.realName }}</p>
+        <img src="../assets/img/user.png" alt="" @click="dialogVisible=true" />
+        <p @click="dialogVisible=true">{{ userInfo.realName }}</p>
         <div class="outLogin" @click="isShow = true">修改密码</div>
         <div class="outLogin" @click="outLogin">退出登录</div>
       </div>
@@ -74,11 +74,22 @@
         <el-button type="primary" @click="btnOk">确 定</el-button>
       </div>
     </el-dialog>
+    <!-- 用户信息对话框 -->
+    <el-dialog
+      title="用户信息"
+      :visible.sync="dialogVisible"
+      width="30%"
+    >
+      <div class="row">用户key:{{userKey.userKey}}</div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">关 闭</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { userUpdatePwd } from "@/utils/api";
+import { userUpdatePwd, getUserKey } from "@/utils/api";
 import { encodeStr } from "../utils/pass";
 import { Base64 } from "js-base64";
 export default {
@@ -94,6 +105,9 @@ export default {
       }
     };
     return {
+      dialogVisible: false,
+      userKey:{},
+
       isShow: false,
       form: {
         oldPassword: "",
@@ -141,6 +155,10 @@ export default {
   watch: {},
   //方法集合
   methods: {
+    async getUserKey() {
+      let res = await getUserKey(this.userInfo.id);
+      this.userKey=res.data
+    },
     skip(path) {
       this.$router.push(path).catch(() => {});
     },
@@ -195,6 +213,7 @@ export default {
   created() {
     // 获取用户信息
     this.userInfo = JSON.parse(localStorage.getItem("Yun_User"));
+    this.getUserKey()
   },
   //生命周期 - 挂载完成(可以访问DOM元素)
   mounted() {},
@@ -233,16 +252,18 @@ export default {
       display: flex;
       align-items: center;
       & > img {
+        cursor: pointer;
         width: 40px;
         border-radius: 50%;
       }
       & > p {
+        cursor: pointer;
         margin: 0 20px 0 5px;
       }
       .outLogin {
         cursor: pointer;
         margin-right: 20px;
-        &:last-child{
+        &:last-child {
           margin-right: 0;
         }
       }

+ 14 - 8
src/views/Tab6/index.vue

@@ -35,18 +35,20 @@
     </div>
     <div class="table">
       <el-table
+        ref="table"
         :data="tableData"
+        height="540"
         style="width: 100%"
         @selection-change="selecChange"
       >
-        <el-table-column type="selection" width="55" :selectable="selectableSe">
+        <el-table-column type="selection" width="55" :selectable="selectableSe" fixed>
         </el-table-column>
-        <el-table-column label="序号" width="80">
+        <el-table-column label="序号" width="80" fixed>
           <template slot-scope="scope">
             {{ scope.$index + (pageData.pageNum - 1) * pageData.pageSize + 1 }}
           </template>
         </el-table-column>
-        <el-table-column label="操作" width="80">
+        <el-table-column label="操作" width="80" fixed>
           <template #default="{ row }">
             <el-button type="text" @click="editData(row.id)">编辑</el-button>
           </template>
@@ -173,6 +175,10 @@ export default {
         else if (v.type == "date" || v.type == "datetime") v.type = "日期";
         else if (v.type == "int") v.type = "数字";
       });
+      setTimeout(()=> {
+      this.$forceUpdate();
+      this.$refs.table.doLayout()
+    },200)
     },
   },
   //生命周期 - 创建完成(可以访问当前this实例)
@@ -208,11 +214,11 @@ export default {
   .table {
     width: 1570px;
     overflow-x: auto;
-    /deep/.el-table__body-wrapper {
-      width: 1570px;
-      height: 540px;
-      overflow-y: auto;
-    }
+    // /deep/.el-table__body-wrapper {
+    //   width: 1570px;
+    //   height: 540px;
+    //   overflow-y: auto;
+    // }
     .tabTxt {
       cursor: pointer;
       width: 200px;