修改菜单

src/api/user.js

@@ -39,3 +39,13 @@ export function getMenu() {
     method: 'get'
   })
 }
+
+// 获取角色列表
+export function getRoleList() {
+  return request({
+    url: '/sys/roles',
+    method: 'post'
+  })
+}
+
+

src/components/PageSelect/index.vue

+<template>
+  <div>
+    <el-select
+      ref="selectRef"
+      :disabled="disabled"
+      :multiple="multiple"
+      clearable
+      filterable
+      remote
+      :remote-method="remoteSearch"
+      placeholder="请选择"
+      v-model.trim="selectValue"
+      @change="handleChange"
+      @visible-change="handleVisible"
+      :loading="loading"
+    >
+      <div class="option">
+        <el-option
+          v-for="(item, index) in options"
+          :key="index"
+          :label="item.label"
+          :value="item.value"
+        >
+        </el-option>
+      </div>
+      <div class="pagin" v-if="pageNumberAll > 30">
+        <el-pagination
+          small
+          background
+          layout="prev, pager, next, total"
+          :page-size="pageSize"
+          :total="pageNumberAll"
+          :current-page="pageNumber"
+          @current-change="page"
+        >
+        </el-pagination>
+      </div>
+    </el-select>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "PageSelect",
+  props: {
+    // 绑定的值（双向绑定显示的值）
+    select: {
+      type: [String, Array, Number],
+      default: "",
+    },
+    // 是否多选
+    multiple: {
+      type: Boolean,
+      default: false,
+    },
+    // 请求地址
+    url: {
+      type: String,
+      required: true,
+    },
+    // 是否禁用
+    disabled: {
+      type: Boolean,
+      default: false,
+    },
+    // 模糊查询关键字
+    filterKey: {
+      type: String,
+      default: "",
+    },
+    // 下拉修改时使用到的参数
+    editinfo: {
+      type: Object,
+      default: () => {},
+    },
+    // 行下标唯一标识
+    rowIndex: {
+      type: Number,
+      default: undefined,
+    },
+    // 下拉显示的文字
+    label: {
+      type: String,
+      default: "",
+    },
+    // 下拉选择的值
+    value: {
+      type: [String, Array, Number],
+      default: "",
+    },
+  },
+  data() {
+    // 这里存放数据
+    return {
+      options: [],
+      selectValue: "",
+      pageNumber: 1,
+      pageSize: 30,
+      pageNumberAll: 0,
+      loading: false,
+    };
+  },
+  mounted() {
+    // 函数调用顺序要在options赋值为空数组之后
+    this.initData();
+    this.getOptionList();
+  },
+  // 方法集合
+  methods: {
+    // 处理值改变事件
+    handleChange(value) {
+      this.$emit("update:select", value);
+      this.$emit("getStationType", this.rowIndex, this.tableData);
+    },
+    // 下拉框隐藏事件
+    handleVisible(val) {
+      // 下拉框隐藏后重新加载下拉数据
+      console.log(this.$refs.selectRef.visible);
+      if (!val) {
+        this.getOptionList();
+      }
+    },
+    // 过滤，实现模糊查询
+    remoteSearch(value = "") {
+      let params = {};
+      let that = this;
+      if (value) {
+        params = {
+          //   queryConfig: [
+          //     {
+          //       name: that.filterKey,
+          //       condition: "like",
+          //       value: value,
+          //     },
+          //   ],
+          name: that.filterKey,
+          //   condition: "like",
+          //   value: value,
+        };
+      }
+      this.getOptionList(params);
+    },
+    // 获取列表数据
+    getOptionList(query = {}) {
+      this.loading = true;
+      this.options = [];
+      let that = this;
+      let params = Object.assign(
+        {
+          limit: 30,
+          page: 1,
+        },
+        query
+      );
+      //   this.$http.post(this.url, params).then(({ data: d }) => {
+      //     if (d.code == 0) {
+      //       this.pageNumberAll = d.data.total;
+      //       this.tableData = d.data.records;
+      //       d.data.records.forEach((item) => {
+      //         that.options.push({
+      //           label: item[that.label],
+      //           value: item[that.value],
+      //         });
+      //       });
+      //       this.loading = false;
+      //     }
+
+      axios
+        .post(this.url, params, {
+          headers: {
+            authorization: getToken(),
+          },
+        })
+        .then((res) => {
+          //   if (response.code == 0) {
+          this.pageNumberAll = res.data.total;
+          this.tableData = res.data.records;
+          res.data.records.forEach((item) => {
+            that.options.push({
+              label: item[that.name],
+              value: item[that.crId],
+            });
+          });
+          this.loading = false;
+          //   }
+        })
+        .catch((error) => {
+          reject(error);
+        });
+      //   });
+      //   })
+      // 这里主要针对修改操作，如果当前下拉显示的值没有在下拉选项数组里（因为options数组里的值是会变化的）
+      // 显示时会将value转换成字符串然后显示，所有将这条修改的数据添加到选项数组中
+      if (this.editinfo && JSON.stringify(this.editinfo) != "{}") {
+        this.options.push(this.editinfo);
+      }
+    },
+    // 初始化数据
+    initData() {
+      // 当父组件上存在值时，对select值进行初始化
+      this.selectValue = this.select;
+    },
+    // 主表格分页点击事件
+    page(page) {
+      this.pageNumber = page;
+      this.getOptionList(); // 更新
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.option {
+  min-height: 50px;
+  height: auto;
+  max-height: 150px;
+  overflow-y: auto;
+}
+.pagin {
+  background: #fff;
+}
+::-webkit-scrollbar {
+  width: 2px;
+}
+</style>

src/components/ReaderOperations/index.vue

@@ -3,6 +3,7 @@
     <div class="operations">
       <span class="operation-item" v-if="like">
         <svg-icon
+          :style="{ fontSize: iconSize + 'px' }"
           icon-class="like"
           :class="loveCountStatus ? 'like' : ''"
         ></svg-icon>
@@ -10,13 +11,17 @@
       </span>
       <span class="operation-item" v-if="collect">
         <svg-icon
+          :style="{ fontSize: iconSize + 'px' }"
           icon-class="collect"
           :class="collectCountStatus ? 'collect' : ''"
         ></svg-icon>
         <span>{{ collectCount }}</span>
       </span>
       <span v-if="share" class="operation-item">
-        <svg-icon icon-class="share"></svg-icon>
+        <svg-icon
+          icon-class="share"
+          :style="{ fontSize: iconSize + 'px' }"
+        ></svg-icon>
       </span>
     </div>
   </div>
@@ -74,6 +79,10 @@ export default {
       type: String,
       default: "",
     },
+    iconSize: {
+      type: [Number, String],
+      default: 36,
+    },
   },
   data() {
     return {

src/icons/svg/role.svg

+<?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="1661755998261" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1879" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="28"><path d="M315.392 507.904c-81.92-40.96-137.216-122.88-137.216-221.184 0-135.168 110.592-245.76 245.76-245.76s245.76 110.592 245.76 245.76c0 133.12-104.448 241.664-237.568 245.76h-2.048c-202.752 0-368.64 165.888-368.64 368.64 0 12.288-8.192 20.48-20.48 20.48s-20.48-8.192-20.48-20.48c0-186.368 124.928-344.064 294.912-393.216z m108.544-16.384c112.64 0 204.8-92.16 204.8-204.8s-92.16-204.8-204.8-204.8-204.8 92.16-204.8 204.8 92.16 204.8 204.8 204.8z m561.152 135.168l4.096 10.24-49.152 59.392c-8.192 10.24-8.192 26.624 0 36.864l49.152 57.344-4.096 10.24c-10.24 28.672-24.576 57.344-45.056 79.872l-8.192 8.192-75.776-12.288c-12.288-2.048-26.624 6.144-30.72 18.432l-26.624 73.728-10.24 2.048c-38.912 8.192-77.824 8.192-116.736 0l-12.288-2.048-24.576-71.68c-4.096-12.288-18.432-20.48-30.72-18.432l-77.824 12.288-8.192-8.192c-10.24-10.24-18.432-22.528-24.576-34.816-8.192-14.336-16.384-30.72-20.48-47.104l-4.096-10.24 51.2-57.344c8.192-10.24 8.192-26.624 0-34.816l-49.152-59.392 4.096-10.24c10.24-30.72 26.624-57.344 47.104-81.92l8.192-8.192 73.728 12.288c12.288 2.048 26.624-6.144 32.768-18.432l26.624-71.68 10.24-2.048c36.864-8.192 75.776-8.192 114.688 0l12.288 2.048 24.576 69.632c4.096 12.288 18.432 22.528 32.768 20.48l75.776-10.24 8.192 8.192c10.24 12.288 18.432 22.528 24.576 36.864 6.144 10.24 12.288 26.624 18.432 40.96z m-57.344-24.576c-4.096-8.192-8.192-14.336-14.336-22.528l-53.248 6.144c-32.768 4.096-65.536-16.384-75.776-47.104l-16.384-47.104c-24.576-4.096-49.152-4.096-73.728 0l-18.432 49.152c-10.24 30.72-45.056 51.2-77.824 45.056l-51.2-8.192c-12.288 14.336-20.48 32.768-28.672 49.152l34.816 40.96c20.48 24.576 20.48 63.488 0 88.064l-34.816 40.96c4.096 10.24 8.192 18.432 14.336 28.672 4.096 8.192 8.192 14.336 14.336 20.48l55.296-8.192c32.768-4.096 65.536 16.384 75.776 47.104l16.384 49.152c24.576 4.096 51.2 4.096 75.776 0l18.432-51.2c10.24-30.72 45.056-51.2 75.776-45.056l51.2 8.192c10.24-14.336 20.48-30.72 26.624-49.152l-32.768-38.912c-20.48-24.576-22.528-63.488-2.048-88.064l34.816-40.96c-4.096-8.192-8.192-16.384-14.336-26.624z m-196.608 204.8c-51.2 0-92.16-40.96-92.16-92.16s40.96-92.16 92.16-92.16 92.16 40.96 92.16 92.16-43.008 92.16-92.16 92.16z m0-40.96c28.672 0 51.2-22.528 51.2-51.2s-22.528-51.2-51.2-51.2-51.2 22.528-51.2 51.2 22.528 51.2 51.2 51.2z" p-id="1880"></path></svg>
\ No newline at end of file

src/icons/svg/user2.svg

+<?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="1661755994656" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1737" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="28"><path d="M762.3 323.5c0-142.5-115.5-258.1-258-258.2v-0.1c-68.5 0-134.2 27.2-182.7 75.6C273.2 189.2 246 255 246 323.5c0 96.6 53.7 179.9 132.3 224.2C235.6 599 132.8 733.8 131.4 893.8v5.1c0.2 9.2 2 17.9 2.8 27.1h0.6c1.5 14.3 13.5 25.1 27.9 25.1 14.3 0 26.4-10.8 27.9-25.1h0.9c-0.8-9.7-2.9-19-2.9-28.8 0-83.7 33.2-164 92.4-223.2 59.2-59.2 139.5-92.5 223.2-92.4l28.7-2.9c128.8-14.3 229.4-122.5 229.4-255.2z m-459 0c0-111 89.9-200.9 200.9-200.9s200.9 89.9 200.9 200.9-89.9 200.9-200.9 200.9-200.9-90-200.9-200.9zM725.7 938.6V783.4h140.6c12.4 0 22.6-10.2 22.6-22.6v-4.5c0-12.4-10.2-22.6-22.6-22.6H725.7V605.3c0-12.4-10.2-22.6-22.6-22.6h-6.8c-12.4 0-22.6 10.2-22.6 22.6v128.3H533c-12.4 0-22.6 10.2-22.6 22.6v4.5c0 12.4 10.2 22.6 22.6 22.6h140.6v155.2c0 12.4 10.2 22.6 22.6 22.6h6.8c12.5 0.1 22.7-10.1 22.7-22.5z" p-id="1738"></path></svg>
\ No newline at end of file

src/icons/svg/xitong.svg

+<?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="1661754765672" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1617" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="28"><path d="M585.856 96a32 32 0 0 1 31.776 28.352l10.24 89.28a319.68 319.68 0 0 1 84.544 48.896l82.464-35.84a32 32 0 0 1 40.448 13.344l73.856 127.936a32 32 0 0 1-8.64 41.696l-72.256 53.504a322.496 322.496 0 0 1 0 97.664l72.224 53.504a32 32 0 0 1 8.672 41.696L835.328 784a32 32 0 0 1-40.448 13.344l-82.464-35.84a319.68 319.68 0 0 1-84.544 48.896l-10.24 89.28a32 32 0 0 1-28.064 28.16l-3.712 0.192h-147.712a32 32 0 0 1-31.168-24.704l-0.64-3.648-10.24-89.28a319.68 319.68 0 0 1-84.48-48.864L229.12 797.312a32 32 0 0 1-38.4-10.24l-2.048-3.104L114.816 656a32 32 0 0 1 5.6-39.104l3.072-2.592 72.224-53.504a322.496 322.496 0 0 1 0-97.664l-72.224-53.504a32 32 0 0 1-10.464-38.112l1.792-3.584L188.672 240a32 32 0 0 1 36.96-14.624l3.488 1.28 82.496 35.84a319.68 319.68 0 0 1 84.48-48.896l10.24-89.28A32 32 0 0 1 438.176 96h147.712z m-28.576 64h-90.624l-11.36 99.296-36 13.984a255.36 255.36 0 0 0-58.688 32.256l-8.896 6.848-30.144 24.224-91.776-39.872-45.312 78.464 80.32 59.52-5.824 38.144a258.496 258.496 0 0 0-1.28 68.608l1.28 9.664 5.824 38.144-80.32 59.488 45.312 78.464 91.776-39.84 30.144 24.224c17.504 14.08 36.736 25.792 57.248 34.816l10.336 4.288 36 13.984 11.36 99.296h90.624l11.392-99.296 36-13.984a255.36 255.36 0 0 0 58.72-32.256l8.896-6.848 30.144-24.224 91.744 39.84 45.312-78.464-80.32-59.488 5.856-38.144a258.496 258.496 0 0 0 1.28-68.608l-1.28-9.664-5.824-38.144 80.288-59.52-45.312-78.464-91.744 39.872-30.144-24.224a255.936 255.936 0 0 0-57.248-34.816l-10.368-4.288-36-13.984L557.28 160zM512 352a160 160 0 1 1 0 320 160 160 0 0 1 0-320z m0 80a80 80 0 1 0 0 160 80 80 0 0 0 0-160z" p-id="1618"></path></svg>
\ No newline at end of file

src/icons/svg/yewu.svg

+<?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="1661754769955" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1759" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="28"><path d="M384 96H192a96 96 0 0 0-96 96v192a96 96 0 0 0 96 96h192a96 96 0 0 0 96-96V192a96 96 0 0 0-96-96z m32 288a32 32 0 0 1-32 32H192a32 32 0 0 1-32-32V192a32 32 0 0 1 32-32h192a32 32 0 0 1 32 32v192zM384 544H192a96 96 0 0 0-96 96v192a96 96 0 0 0 96 96h192a96 96 0 0 0 96-96v-192a96 96 0 0 0-96-96z m32 288a32 32 0 0 1-32 32H192a32 32 0 0 1-32-32v-192a32 32 0 0 1 32-32h192a32 32 0 0 1 32 32v192zM832 544h-192a96 96 0 0 0-96 96v192a96 96 0 0 0 96 96h192a96 96 0 0 0 96-96v-192a96 96 0 0 0-96-96z m32 288a32 32 0 0 1-32 32h-192a32 32 0 0 1-32-32v-192a32 32 0 0 1 32-32h192a32 32 0 0 1 32 32v192z" p-id="1760"></path><path d="M736 288m-192 0a192 192 0 1 0 384 0 192 192 0 1 0-384 0Z" p-id="1761"></path></svg>
\ No newline at end of file

src/router/index.js

@@ -46,7 +46,7 @@ export const constantRoutes = [{
     path: '/',
     component: Layout,
     redirect: '/home',
-    name:'HomeMenu',
+    name: 'HomeMenu',
     hidden: false,
     children: [{
       path: 'home',
@@ -59,11 +59,25 @@ export const constantRoutes = [{
     }]
   },
   {
-    path: '/display',
+    path: '/business',
     component: Layout,
-    name:'DisplayMenu',
+    name: 'Business',
     hidden: false,
+    meta: {
+      title: '业务管理',
+      icon: 'yewu'
+    },
+    redirect: '/culturalRelic',
     children: [{
+        path: 'culturalRelic',
+        name: 'CulturalRelic',
+        component: () => import('@/views/culturalRelic/index'),
+        meta: {
+          title: '文物管理',
+          icon: 'culturalRelic'
+        },
+      },
+      {
         path: 'display',
         name: 'Display',
         component: () => import('@/views/display/index'),
@@ -71,14 +85,8 @@ export const constantRoutes = [{
           title: '展览管理',
           icon: 'display'
         }
-    }]
       },
       {
-    path: '/boutique',
-    component: Layout,
-    name:'BoutiqueMenu',
-    hidden: false,
-    children: [{
         path: 'boutique',
         name: 'Boutique',
         component: () => import('@/views/boutique/index'),
@@ -86,29 +94,8 @@ export const constantRoutes = [{
           title: '精品展管理',
           icon: 'boutique'
         }
-    }]
       },
       {
-    path: '/culturalRelic',
-    component: Layout,
-    name:'CulturalRelicMenu',
-    hidden: false,
-    children: [{
-      path: 'culturalRelic',
-      name: 'CulturalRelic',
-      component: () => import('@/views/culturalRelic/index'),
-      meta: {
-        title: '文物管理',
-        icon: 'culturalRelic'
-      },
-    }]
-  },
-  {
-    path: '/museum',
-    component: Layout,
-    name:'MuseumRelicMenu',
-    hidden: false,
-    children: [{
         path: 'museum',
         name: 'Museum',
         component: () => import('@/views/museum/index'),
@@ -116,14 +103,8 @@ export const constantRoutes = [{
           title: '博物馆管理',
           icon: 'museum'
         }
-    }]
       },
       {
-    path: '/virtual',
-    component: Layout,
-    name:'VirtualMenu',
-    hidden: false,
-    children: [{
         path: 'virtual',
         name: 'Virtual',
         component: () => import('@/views/virtual/index'),
@@ -131,14 +112,8 @@ export const constantRoutes = [{
           title: '虚拟展厅',
           icon: 'virtual'
         }
-    }]
       },
       {
-    path: '/literature',
-    component: Layout,
-    name:'LiteratureMenu',
-    hidden: false,
-    children: [{
         path: 'literature',
         name: 'Literature',
         component: () => import('@/views/literature/index'),
@@ -146,14 +121,38 @@ export const constantRoutes = [{
           title: '文献管理',
           icon: 'literature'
         }
-    }]
+      }
+    ]
   },
   {
-    path: '/log',
+    path: '/system',
     component: Layout,
-    name:'LogMenu',
+    name: 'System',
     hidden: false,
+    meta: {
+      title: '系统管理',
+      icon: 'xitong'
+    },
+    redirect: '/user',
     children: [{
+        path: 'user',
+        name: 'User',
+        component: () => import('@/views/user/index'),
+        meta: {
+          title: '用户管理',
+          icon: 'user2'
+        }
+      },
+      {
+        path: 'role',
+        name: 'Role',
+        component: () => import('@/views/role/index'),
+        meta: {
+          title: '角色管理',
+          icon: 'role'
+        }
+      },
+      {
         path: 'log',
         name: 'Log',
         component: () => import('@/views/log/index'),
@@ -161,24 +160,26 @@ export const constantRoutes = [{
           title: '日志管理',
           icon: 'log'
         }
-    }]
       },
-  {
-    path: '/importExport',
-    component: Layout,
-    name:'ImportExportMenu',
-    hidden: false,
-    children: [{
-      path: 'importExport',
-      name: 'ImportExport',
-      component: () => import('@/views/importExport/index'),
-      meta: {
-        title: '导入记录',
-        icon: 'file'
-      }
-    }]
+    ]
   },
 
+  // {
+  //   path: '/importExport',
+  //   component: Layout,
+  //   name: 'ImportExportMenu',
+  //   hidden: false,
+  //   children: [{
+  //     path: 'importExport',
+  //     name: 'ImportExport',
+  //     component: () => import('@/views/importExport/index'),
+  //     meta: {
+  //       title: '导入记录',
+  //       icon: 'file'
+  //     }
+  //   }]
+  // },
+
   // 404 page must be placed at the end !!!
   {
     path: '*',

src/views/display/components/ExhibitionUnit.vue

@@ -105,7 +105,7 @@
               <ManualImageUploader
                 v-model="currentData.imagesVo"
                 :files="currentData.imagesVo"
-                :fileLimit="1"
+                :fileLimit="7"
                 :fileSize="50"
                 :fileType="['jpeg', 'jpg', 'png']"
                 listType="picture-card"

src/views/display/components/InfoEditDialog.vue

@@ -37,7 +37,11 @@
                 </el-option>
               </el-select>
             </el-form-item>
-            <el-form-item label="展览性质" :label-width="formLabelWidth" style="display:none">
+            <el-form-item
+              label="展览性质"
+              :label-width="formLabelWidth"
+              style="display: none"
+            >
               <el-select
                 v-model="dialogForm.displayCharacter"
                 placeholder="请选择展览性质"
@@ -137,7 +141,16 @@
                 >
                 </el-option>
               </el-select>
+              <!-- <PageSelect
+                ref="PageSelect"
+                label="name"
+                value="crId"
+                :select.sync="value"
+                :url="pageSelectUrl"
+                filter-key="name"
+              /> -->
             </el-form-item>
+
             <el-form-item label="关联文献" :label-width="formLabelWidth">
               <el-select
                 v-model="literatureValues"
@@ -212,6 +225,7 @@ import { addDisplay, editDisplay } from "@/api/display";
 import { mapGetters } from "vuex";
 import ManualUploader from "@/components/Uploader/ManualUploader.vue";
 import ExhibitionUnit from "./ExhibitionUnit.vue";
+// import PageSelect from "@/components/PageSelect";
 import { upload, uploadV1 } from "@/utils/file";
 import { themeTypeOptions } from "../contants";
 import { deleteFiles } from "@/api/file";
@@ -220,6 +234,7 @@ export default {
   components: {
     ManualUploader,
     ExhibitionUnit,
+    // PageSelect,
   },
   props: {
     visible: {
@@ -350,6 +365,7 @@ export default {
       images: [],
       videos: [],
       audios: [],
+      pageSelectUrl: "/api/bizCulturalRelic/listByPage",
     };
   },
   methods: {

src/views/display/components/templates/NormalStyle.vue

@@ -435,22 +435,6 @@ $label: #9f9c9a;
           }
         }
       }
-
-      .view-3d {
-        margin-top: 32px;
-        padding: 6px 10px;
-        width: 100%;
-        background-color: #c1925b;
-        border-radius: 48px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        color: white;
-        cursor: pointer;
-        img {
-          margin-right: 10px;
-        }
-      }
     }
 
     .title-container {

src/views/home/index.vue

 <template>
   <div class="dashboard-container">
-    <div class="dashboard-text">数据看板</div>
+    <div class="dashboard-text">首页</div>
   </div>
 </template>
 

src/views/literature/index.vue

@@ -265,6 +265,9 @@ export default {
 .pagination {
   margin: 16px;
 }
+.el-button{
+  margin-bottom: 22px;
+}
 ::v-deep .el-card__header {
   padding: 10px 20px;
   font-weight: bold;

src/views/log/index.vue

@@ -27,7 +27,7 @@
 <script>
 import TablePage from "@/components/Table/TablePage.vue";
 import TableOperation from "@/components/Table/TableOperation.vue";
-import { title } from "./config";
+import { title,operates  } from "./config";
 import { getLogList } from "@/api/log";
 
 import SearchBar from "@/components/SearchBar";

src/views/museum/index.vue

@@ -39,13 +39,18 @@
       </el-table-column> -->
       <el-table-column align="center" label="封面">
         <template slot-scope="scope">
-          <img :src="scope.row.faceImageUrl" width="100%" height="100px"/>
+          <img
+            :src="scope.row.faceImageUrl"
+            style="cursor: pointer"
+            width="100px"
+            @click="handelPreviewImages(scope.row.faceImageUrl)"
+          />
         </template>
       </el-table-column>
-      <!-- <el-table-column align="center" prop="longitude" label="经度">
+      <el-table-column align="center" prop="longitude" label="经度">
       </el-table-column>
       <el-table-column align="center" prop="latitude" label="纬度">
-      </el-table-column> -->
+      </el-table-column>
       <el-table-column
         align="center"
         prop="intro"
@@ -85,6 +90,11 @@
       @handleClose="handleClose"
       @refresh="loadData"
     />
+    <el-image-viewer
+      v-if="imgViewerVisible"
+      :on-close="closeImgViewer"
+      :url-list="imgList"
+    />
   </div>
 </template>
 
@@ -101,6 +111,8 @@ export default {
     TableOperation,
     InfoEditDialog,
     SearchBar,
+    "el-image-viewer": () =>
+      import("element-ui/packages/image/src/image-viewer"),
   },
   data() {
     return {
@@ -138,7 +150,9 @@ export default {
       loading: false,
       orgTreeData: [],
       expandRow: [],
-      tabelData:[]
+      tabelData: [],
+      imgList: [],
+      imgViewerVisible:false
     };
   },
   computed: {
@@ -226,7 +240,7 @@ export default {
     loadData(isReload) {
       this.$store.dispatch("org/getMuseumTreeData", isReload).then((res) => {
         this.orgTreeData = res;
-        this.tabelData = res[0].children
+        this.tabelData = res[0].children;
       });
     },
 
@@ -305,6 +319,21 @@ export default {
       this.drawerVisible = false;
       this.form = {};
     },
+
+    // 预览图片
+    handelPreviewImages(images) {
+      this.imgViewerVisible = true;
+      if (images.length > 1) {
+        this.imgList = images.split(",");
+      } else {
+        this.imgList = [images];
+      }
+    },
+
+    // 关闭预览图片
+    closeImgViewer() {
+      this.imgViewerVisible = false;
+    },
   },
 };
 </script>

src/views/role/components/InfoEditDialog.vue

+<template>
+  <el-dialog
+    :visible="dialogVisible"
+    width="40%"
+    style="height: 98%"
+    :before-close="handleClose"
+    top="5vh"
+    lock-scroll
+  >
+    <div class="title" slot="title">
+      <div class="divider"></div>
+      <div class="label">{{ title }}</div>
+    </div>
+    <div class="dialog-content">
+      <el-form :model="dialogForm" class="basic-info">
+        <el-form-item label="名称" :label-width="formLabelWidth">
+          <el-input
+            v-model="dialogForm.name"
+            autocomplete="off"
+            placeholder="请输入文献名称"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="作者" :label-width="formLabelWidth">
+          <el-input
+            v-model="dialogForm.authors"
+            autocomplete="off"
+            placeholder="请输入作者"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="文献来源" :label-width="formLabelWidth">
+          <el-input
+            v-model="dialogForm.source"
+            autocomplete="off"
+            placeholder="请输入文献来源"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="出版/发布日期" :label-width="formLabelWidth">
+          <el-date-picker
+            style="width: 100%"
+            v-model="dialogForm.date"
+            type="date"
+            placeholder="请选择出版/发布日期"
+            value-format="yyyy-MM-dd"
+          >
+          </el-date-picker>
+        </el-form-item>
+
+        <el-form-item label="状态" :label-width="formLabelWidth">
+          <el-switch v-model="status"> </el-switch>
+        </el-form-item>
+        <el-form-item label="文件" :label-width="formLabelWidth">
+          <ManualUploader
+            :files="files"
+            :fileLimit="1"
+            :fileSize="50"
+            listType="text"
+            :fileType="['pdf']"
+            ref="pdf"
+          />
+        </el-form-item>
+        <el-form-item label="备注" :label-width="formLabelWidth">
+          <el-input
+            type="textarea"
+            placeholder="请输入备注"
+            v-model="dialogForm.remark"
+            maxlength="600"
+            show-word-limit
+          >
+          </el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="dialog-footer">
+      <el-button @click="cancelForm">取 消</el-button>
+      <el-button type="primary" @click="handleSubmit"
+        >确定<i class="el-icon-right" style="margin-left: 5px"></i
+      ></el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { addLiterature, editLiterature } from "@/api/literature";
+import ManualUploader from "@/components/Uploader/ManualUploader.vue";
+import { mapGetters } from "vuex";
+import { uploadFile } from "@/utils/file";
+export default {
+  name: "InfoEditDialog",
+  components: {
+    ManualUploader,
+  },
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    form: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  computed: {
+    ...mapGetters(["userInfo"]),
+    title() {
+      if (this.dialogForm.literatureId) {
+        return "修改文献";
+      } else {
+        return "添加文献";
+      }
+    },
+  },
+  watch: {
+    form: {
+      handler: function (value) {
+        let that = this;
+
+        that.dialogForm = JSON.parse(JSON.stringify(value));
+        // 编辑状态
+        if (that.dialogForm.literatureId) {
+          // 回填状态
+          that.status = Boolean(Number(that.dialogForm.status));
+          // 回填文件
+          if (that.dialogForm.files) {
+            that.files = that.dialogForm.files;
+          }
+        }
+      },
+      immediate: true,
+      deep: true,
+    },
+    visible: {
+      handler: function (value) {
+        this.dialogVisible = value;
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  data() {
+    return {
+      dialogForm: {},
+      formLabelWidth: "100px",
+      status: false,
+      files: [], //文献文件
+      dialogVisible: false,
+    };
+  },
+  methods: {
+    handlePreview({ type, file }) {
+      console.log(type, file);
+    },
+    handleRemove(file, fileList) {
+      console.log(file, fileList);
+    },
+    // 取消编辑
+    cancelForm() {
+      this.$emit("handleClose");
+      this.faceImage = [];
+    },
+
+    async handleSubmit() {
+      // debugger
+      // console.log(this.dialogForm);
+      // return
+      let params = JSON.parse(JSON.stringify(this.dialogForm));
+      // 回填文件
+      let file = this.$refs.pdf.getFiles();
+      let formData = new FormData();
+      // console.log("file", file);
+      // return
+      //  debugger;
+      if (file[0].status == "ready") {
+        // debugger;
+        formData.append("files", file[0].raw);
+        let upLoadRes = await uploadFile(formData);
+        if (upLoadRes.code == 0) {
+          params.pdfFile = upLoadRes.data[0].fileId;
+        } else {
+          this.$message.error("上传失败！:" + upLoadRes.data.msg);
+        }
+      } else if (file[0].status == "success") {
+        params.pdfFile = file[0].fileId;
+      }
+      // 修改状态
+      params.status = this.status ? 1 : 0;
+      if (params.literatureId) {
+        let res = await editLiterature(params);
+        if (res.code == 0) {
+          this.$message.success("修改成功！");
+          this.reload();
+        }
+      } else {
+        let res = await addLiterature(params);
+        if (res.code == 0) {
+          this.$message.success("添加成功！");
+          this.reload();
+        }
+      }
+    },
+    reload() {
+      this.$emit("refresh");
+      this.$emit("handleClose");
+      this.files = [];
+    },
+    handleClose(done) {
+      this.$confirm("确认关闭？")
+        .then((_) => {
+          done();
+          this.$emit("handleClose");
+          this.files = [];
+        })
+        .catch((_) => {});
+    },
+  },
+};
+</script>
+
+<style lang='scss' scoped>
+.title {
+  display: flex;
+  margin-bottom: 16px;
+  .divider {
+    width: 8px;
+    border-left: 4px solid #409eff;
+    margin-right: 8px;
+  }
+  .label {
+    font-weight: bold;
+  }
+}
+.dialog-content {
+  padding: 0 32px;
+  display: flex;
+  .basic-info {
+    flex: 1;
+    margin-right: 48px;
+  }
+}
+
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+</style>
\ No newline at end of file

src/views/role/config.js

+export const title = [{
+    prop: "name",
+    label: "名称",
+    columnAlign: 'center',
+    width: 200,
+    showOverFlowToolTip: true
+  },
+  {
+    prop: "authors",
+    label: "作者",
+    columnAlign: 'center',
+  },
+
+  {
+    prop: "browseCount",
+    label: "浏览量",
+    columnAlign: 'center',
+  },
+  {
+    prop: "status",
+    label: "状态",
+    columnAlign: 'center',
+    isStatus: true,
+    width: 100
+  },
+  {
+    prop: "date",
+    label: "出版/发布日期",
+    columnAlign: 'center',
+  },
+  // {
+  //   prop: "pdfFile",
+  //   label: "pdf文件",
+  //   columnAlign: 'center',
+  // },
+  {
+    prop: "source",
+    label: "文献来源",
+    columnAlign: 'center',
+  },
+  {
+    prop: "remark",
+    label: "备注",
+    columnAlign: 'center',
+    showOverFlowToolTip: true,
+  },
+
+]
+
+export const operates = {
+  operate: true,
+  label: "操作",
+  width: "360px",
+  minwidth: "220px",
+  titleAlign: "center",
+  columnAlign: "center",
+}
+
+export const operations = [{
+    type: 'view',
+    title: '预览'
+  },
+  {
+    type: 'download',
+    title: '下载'
+  },
+  {
+    type: 'edit',
+    title: '编辑'
+  },
+  {
+    type: 'delete',
+    title: '删除'
+  },
+
+]

src/views/role/index.vue

+<template>
+  <div class="app-container">
+    <div class="top-bar">
+      <SearchBar :config="searchConfig" @search="search" @reset="reset" />
+      <el-button
+        type="primary"
+        @click.native="handleOperation({ type: 'add' })"
+        icon="el-icon-s-promotion"
+      >
+        发布</el-button
+      >
+    </div>
+    <TablePage
+      :data="list.records"
+      :tableTitle="tableTitle"
+      :operates="tableOperates"
+    >
+      <template v-slot:status="data">
+        <el-popconfirm
+          :title="getStatusTitle(data.scope.status)"
+          @onConfirm="handleChangeStatus(data.scope)"
+        >
+          <el-switch
+            slot="reference"
+            :value="Boolean(Number(data.scope.status))"
+          ></el-switch>
+        </el-popconfirm>
+      </template>
+
+      <template v-slot:operates="scope">
+        <TableOperation
+          :operations="tableOperations"
+          :rawData="scope.scope.row"
+          @handleOperation="handleOperation"
+        ></TableOperation>
+      </template>
+    </TablePage>
+    <el-pagination
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :current-page="Number(list.current)"
+      :page-sizes="[10, 20, 40, 50]"
+      :page-size="Number(list.size)"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="Number(list.total)"
+      class="pagination"
+    >
+    </el-pagination>
+    <InfoEditDialog
+      :visible="drawerVisible"
+      :form="form"
+      @handleClose="handleClose"
+      @refresh="loadData"
+    />
+  </div>
+</template>
+
+<script>
+import TablePage from "@/components/Table/TablePage.vue";
+import TableOperation from "@/components/Table/TableOperation.vue";
+import { title, operates, operations } from "./config";
+import { getRoleList } from "@/api/roles";
+import InfoEditDialog from "./components/InfoEditDialog";
+import SearchBar from "@/components/SearchBar";
+import { downloadFile, previewFile, downloadBlob } from "@/utils/file";
+
+export default {
+  components: {
+    TablePage,
+    TableOperation,
+    InfoEditDialog,
+    SearchBar,
+  },
+  data() {
+    return {
+      list: {
+        records: [],
+        size: 10,
+        current: 1,
+        total: 0,
+      },
+      searchForm: {
+        name: "",
+        status: "",
+      },
+      searchConfig: [
+        {
+          prop: "name",
+          type: "input",
+          label: "文献名称",
+        },
+        {
+          prop: "authors",
+          type: "input",
+          label: "作者",
+        },
+        {
+          prop: "status",
+          type: "select",
+          label: "状态",
+          selectOptions: [
+            {
+              label: "已上架",
+              value: "1",
+            },
+            {
+              label: "已下架",
+              value: "0",
+            },
+          ],
+        },
+      ],
+      drawerVisible: false,
+      form: {
+        name: "", //名称
+        authors: "", //作者
+        date: "", //日期（出版年份、发布日期）
+        source: "", //文献来源
+        status: false, //上下架状态
+        remark: "", //备注
+      },
+    };
+  },
+
+  computed: {
+    tableTitle() {
+      return title;
+    },
+    tableOperates() {
+      return operates;
+    },
+    tableOperations() {
+      return operations;
+    },
+    getStatusTitle(status) {
+      return (status) => {
+        if (Number(status)) {
+          return "是否确定要下架？";
+        } else {
+          return "是否确定要上架？";
+        }
+      };
+    },
+  },
+  mounted() {
+    this.loadData();
+  },
+  methods: {
+    async search(form) {
+      var params = {
+        page: this.list.current,
+        limit: this.list.size,
+        ...form,
+      };
+      if (params.status == "") {
+        delete params.status;
+      }
+      const res = await getRoleList(params);
+      if (res.code == 0) {
+        this.list = res.data;
+      }
+    },
+
+    reset() {
+      this.loadData();
+    },
+
+    //   加载表格数据
+    async loadData() {
+      var params = {
+        page: this.list.current,
+        limit: this.list.size,
+      };
+      const res = await this.getRoleList(params);
+      if (res.code == 0) {
+        this.list = res.data;
+      }
+    },
+    async handleOperation(value, row) {
+      console.log("handleOperation", value, row);
+      switch (value.type) {
+        case "add":
+          this.drawerVisible = true;
+          break;
+        case "view":
+          if (row.files && row.files.length > 0 && row.files[0].url) {
+            previewFile(row.files[0].url, row.name);
+          } else {
+            this.$message.info("暂无文献附件！");
+          }
+          break;
+        case "download":
+          if (row.files && row.files.length > 0 && row.files[0].url) {
+            let url = '/files'+row.files[0].url.split('files')[1]
+            downloadBlob(url, row.name, "pdf");
+          } else {
+            this.$message.info("暂无文献！");
+          }
+          break;
+        case "edit":
+          this.form = row;
+          this.drawerVisible = true;
+          break;
+        case "delete":
+          let deleteRes = await deleteLt([row.literatureId]);
+          if (deleteRes.code == 0) {
+            this.$message.success("删除成功！");
+            this.loadData();
+          }
+          break;
+      }
+    },
+
+    async handleChangeStatus(row) {
+      console.log("status", row);
+      const { status } = row;
+      let newStatus = status === "0" ? "1" : "0";
+      const params = {
+        ...row,
+        status: newStatus,
+      };
+      let res = await editLiterature(params);
+      if (res.code == 0) {
+        this.loadData();
+        this.$message.success("修改成功！");
+      }
+    },
+
+    // 改变页容量
+    handleSizeChange(value) {
+      this.list.size = value;
+      this.loadData();
+    },
+
+    // 改变当前显示页
+    handleCurrentChange(value) {
+      this.list.current = value;
+      this.loadData();
+    },
+
+    // 关闭Dialog
+    handleClose() {
+      this.drawerVisible = false;
+      this.form = {
+        status: true,
+      };
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.top-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 10px;
+}
+.pagination {
+  margin: 16px;
+}
+.el-button{
+  margin-bottom: 22px;
+}
+::v-deep .el-card__header {
+  padding: 10px 20px;
+  font-weight: bold;
+}
+</style>
\ No newline at end of file

src/views/user/index.vue

+<!-- -->
+<template>
+    <div class=''>
+        用户管理
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+
+        };
+    },
+    mounted() {
+
+    },
+    methods: {
+
+    },
+};
+</script>
+
+<style lang="scss" scoped>
+
+</style>