Merge branch 'cy' of http://39.105.160.25:10880/post-project-ui/post-ui into cy

.env.development

@@ -4,6 +4,9 @@ VUE_APP_TITLE = 若依管理系统
 # 开发环境配置
 ENV = 'development'
 
+#若依管理系统/开发环境
+VUE APP_BASE API = http://39.105.160.25:10997
+
 # 若依管理系统/开发环境
 VUE_APP_BASE_API = '/dev-api'
 

Dockerfile

@@ -0,0 +1,5 @@
+FROM nginx
+EXPOSE 80
+RUN rm -v /etc/nginx/conf.d/default.conf
+ADD default.conf /etc/nginx/conf.d/
+COPY ./dist /usr/share/nginx/html

Jenkinsfile

@@ -0,0 +1,29 @@
+pipeline {
+    agent any
+    environment {
+        BRANCH_NAME="${env.BRANCH_NAME}".toLowerCase()
+    }
+    stages {
+        stage('Build') {
+            steps {
+                sh 'docker-compose down'
+                nodejs('16.19.0') {
+                    sh 'npm install --registry https://registry.npm.taobao.org'
+                    sh 'npm run build:prod'
+                }
+                sh 'docker build -t ${BRANCH_NAME}:${BUILD_NUMBER} .'
+            }
+        }
+        stage('Test') {
+            steps {
+                echo 'Testing..'
+            }
+        }
+        stage('Deploy') {
+            steps {
+                echo 'Deploying....'
+                sh 'docker-compose up -d'
+            }
+        }
+    }
+}

babel.config.js

@@ -1,7 +1,21 @@
 module.exports = {
-  presets: [
-    // https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app
-    '@vue/cli-plugin-babel/preset'
+  "presets": [
+    '@vue/cli-plugin-babel/preset',
+    [
+      "@babel/preset-env",
+      {
+        "useBuiltIns": "usage",
+        "corejs": 3
+      }
+    ]
+  ],
+  "plugins": [
+    ["component",
+      {
+        "libraryName": "element-ui",
+        "styleLibraryName": "theme-chalk"
+      }
+    ]
   ],
   'env': {
     'development': {
@@ -10,4 +24,5 @@ module.exports = {
       'plugins': ['dynamic-import-node']
     }
   }
-}
+}
+

default.conf

@@ -0,0 +1,15 @@
+server {
+    #blue
+    listen       80;
+    server_name  localhost;
+
+    location / {
+        root   /usr/share/nginx/html;
+        index  index.html index.htm;
+    }
+    
+    location /prod-api/ {           
+        proxy_pass http://blue-post-project-api-1:8080/;
+    }
+    
+}

docker-compose.yml

@@ -0,0 +1,10 @@
+services:
+  post-project-ui:
+    image: ${BRANCH_NAME}:${BUILD_NUMBER}
+    ports:
+      - 8682:80
+    networks:
+      - local_public
+networks:
+  local_public:
+    external: true

package.json

@@ -6,7 +6,7 @@
   "license": "MIT",
   "scripts": {
     "dev": "vue-cli-service serve",
-    "build:prod": "vue-cli-service build",
+    "build:prod": "  vue-cli-service build",
     "build:stage": "vue-cli-service build --mode staging",
     "preview": "node build/index.js --preview",
     "lint": "eslint --ext .js,.vue src"
@@ -37,9 +37,10 @@
   },
   "dependencies": {
     "@riophae/vue-treeselect": "0.4.0",
+    "async-validator": "^1.11.5",
     "axios": "0.24.0",
     "clipboard": "2.0.8",
-    "core-js": "3.25.3",
+    "core-js": "^3.27.2",
     "echarts": "5.4.0",
     "element-ui": "2.15.10",
     "file-saver": "2.0.5",
@@ -48,6 +49,9 @@
     "js-beautify": "1.13.0",
     "js-cookie": "3.0.1",
     "jsencrypt": "3.0.0-rc.1",
+    "less": "^4.1.3",
+    "mavon-editor": "^2.10.4",
+    "mockjs": "^1.1.0",
     "nprogress": "0.2.0",
     "quill": "1.3.7",
     "screenfull": "5.0.2",
@@ -61,11 +65,15 @@
     "vuex": "3.6.0"
   },
   "devDependencies": {
+    "@babel/plugin-transform-runtime": "^7.17.10",
+    "@babel/runtime-corejs3": "^7.17.9",
     "@vue/cli-plugin-babel": "4.4.6",
     "@vue/cli-plugin-eslint": "4.4.6",
     "@vue/cli-service": "4.4.6",
     "babel-eslint": "10.1.0",
+    "babel-plugin-component": "^1.1.1",
     "babel-plugin-dynamic-import-node": "2.3.3",
+    "babel-plugin-import": "^1.13.5",
     "chalk": "4.1.0",
     "compression-webpack-plugin": "5.0.2",
     "connect": "3.6.6",

src/api/message/message.js

@@ -0,0 +1,35 @@
+import request from '@/utils/request'
+
+// 查询消息列表
+export function getMessage(params) {
+  return request({
+    url: '/system/news/list',
+    params
+  })
+}
+
+// 按标题时间搜索消息
+export function searchMessage(params) {
+  console.log(params);
+  return request({
+    url: 'system/news/queryNews',
+    params
+  })
+}
+
+// 删除消息
+export function deleteMessage(id) {
+  return request({
+    url: 'system/news/remove/' + id,
+    method: 'delete',
+  })
+}
+
+// 新增消息
+export function addMessage(data) {
+  return request({
+    url: 'system/news/add',
+    method: 'post',
+    data
+  })
+}

src/api/mockServe/message.js

@@ -0,0 +1,86 @@
+import Mock from "mockjs";
+
+let List = [];
+const count = 200;
+const phonePrefix = ['155', '138', '166', '150', '188'];
+
+for (let i = 0; i < count; i++) {
+    let index = Math.floor(Math.random() * phonePrefix.length);
+    let phone = phonePrefix[index] + Mock.mock(/\d{8}/);
+    List.push(
+        Mock.mock({
+            id: Mock.Random.guid(),
+            "messageTitle": "@cword(4)",
+            phoneNumber: phone,
+            "publishTime": "@date('yy-MM-dd hh:mm:ss')",
+            content: "@cword(150)"
+        })
+    )
+}
+
+function paramObj(url) {
+    const search = url.split('?')[1];
+    if (!search) {
+        return {}
+    }
+    return JSON.parse(
+        '{"' +
+        decodeURIComponent(search)
+            .replace(/"/g, '\\"')
+            .replace(/&/g, '","')
+            .replace(/=/g, '":"') +
+        '"}'
+    )
+}
+
+export default {
+    getMessageList: config => {
+        const { name, page = 1, limit = 10 } = paramObj(config.url);
+        const mockList = List.filter(user => {
+            if (name && user.name.indexOf(name) === -1 && user.addr.indexOf(name) === -1) return false;
+            return true;
+        })
+        const pageList = mockList.filter((item, index) => index < limit * page && index >= limit * (page - 1));
+        return {
+            code: 200,
+            count: mockList.length,
+            list: pageList
+        }
+    },
+    searchMessageList: config => {
+        const { name } = paramObj(config.url);
+        const searchList = List.filter(user => {
+            return user.messageTitle === name;
+        })
+        return {
+            code: 200,
+            count: searchList.length,
+            list: searchList
+        }
+    },
+    detailMessage: config => {
+        const { id } = paramObj(config.url);
+        const detail = List.filter(user => {
+            return user.id === id;
+        })
+        return {
+            code: 200,
+            data: detail
+        }
+    },
+    deleteMessage: config => {
+        const { id } = JSON.parse(config.body);
+        if (!id) {
+            return {
+                code: -999,
+                message: '参数不正确'
+            }
+        } else {
+            List = List.filter(u => u.id !== id)
+            return {
+                code: 200,
+                message: '删除成功'
+            }
+        }
+    },
+}

src/api/mockServe/mock.js

@@ -0,0 +1,13 @@
+import Mock from 'mockjs';
+
+import NoticeApi from './notice';
+import MessageApi from './message';
+
+Mock.mock(/api\/notice\/getData/, 'get', NoticeApi.getNoticList);
+Mock.mock(/api\/notice\/searchData/, 'get', NoticeApi.searchNoticList);
+Mock.mock(/api\/notice\/detailNotic/, 'get', NoticeApi.detailNotic);
+
+Mock.mock(/api\/message\/getMessage/, 'get', MessageApi.getMessageList);
+Mock.mock(/api\/message\/searchData/, 'get', MessageApi.searchMessageList);
+Mock.mock(/api\/message\/del/, 'post', MessageApi.deleteMessage);
+Mock.mock(/api\/message\/detailMessage/, 'get', MessageApi.detailMessage);

src/api/mockServe/notice.js

@@ -0,0 +1,68 @@
+import Mock from "mockjs";
+
+let List = [];
+const count = 200;
+
+for (let i = 0; i < count; i++) {
+    List.push(
+        Mock.mock({
+            // "id|+1": 1,
+            id: Mock.Random.guid(),
+            "title": "@cword(5)",
+            "time": "@date('yy-MM-dd hh:mm:ss')",
+            content: "@cword(50)"
+        })
+    )
+}
+
+function paramObj(url) {
+    const search = url.split('?')[1];
+    if (!search) {
+        return {}
+    }
+    return JSON.parse(
+        '{"' +
+        decodeURIComponent(search)
+            .replace(/"/g, '\\"')
+            .replace(/&/g, '","')
+            .replace(/=/g, '":"') +
+        '"}'
+    )
+}
+
+export default {
+    getNoticList: config => {
+        const { name, page = 1, limit = 10 } = paramObj(config.url);
+        const mockList = List.filter(user => {
+            if (name && user.name.indexOf(name) === -1 && user.addr.indexOf(name) === -1) return false;
+            return true;
+        })
+        const pageList = mockList.filter((item, index) => index < limit * page && index >= limit * (page - 1));
+        return {
+            code: 200,
+            count: mockList.length,
+            list: pageList
+        }
+    },
+    searchNoticList: config => {
+        const { name } = paramObj(config.url);
+        const searchList = List.filter(user => {
+            return user.title === name;
+        })
+        return {
+            code: 200,
+            count: searchList.length,
+            list: searchList
+        }
+    },
+    detailNotic: config => {
+        const { id } = paramObj(config.url);
+        const detail = List.filter(user => {
+            return user.id === id;
+        })
+        return {
+            code: 200,
+            data: detail
+        }
+    }
+}

src/api/notice/notice.js

@@ -0,0 +1,29 @@
+import request from '@/utils/request'
+// 获取公告信息列表
+export function getNotice(params) {
+    return request({
+        url: '/system/poNotice/list',
+        params
+    })
+}
+// 添加公告信息
+export function addNotice(data) {
+    return request({
+        url: '/system/poNotice',
+        method: 'post',
+        data
+    })
+}
+// 获取公告详情
+export function detailNotice(id) {
+    return request({
+        url: '/system/poNotice/' + id,
+    })
+}
+// 删除公告信息
+export function deleteNotice(id) {
+    return request({
+        url: '/system/poNotice/' + id,
+        method: 'delete'
+    })
+}

src/assets/styles/index.scss

@@ -189,3 +189,10 @@ aside {
 .multiselect--active {
   z-index: 1000 !important;
 }
+
+.build{
+  border-radius: 4px;
+}
+.list{
+  border-radius: 4px;
+}

src/babel.config.json

@@ -0,0 +1,20 @@
+{
+    "presets": [
+      [
+        "@babel/preset-env",
+        {
+          "useBuiltIns": "usage",
+          "debug": false,
+          "corejs": 3
+        }
+      ]
+    ],
+    "plugins": [
+      [
+        "@babel/plugin-transform-runtime",
+        {
+          "corejs": 3
+        }
+      ]
+    ]
+  }

src/main.js

@@ -13,6 +13,9 @@ import router from './router'
 import directive from './directive' // directive
 import plugins from './plugins' // plugins
 import { download } from '@/utils/request'
+import mavonEditor from 'mavon-editor'
+import 'mavon-editor/dist/css/index.css'
+import './api/mockServe/mock'
 
 import './assets/icons' // icon
 import './permission' // permission control
@@ -37,6 +40,9 @@ import DictTag from '@/components/DictTag'
 import VueMeta from 'vue-meta'
 // 字典数据组件
 import DictData from '@/components/DictData'
+// 将中国标准时间转化为年月日时分秒
+import formatDate from '@/utils/formatDate'
+
 
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
@@ -48,6 +54,7 @@ Vue.prototype.selectDictLabel = selectDictLabel
 Vue.prototype.selectDictLabels = selectDictLabels
 Vue.prototype.download = download
 Vue.prototype.handleTree = handleTree
+Vue.prototype.$formatDate = formatDate
 
 // 全局组件挂载
 Vue.component('DictTag', DictTag)
@@ -61,6 +68,7 @@ Vue.component('ImagePreview', ImagePreview)
 Vue.use(directive)
 Vue.use(plugins)
 Vue.use(VueMeta)
+Vue.use(mavonEditor)
 DictData.install()
 
 /**

src/router/index.js

@@ -30,6 +30,7 @@ import Layout from '@/layout'
 
 // 公共路由
 export const constantRoutes = [
+
   {
     path: '/redirect',
     component: Layout,
@@ -87,7 +88,110 @@ export const constantRoutes = [
         meta: { title: '个人中心', icon: 'user' }
       }
     ]
+  },
+  {
+    path: "/noticeList",
+    component: Layout,
+    meta: { title: '公告管理', icon: 'dashboard' },
+    children: [
+      {
+        path: 'noticeList',
+        component: () => import('@/views/notice/noticeList'),
+        name: 'noticeList',
+        meta: { title: '公告列表', icon: 'user' }
+      },
+      {
+        path: 'addnotice',
+        component: () => import('@/views/notice/addNotice'),
+        name: 'addNotice',
+        meta: { title: '添加公告', icon: 'user' }
+      },
+      {
+        path: 'details/:id?',
+        hidden: true,
+        component: () => import('@/views/notice/details'),
+        name: 'details',
+        meta: { title: '公告详情', icon: 'user' }
+      }
+    ]
+  },
+  {
+    path: '/messageList',
+    component: Layout,
+    // redirect: '消息管理',
+    meta: { title: '消息管理', icon: "message" },
+    children: [
+      {
+        path: 'messageList',
+        component: () => import('@/views/message/messageList'),
+        name: 'messageList',
+        meta: { title: '消息列表', icon: 'list' }
+      },
+      {
+        path: 'addMessage',
+        component: () => import('@/views/message/addMessage'),
+        name: 'addMessage',
+        meta: { title: '创建消息', icon: 'build' }
+      },
+      {
+        path: 'messageDetails',
+        component: () => import('@/views/message/messageDetails'),
+        name: 'messageDetails',
+        meta: { title: '公告详情', icon: 'user' },
+        hidden: true
+      }
+      // messageDetails
+    ]
+  } ,
+  {
+    path: '/publisherList',
+    component: Layout,
+    // redirect: '发行方管理',
+    meta: { title: '发行方管理', icon : "log" },
+    children: [
+      {
+        path: 'messageList',
+        component: () => import('@/views/publishers/publisherList'),
+        name: 'publisherList',
+        meta: { title: '发行方列表', icon: 'textarea' }
+      },
+      {
+        path: 'addPublisher',
+        component: () => import('@/views/publishers/addPublisher'),
+        name: 'addPublisher',
+        meta: { title: '创建发行方', icon: 'build' }
+      },
+    ]
+  } ,
+ 
+  {
+    path: '/Sets',
+    component: Layout,
+    // redirect: '套系管理',
+    meta: { title: '藏品管理', icon: "slider" },
+    children: [
+      {
+        path: 'setList',
+        component: () => import('@/views/sets/setList'),
+        name: 'setList',
+        meta: { title: '套系列表', icon: 'nested' }
+      },
+      {
+        path: 'addSet',
+        component: () => import('@/views/sets/addSet'),
+        name: 'addSet',
+        meta: { title: '创建套系', icon: 'nested' }
+      },
+      {
+        path: 'collectionDetails',
+        component: () => import('@/views/sets/collectionDetails'),
+        name: 'collectionDetails',
+        meta: { title: '藏品详情', icon: 'list' },
+        hidden: true
+      }
+    ]
   }
+
 ]
 
 // 动态路由，基于用户权限动态去加载
@@ -106,6 +210,7 @@ export const dynamicRoutes = [
       }
     ]
   },
+
   {
     path: '/system/role-auth',
     component: Layout,
@@ -161,7 +266,8 @@ export const dynamicRoutes = [
         meta: { title: '修改生成配置', activeMenu: '/tool/gen' }
       }
     ]
-  }
+  },
+
 ]
 
 // 防止连续点击多次路由报错

src/utils/env.ts

@@ -0,0 +1,3 @@
+const debug = process.env.NODE_ENV !== 'production';
+
+export default debug;

src/utils/formatDate.js

@@ -0,0 +1,34 @@
+function padLeftZero(str) {
+    return ('00' + str).substr(str.length)
+}
+
+export function formatDate(date, fmt) {
+    if (!date) {
+        return ''
+    }
+    if (/(y+)/.test(fmt)) {
+        fmt = fmt.replace(
+            RegExp.$1,
+            (date.getFullYear() + '').substr(4 - RegExp.$1.length)
+        )
+    }
+    const o = {
+        'M+': date.getMonth() + 1,
+        'd+': date.getDate(),
+        'h+': date.getHours(),
+        'm+': date.getMinutes(),
+        's+': date.getSeconds()
+    }
+    for (const k in o) {
+        if (new RegExp(`(${k})`).test(fmt)) {
+            const str = o[k] + ''
+            fmt = fmt.replace(
+                RegExp.$1,
+                RegExp.$1.length === 1 ? str : padLeftZero(str)
+            )
+        }
+    }
+    return fmt
+}
+
+export default formatDate

src/utils/request.js

@@ -61,46 +61,46 @@ service.interceptors.request.use(config => {
   }
   return config
 }, error => {
-    console.log(error)
-    Promise.reject(error)
+  console.log(error)
+  Promise.reject(error)
 })
 
 // 响应拦截器
 service.interceptors.response.use(res => {
-    // 未设置状态码则默认成功状态
-    const code = res.data.code || 200;
-    // 获取错误信息
-    const msg = errorCode[code] || res.data.msg || errorCode['default']
-    // 二进制数据则直接返回
-    if(res.request.responseType ===  'blob' || res.request.responseType ===  'arraybuffer'){
-      return res.data
-    }
-    if (code === 401) {
-      if (!isRelogin.show) {
-        isRelogin.show = true;
-        MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
-          isRelogin.show = false;
-          store.dispatch('LogOut').then(() => {
-            location.href = '/index';
-          })
+  // 未设置状态码则默认成功状态
+  const code = res.data.code || 200;
+  // 获取错误信息
+  const msg = errorCode[code] || res.data.msg || errorCode['default']
+  // 二进制数据则直接返回
+  if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
+    return res.data
+  }
+  if (code === 401) {
+    if (!isRelogin.show) {
+      isRelogin.show = true;
+      MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
+        isRelogin.show = false;
+        store.dispatch('LogOut').then(() => {
+          location.href = '/index';
+        })
       }).catch(() => {
         isRelogin.show = false;
       });
     }
-      return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
-    } else if (code === 500) {
-      Message({ message: msg, type: 'error' })
-      return Promise.reject(new Error(msg))
-    } else if (code === 601) {
-      Message({ message: msg, type: 'warning' })
-      return Promise.reject('error')
-    } else if (code !== 200) {
-      Notification.error({ title: msg })
-      return Promise.reject('error')
-    } else {
-      return res.data
-    }
-  },
+    return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
+  } else if (code === 500) {
+    Message({ message: msg, type: 'error' })
+    return Promise.reject(new Error(msg))
+  } else if (code === 601) {
+    Message({ message: msg, type: 'warning' })
+    return Promise.reject('error')
+  } else if (code !== 200) {
+    Notification.error({ title: msg })
+    return Promise.reject('error')
+  } else {
+    return res.data
+  }
+},
   error => {
     console.log('err' + error)
     let { message } = error;

src/utils/requestFastMock.js

@@ -0,0 +1,146 @@
+import axios from 'axios'
+import { Notification, MessageBox, Message, Loading } from 'element-ui'
+import store from '@/store'
+import { getToken } from '@/utils/auth'
+import errorCode from '@/utils/errorCode'
+import { tansParams, blobValidate } from "@/utils/ruoyi";
+import cache from '@/plugins/cache'
+import { saveAs } from 'file-saver'
+
+let downloadLoadingInstance;
+// 是否显示重新登录
+export let isRelogin = { show: false };
+
+axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
+// 创建axios实例
+const service = axios.create({
+  // axios中请求配置有baseURL选项，表示请求URL公共部分
+  baseURL: process.env.VUE_APP_BASE_API_FAST_MOCK,
+  // 超时
+  timeout: 10000
+})
+
+// request拦截器
+service.interceptors.request.use(config => {
+  // 是否需要设置 token
+  const isToken = (config.headers || {}).isToken === false
+  // 是否需要防止数据重复提交
+  const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
+  if (getToken() && !isToken) {
+    config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
+  }
+  // get请求映射params参数
+  if (config.method === 'get' && config.params) {
+    let url = config.url + '?' + tansParams(config.params);
+    url = url.slice(0, -1);
+    config.params = {};
+    config.url = url;
+  }
+  if (!isRepeatSubmit && (config.method === 'post' || config.method === 'put')) {
+    const requestObj = {
+      url: config.url,
+      data: typeof config.data === 'object' ? JSON.stringify(config.data) : config.data,
+      time: new Date().getTime()
+    }
+    const sessionObj = cache.session.getJSON('sessionObj')
+    if (sessionObj === undefined || sessionObj === null || sessionObj === '') {
+      cache.session.setJSON('sessionObj', requestObj)
+    } else {
+      const s_url = sessionObj.url;                  // 请求地址
+      const s_data = sessionObj.data;                // 请求数据
+      const s_time = sessionObj.time;                // 请求时间
+      const interval = 1000;                         // 间隔时间(ms)，小于此时间视为重复提交
+      if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) {
+        const message = '数据正在处理，请勿重复提交';
+        console.warn(`[${s_url}]: ` + message)
+        return Promise.reject(new Error(message))
+      } else {
+        cache.session.setJSON('sessionObj', requestObj)
+      }
+    }
+  }
+  return config
+}, error => {
+    console.log(error)
+    Promise.reject(error)
+})
+
+// 响应拦截器
+service.interceptors.response.use(res => {
+    // 未设置状态码则默认成功状态
+    const code = res.data.code || 200;
+    // 获取错误信息
+    const msg = errorCode[code] || res.data.msg || errorCode['default']
+    // 二进制数据则直接返回
+    if(res.request.responseType ===  'blob' || res.request.responseType ===  'arraybuffer'){
+      return res.data
+    }
+    if (code === 401) {
+      if (!isRelogin.show) {
+        isRelogin.show = true;
+        MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
+          isRelogin.show = false;
+          store.dispatch('LogOut').then(() => {
+            location.href = '/index';
+          })
+      }).catch(() => {
+        isRelogin.show = false;
+      });
+    }
+      return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
+    } else if (code === 500) {
+      Message({ message: msg, type: 'error' })
+      return Promise.reject(new Error(msg))
+    } else if (code === 601) {
+      Message({ message: msg, type: 'warning' })
+      return Promise.reject('error')
+    } else if (code !== 200) {
+      Notification.error({ title: msg })
+      return Promise.reject('error')
+    } else {
+      return res.data
+    }
+  },
+  error => {
+    console.log('err' + error)
+    let { message } = error;
+    if (message == "Network Error") {
+      message = "后端接口连接异常";
+    } else if (message.includes("timeout")) {
+      message = "系统接口请求超时";
+    } else if (message.includes("Request failed with status code")) {
+      message = "系统接口" + message.substr(message.length - 3) + "异常";
+    }
+    Message({ message: message, type: 'error', duration: 5 * 1000 })
+    return Promise.reject(error)
+  }
+)
+
+// 通用下载方法
+export function download(url, params, filename, config) {
+  downloadLoadingInstance = Loading.service({ text: "正在下载数据，请稍候", spinner: "el-icon-loading", background: "rgba(0, 0, 0, 0.7)", })
+  return service.post(url, params, {
+    transformRequest: [(params) => { return tansParams(params) }],
+    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+    responseType: 'blob',
+    ...config
+  }).then(async (data) => {
+    const isLogin = await blobValidate(data);
+    if (isLogin) {
+      const blob = new Blob([data])
+      saveAs(blob, filename)
+    } else {
+      const resText = await data.text();
+      const rspObj = JSON.parse(resText);
+      const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
+      Message.error(errMsg);
+    }
+    downloadLoadingInstance.close();
+  }).catch((r) => {
+    console.error(r)
+    Message.error('下载文件出现错误，请联系管理员！')
+    downloadLoadingInstance.close();
+  })
+}
+
+export default service

src/views/message/addMessage.vue

@@ -0,0 +1,130 @@
+<template>
+  <div class="message-add">
+    <div class="message-add-box">
+      <el-form :model="message" :rules="rules" ref="form" label-width="100px">
+        <el-form-item label="消息标题:" prop="title">
+          <el-input v-model="message.title" placeholder="请输入消息标题"></el-input>
+        </el-form-item>
+        <el-form-item label="发布时间: " required>
+          <el-date-picker v-model="message.newsDate" type="date" placeholder="选择日期">
+          </el-date-picker>
+          <el-time-picker placeholder="选择时间" v-model="message.newsTime"></el-time-picker>
+        </el-form-item>
+        <el-form-item label="消息内容:" prop="content">
+          <editor v-model="message.content"></editor>
+        </el-form-item>
+      </el-form>
+      <el-form style="margin-left: 100px;">
+        <el-button type="primary" @click="submit">创建</el-button>
+        <el-button @click="reset">重置</el-button>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<script>
+import { addMessage } from '../../api/message/message'
+export default {
+  data() {
+    return {
+      message: {
+        title: '',
+        content: '',
+        newsDate: '',
+        newsTime: ''
+      },
+      rules: {
+        title: [
+          { required: true, message: '请输入消息标题', trigger: 'blur' }
+        ],
+        content: [
+          { required: true, message: '请输入消息内容', trigger: 'blur' }
+        ]
+      },
+      content: ''
+    }
+  },
+  methods: {
+    submit() {
+      if (this.message.title && this.message.content) {
+        let nyr = this.$formatDate(this.message.newsDate, 'yyyy-MM-dd');
+        let sfm = this.$formatDate(this.message.newsTime, 'hh:mm:ss');
+        let news = {
+          newsTitle: this.message.title,
+          newsContent: this.message.content,
+          newsTime: nyr + ' ' + sfm
+        }
+        console.log(news.newsTime);
+        addMessage(news).then((res) => {
+          this.message.title = '';
+          this.message.content = '';
+          this.message.newsDate = '';
+          this.message.newsTime = '';
+        })
+        this.$notify({
+          title: '成功',
+          message: '创建消息成功',
+          type: 'success'
+        });
+        this.$router.push("./messageList");
+      } else {
+        this.$notify({
+          title: '警告',
+          message: '请填写内容',
+          type: 'warning'
+        });
+      }
+    },
+    reset() {
+      this.message.title = '';
+      this.message.content = '';
+      this.message.newsDate = '';
+      this.message.newsTime = '';
+    }
+  }
+}
+</script>
+
+<style>
+.message-add {
+  width: 700px;
+  height: 100%;
+  position: absolute;
+  top: 30px;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  margin: auto;
+  border: 1px solid #ccc;
+}
+
+.message-add-box {
+  padding: 40px;
+}
+
+/* .users-input-box{
+  color:aqua;
+} */
+
+.quill-editor /deep/ .ql-container {
+  min-height: 220px;
+}
+
+.ql-container {
+  min-height: 230px;
+}
+
+.ql-toolbar.ql-snow {
+  border: 1px solid #ccc;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
+  padding: 8px;
+  width: 450px;
+}
+
+.ql-toolbar.ql-snow+.ql-container.ql-snow {
+  border-top: 0px;
+  width: 450px;
+}
+</style>

src/views/message/messageDetails.vue

@@ -0,0 +1,84 @@
+<template>
+  <div class="app">
+    <el-button id="returnBtn" @click="returnBtn">返回</el-button>
+    <div class="noticeDetails">
+      <div class="title">消息详情</div>
+      <h3 id="noticeTitle"></h3>
+      <h4 id="noticeTime"></h4>
+      <div id="noticeContent"></div>
+    </div>
+  </div>
+</template>
+
+
+
+<style scoped>
+#returnBtn{
+    margin-top: 10px;
+    margin-left: 10px;
+}
+.noticeDetails {
+  width: 800px;
+  height: 300px;
+  /* background: red; */
+  margin: 50px auto;
+  border: 1px solid #ebeef5;
+}
+.title {
+  font-size: 30px;
+  font-family: PingFang SC;
+  color: #333333;
+  text-align: center;
+  font-weight: bolder;
+  margin-top: 10px;
+}
+#noticeTitle {
+  /* font-size: 18px; */
+  font-family: PingFang SC;
+  color: #333333;
+  margin-left: 30px;
+  margin-top: 20px;
+  font-weight: bolder;
+}
+#noticeTime {
+  font-family: PingFang SC;
+  margin-left: 30px;
+  color: #333333;
+}
+#noticeContent {
+  font-family: PingFang SC;
+  color: #333333;
+  width: 700px;
+  /* background: red; */
+  margin: 0 auto;
+  text-indent: 2em;
+}
+</style>
+
+
+<script>
+export default {
+  data() {
+    return {
+      noticeTitle: "",
+      noticeTime: "",
+      noticeContent: ""
+    };
+  },
+  mounted() {
+    //获取到当前公告的标题和时间
+    this.noticeTitle = document.querySelector("#noticeTitle");
+    this.noticeTime = document.querySelector("#noticeTime");
+    this.noticeContent = document.querySelector("#noticeContent");
+    noticeTitle.innerHTML = this.$route.query.title;
+    noticeTime.innerHTML = this.$route.query.publishTime;
+    noticeContent.innerHTML = this.$route.query.content;
+  },
+  methods:{
+    //返回上一页
+    returnBtn(){
+        this.$router.go(-1)
+    }
+  }
+};
+</script>

src/views/message/messageList.vue

@@ -0,0 +1,298 @@
+<template>
+  <div class="right">
+    <div class="up">
+      <div>
+        <div class="up-title"><i class="el-icon-search"></i>筛选搜索</div>
+        <div class="btn">
+          <el-button plain @click="empty">重置</el-button>
+          <el-button type="primary" plain @click="check">查询列表</el-button>
+        </div>
+      </div>
+      <div class="left-up">
+        <div class="up-input-title">
+          消息标题:<el-input v-model="input.value1" class="up-input" placeholder="请输入内容"></el-input>
+        </div>
+        <div class="up-input-title-right">
+          <span class="demonstration">发布时间:</span>
+          <el-date-picker v-model="input.value2" type="datetimerange" class="up-input-right" range-separator="至"
+            start-placeholder="开始日期" end-placeholder="结束日期" align="right">
+          </el-date-picker>
+        </div>
+      </div>
+    </div>
+    <div class="down">
+      <div class="down-add">
+        <el-row :gutter="24">
+          <el-col :span="22" class="down-title"> <i class="el-icon-tickets">消息列表</i> </el-col>
+          <el-col :span="2"> <el-button id="addBtn" size="small" @click="addNoticce">添加</el-button> </el-col>
+        </el-row>
+      </div>
+      <div class="down-table">
+        <el-table height="300" :data="tableData" order style="width: 100%" class="messagetable">
+          <el-table-column prop="newsId" label="ID" align="center">
+          </el-table-column>
+          <el-table-column :formatter="stateFormat" prop="newsTitle" label="消息标题" align="center">
+          </el-table-column>
+          <el-table-column prop="newsTime" label="发布时间" align="center">
+          </el-table-column>
+          <el-table-column prop="operate" label="操作" align="center">
+            <template slot-scope="scope">
+              <el-button size="mini" type="text" @click="viewDetails(scope.row)">查看详情</el-button>
+              <el-popconfirm title="你确定删除本条消息吗？" @confirm="deleteM(scope.row)">
+                <el-button class="btn-delete" size="mini" type="text" icon="el-icon-delete"
+                  slot="reference">删除</el-button>
+              </el-popconfirm>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <el-pagination @current-change="handleCurrentChange" background layout="total, prev, pager, next" :total="total"
+      id="page">
+    </el-pagination>
+  </div>
+</template>
+<script>
+import { getMessage, searchMessage, deleteMessage } from '../../api/message/message'
+export default {
+  data() {
+    return {
+      tableData: [],  // 数据内容
+      total: 1, // 数据个数
+      input: {
+        value1: '', // 搜索姓名
+        value2: ''  // 搜索时间
+      },
+      pageInfo: { // 分页信息
+        pageNum: 1,
+        pageSize: 10
+      }
+    }
+  },
+  mounted() {
+    this.getMessageList();
+  },
+  methods: {
+    // 获取消息列表
+    getMessageList() {
+      getMessage(this.pageInfo).then((res) => {
+        this.tableData = res.rows;
+        this.total = res.total;
+      })
+    },
+    // 分页跳转
+    handleCurrentChange(newPage) {
+      this.pageInfo.pageNum = newPage;
+      this.getMessageList();
+    },
+    // 搜索消息
+    check() {
+      if (this.input.value1 || this.input.value2) {
+        let startTime = this.$formatDate(this.input.value2[0], 'yyyy-MM-dd hh:mm:ss');
+        let endTime = this.$formatDate(this.input.value2[1], 'yyyy-MM-dd hh:mm:ss');
+        let searchCon = {
+          newsTitle: this.input.value1,
+          newsTimeStart: startTime,
+          newsTimeEnd: endTime
+        }
+        searchMessage(searchCon).then((res) => {
+          this.tableData = res.rows;
+          this.total = res.total;
+        })
+      } else {
+        this.getMessageList();
+      }
+    },
+    // 重置搜索
+    empty() {
+      this.input.value1 = "";
+      this.input.value2 = "";
+      this.getMessageList();
+    },
+    //  删除列表
+    deleteM(row) {
+      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        deleteMessage(row.newsId).then(() => {
+          this.getMessageList();
+        })
+        this.$message({
+          type: 'success',
+          message: '删除成功!'
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    },
+    // 查看详情
+    viewDetails(row) {
+      this.$router.push({
+        name: "messageDetails",
+        query: {
+          publishTime: row.newsTime,
+          title: row.newsTitle,
+          content: row.newsContent
+        }
+      });
+    },
+    // 添加跳转
+    addNoticce() {
+      this.$router.push("/messageList/addMessage");
+    },
+    // 标题省略
+    stateFormat(row, column, cellValue) {
+      if (!cellValue) return ''
+      if (cellValue.length > 15) {       //最长固定显示10个字符
+        return cellValue.slice(0, 15) + '...'
+      }
+      return cellValue
+    },
+  }
+}
+</script>
+
+<style scoped>
+.up {
+  width: 96%;
+  height: 170px;
+  margin-top: 20px;
+  margin-left: 2%;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+
+}
+
+.up-title {
+  font-size: 20px;
+  width: 20%;
+  margin-left: 20px;
+  margin-top: 20px;
+  float: left;
+}
+
+.btn {
+  float: right;
+  padding-right: 3%;
+  margin-top: 2.5%;
+}
+
+.up-input {
+  width: 250px;
+  margin-left: 15px;
+}
+
+.up-input-title {
+
+  margin-left: 40px;
+
+  float: left;
+}
+
+.up-input-right {
+  margin-left: 15px;
+  width: 500px;
+}
+
+.up-input-title-right {
+  width: 800px;
+  margin-left: 450px;
+
+
+}
+
+.left-up {
+  width: 80%;
+  float: left;
+  height: 37px;
+  margin-top: 50px;
+}
+
+.right-up {
+  width: 16%;
+  margin-top: 2%;
+  float: right;
+
+}
+
+.anniu {
+  padding-right: 5%;
+}
+
+.down {
+  margin-top: 40px;
+}
+
+.down-add {
+  padding: 10px;
+  margin: 0 27px;
+  border: 1px solid #ccc;
+  border-radius: 2px
+}
+
+.down-title {
+  padding-top: 10px;
+  color: #303133;
+}
+
+.down-table {
+  margin-top: 15px;
+  text-align: center;
+  margin: 35px 27px;
+}
+
+.el-table .el-table__header-wrapper th,
+.el-table .el-table__fixed-header-wrapper th {
+  word-break: break-word;
+  /* background-color: #f8f8f9; */
+  color: #515a6e;
+  height: 40px;
+  font-size: 13px;
+  text-align: center;
+}
+
+.bottom-number {
+  padding-top: 5px;
+  color: #303133;
+  float: right;
+}
+
+.bottom-page {
+  float: right;
+}
+
+.el-icon-search {
+  padding-right: 10px;
+}
+
+.btn-delete {
+  margin-left: 20px;
+}
+
+/**
+自适应
+*/
+/* .demonstration{
+  width: 50%;
+} */
+.right {
+  float: none;
+  width: 100%;
+  height: 100%;
+  /* background-color: #9dc3e6; */
+}
+
+.bottom {
+  float: right;
+}
+
+#page {
+  float: right;
+  margin-right: 20px;
+}
+</style>

src/views/notice/addNotice.vue

@@ -0,0 +1,129 @@
+<template>
+  <div>
+    <div class="body">
+      <div class="s-body">
+        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
+          <el-form-item label="公告名称: " prop="name">
+            <el-input v-model="ruleForm.name"></el-input>
+          </el-form-item>
+          <el-form-item label="发布时间: " required>
+            <el-date-picker v-model="ruleForm.date" type="date" placeholder="选择日期">
+            </el-date-picker>
+            <el-time-picker placeholder="选择时间" v-model="ruleForm.time"></el-time-picker>
+          </el-form-item>
+          <el-form-item label="公告内容:  " prop="name">
+            <mavon-editor ref="md" v-model="notice.noticeContent" style="height: calc(100vh - 400px)" />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="danger" @click="confirmGG" style="float: right">发布公告</el-button>
+          </el-form-item>
+        </el-form>
+        <el-dialog title="提示" :visible.sync="dialogVisible" width="20%" :before-close="handleClose">
+          <span>确认发布公告吗？</span>
+          <span slot="footer" class="dialog-footer">
+            <el-button @click="cancel">取 消</el-button>
+            <el-button type="primary" @click="submitForm">确 定</el-button>
+          </span>
+        </el-dialog>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { addNotice } from '../../api/notice/notice'
+export default {
+  name: "Addnotice",
+  data() {
+    return {
+      ruleForm: {
+        name: '',
+        date: '',
+        time: '',
+      },
+      notice: {
+        noticeContent: "",
+      },
+      rules: {
+        name: [
+          { required: true, message: '请输入公告名称', trigger: 'blur' },
+        ],
+        date: [
+          { required: true, type: 'date', message: '请选择日期', trigger: 'change' }
+        ],
+        time: [
+          { required: true, type: 'date', message: '请选择时间', trigger: 'change' }
+        ]
+      },
+      dialogVisible: false,
+    };
+  },
+
+  methods: {
+    submitForm() {
+      this.$refs.ruleForm.validate((valid) => {
+        if (valid) {
+          let nyr = this.$formatDate(this.ruleForm.date, 'yyyy-MM-dd');
+          let sfm = this.$formatDate(this.ruleForm.time, 'hh:mm:ss');
+          let notice = {
+            noticeTitle: this.ruleForm.name,
+            noticeContent: this.notice.noticeContent,
+            createTime: nyr + ' ' + sfm
+          }
+          addNotice(notice).then(() => {
+            this.ruleForm.name = '';
+            this.ruleForm.date = '';
+            this.ruleForm.time = '';
+            this.notice.noticeContent = '';
+          })
+          this.$notify({
+            title: '成功',
+            message: '创建消息成功',
+            type: 'success'
+          });
+          this.$router.push("./noticeList");
+        } else {
+          this.$notify({
+            title: '警告',
+            message: '请填写内容',
+            type: 'warning'
+          });
+        }
+      });
+      this.dialogVisible = false
+    },
+    cancel() {
+      this.dialogVisible = false
+    },
+    confirmGG() {
+      this.dialogVisible = true
+    },
+    resetForm(formName) {
+      this.$refs[formName].resetFields();
+    },
+    handleClose(done) {
+      this.$confirm("确认关闭？")
+        .then((_) => {
+          done();
+        })
+        .catch((_) => { });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.body {
+  margin: auto;
+  width: 80%;
+  border: solid 2px rgb(239, 231, 231);
+  margin-top: 16px;
+  border-radius: 10px;
+}
+
+.s-body {
+  margin: 0 auto;
+  width: 70%;
+  padding-top: 40px;
+}
+</style>

src/views/notice/details.vue

@@ -0,0 +1,66 @@
+<template>
+    <div class="body">
+        <div class="container">
+            <h2 class="details">公告详情</h2>
+            <h3 class="title">{{ notical.title }}</h3>
+            <div class="date">{{ notical.time }}</div>
+            <p class="content">{{ notical.content }}</p>
+        </div>
+    </div>
+</template>
+
+<script>
+import { detailNotice } from "@/api/notice/notice"
+export default {
+    data() {
+        return {
+            notical: {
+                id: '',
+                title: '',
+                time: '',
+                content: ''
+            }
+        }
+    },
+    created() {
+        let con = {
+            poNoticeId: this.$route.params.id
+        }
+        detailNotice(con.poNoticeId).then((data) => {
+            this.notical = {
+                id: data.data.noticeId,
+                title: data.data.noticeTime,
+                content: data.data.noticeContent,
+                time: data.data.createTime
+            }
+        })
+    }
+}
+</script>
+
+
+<style scoped>
+.container {
+    width: 500px;
+    min-height: 360px;
+    border: 1px solid #ccc;
+    border-radius: 20px;
+    padding: 20px 40px;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -80%);
+}
+
+.details {
+    text-align: center;
+}
+
+.date {
+    font-weight: 200;
+}
+
+.content {
+    text-indent: 2em;
+}
+</style>

src/views/notice/noticeList.vue

@@ -0,0 +1,196 @@
+<template>
+  <div>
+    <el-container>
+      <el-header style="height: 120px;">
+        <div id="header-one">
+          <h3 class="el-icon-search" style="margin-left: 10px;">筛选搜索</h3>
+          <div id="header-one-btu">
+            <el-button @click="empty">重置</el-button>
+            <el-button type="primary">搜索</el-button>
+          </div>
+        </div>
+        <div id="header-two">
+          <el-row>
+            <el-col :span="4" id="header-two-left">
+              <el-form ref="anFormRef" :model="anForm" label-width="80px">
+                <el-form-item label="公告标题 :">
+                  <el-input v-model="anForm.anName" class="anInput" placeholder="筛选公告标题" center></el-input>
+                </el-form-item>
+              </el-form>
+            </el-col>
+            <el-col :span="8">
+              <el-form label-width="80px">
+                <el-form-item label="发布时间:">
+                  <el-date-picker v-model="dataput" type="datetimerange" class="up-input-right" range-separator="至"
+                    start-placeholder="开始日期" end-placeholder="结束日期" align="right">
+                  </el-date-picker>
+                </el-form-item>
+              </el-form>
+            </el-col>
+          </el-row>
+        </div>
+      </el-header>
+      <el-main style="height: 100px;">
+        <h3 class="el-icon-tickets">公告列表</h3>
+        <el-button id="main-btu" @click="addNotice">添加</el-button>
+      </el-main>
+      <div>
+        <el-table height="310" :data="tableData" border style="width: 96%" id="footer-t">
+          <el-table-column type="index" label="ID" width="400" align="center">
+          </el-table-column>
+          <el-table-column prop="noticeTitle" label="公告标题" align="center">
+          </el-table-column>
+          <el-table-column prop="createTime" label="发布时间" align="center">
+          </el-table-column>
+          <el-table-column prop="address" label="操作" align="center">
+            <template slot-scope="scope">
+              <el-button type="primary" @click="details(scope.row)">查看详情</el-button>
+              <el-button type="danger" @click="deleteNoticeById(scope.row)">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-pagination @current-change="handleCurrentChange" background layout="total, prev, pager, next" :total="total"
+          id="page">
+        </el-pagination>
+      </div>
+    </el-container>
+  </div>
+</template>
+<script>
+import { getNotice, deleteNotice } from "@/api/notice/notice"
+export default {
+  data() {
+    return {
+      anForm: {
+        anName: '',
+      },
+      dataput: '',
+      tableData: [],  // 具体数据
+      total: 1,   // 数据个数
+      pageInfo: { // 分页信息
+        pageNum: 1,
+        pageSize: 10
+      },
+    }
+  },
+  created() {
+    this.getnotice()
+  },
+  methods: {
+    // 添加跳转
+    addNotice() {
+      this.$router.push('./addnotice')
+    },
+    // 获取公告
+    getnotice() {
+      getNotice(this.pageInfo).then((data) => {
+        this.tableData = data.rows;
+        this.total = data.total;
+      })
+    },
+    // 查看详情
+    details(val) {
+      this.$router.push('./details/' + val.noticeId)
+    },
+    // 分页信息
+    handleCurrentChange(newPage) {
+      this.pageInfo.pageNum = newPage;
+      this.getnotice();
+    },
+    // 重置按钮
+    empty() {
+      this.anForm.anName = "";
+      this.dataput = "";
+      this.getnotice();
+    },
+    // 删除操作 // 存在问题************************************************************
+    deleteNoticeById(id) {
+      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        let poNoticeIds = id.noticeId
+        deleteNotice(poNoticeIds).then(() => {
+          this.$message({
+            type: 'success',
+            message: '删除成功!'
+          });
+          this.getnotice();
+        }).catch(err => {
+          // 存在问题************************************************************
+          console.log(err);
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    }
+
+    /**搜索按钮 */  // 没找到具体接口
+    // check() {
+    //   if (this.anForm.anName) {
+    //     let con = {
+    //       name: this.anForm.anName
+    //     }
+    //     searchNotice(con).then((data) => {
+    //       this.tableData = data.list;
+    //       this.total = data.count;
+    //     })
+    //   } else {
+    //     this.getnotice();
+    //   }
+    // },
+  }
+};
+
+</script>
+<style scoped>
+.el-main {
+  color: #333;
+  border: 1px solid #d3d7d4;
+  border-radius: 5px;
+  margin-left: 30px;
+  margin-right: 30px;
+}
+
+.el-header {
+  color: #333;
+  border: 1px solid #d3d7d4;
+  border-radius: 5px;
+  margin: 30px;
+}
+
+#footer-t {
+  color: #333;
+  border: 1px solid #d3d7d4;
+  border-radius: 5px;
+  margin: 30px auto;
+
+}
+
+#header-two {
+  margin-left: 55px;
+}
+
+#header-one-btu {
+  margin: 20px 20px 0px 0px;
+  float: right;
+}
+
+#header-two-left {
+  margin-right: 100px;
+}
+
+#main-btu {
+  float: right;
+  margin-top: 10px;
+}
+
+#page {
+  float: right;
+  margin-right: 20px;
+}
+</style>

src/views/publishers/addPublisher.vue

@@ -0,0 +1,107 @@
+<template>
+  <div>
+    <div class="addfrom">
+      <div class="addcenter">
+        <el-form
+          ref="form"
+          label-width="100px"
+          :style="{ border: '1px soild #ccc' }"
+          :model="publishForm"
+          :rules="rules"
+        >
+          <el-form-item label="发行方名称" prop="pname">
+            <el-input></el-input>
+          </el-form-item>
+
+          <el-form-item label="联系人" prop="aname">
+            <el-input></el-input>
+          </el-form-item>
+
+          <el-form-item label="联系电话" prop="tel">
+            <el-input></el-input>
+          </el-form-item>
+
+          <el-form-item label="电子邮箱" prop="email">
+            <el-input></el-input>
+          </el-form-item>
+
+          <el-form-item label="详细地址" prop="address">
+            <el-input></el-input>
+          </el-form-item>
+
+          <el-form-item label="上传头像" prop="avater">
+            <el-upload
+              :show-file-list="false"
+              :style="{
+                border: '1px dashed #d9d9d9',
+                borderRadius: '6px',
+                width: '178px',
+                height: '178px',
+              }"
+            >
+              <img v-if="imageUrl" :src="imageUrl" id="avatar" />
+              <i
+                v-else
+                class="el-icon-plus avatar-uploader-icon"
+                :style="{
+                  width: '178px',
+                  height: '178px',
+                  lineHeight: '178px',
+                  textAlign: 'center',
+                }"
+              ></i>
+            </el-upload>
+          </el-form-item>
+
+          <el-form-item label="备注" prop="info">
+            <el-input type="textarea" :rows="4"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary">提交</el-button>
+            <el-button>重置</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "addPublisher",
+  data() {
+    return {
+      publishForm: {
+        pname: "",
+        aname: "",
+        tel: "",
+        email: "",
+        address: "",
+        avater: "",
+        info: "",
+      },
+
+      rules: {
+        pname: [
+          { required: true, message: "请输入发行方名称", trigger: "blur" },
+        ],
+      },
+    };
+  },
+};
+</script>
+
+<style>
+.addfrom {
+  margin: auto;
+  width: 70%;
+  border: solid 2px #fcf6f6;
+  margin-top: 40px;
+  border-radius: 4px;
+}
+.addcenter {
+  margin: auto;
+  width: 60%;
+  margin-top: 40px;
+}
+</style>

src/views/publishers/publisherList.vue

@@ -0,0 +1,97 @@
+<template>
+  <div>
+    <div class="search">
+      <el-row :style="{ padding: '12px' }">
+        <el-col :span="12">
+          <i class="el-icon-search"></i>
+          <span :style="{ padding: '4px' }">筛选搜索</span>
+        </el-col>
+        <el-col :span="12" :style="{ textAlign: 'right' }">
+          <el-button>重置</el-button>
+          <el-button type="primary">查询搜索</el-button>
+        </el-col>
+      </el-row>
+      <el-row :style="{ marginLeft: '32px' }">
+        <el-form inline>
+          <el-form-item label="发行方名称: ">
+            <el-input placeholder="筛选发行方名称" clearable></el-input>
+          </el-form-item>
+        </el-form>
+      </el-row>
+    </div>
+    <div class="addpub">
+      <el-row :style="{ padding: '16px' }">
+        <el-col :span="12">
+          <i class="el-icon-tickets"></i>
+          <span :style="{ marginLeft: '4px' }">发行方列表</span>
+        </el-col>
+
+        <el-col :span="12" :style="{ textAlign: 'right' }">
+          <el-button plain>添加</el-button>
+        </el-col>
+      </el-row>
+    </div>
+    <div class="pubform">
+      <el-table :data="tabletab"
+        stripe
+        border
+        :style="{ borderRadius: '4px' }"
+        :header-cell-style="{ 'text-align': 'center' }"
+        :cell-style="{'text-align':'center'}"
+      >
+        <el-table-column prop="pid" label="ID"> </el-table-column>
+        <el-table-column prop="avater" label="头像"> </el-table-column>
+        <el-table-column prop="pname" label="发行方名称"> </el-table-column>
+        <el-table-column prop="opreation" label="操作">
+      
+            <el-button type="text">修改</el-button>
+         <el-button type="text">删除</el-button>
+         
+       </el-table-column>
+      </el-table>
+      <el-row :style="{ marginTop: '16px' }">
+      <el-col :span="24" :style="{ textAlign: 'right' }">
+        <el-pagination
+         background
+          :page-size="10"
+          layout="total, prev, pager, next"
+          :total="100"
+        >
+        </el-pagination>
+      </el-col>
+    </el-row>
+    </div>
+    
+  </div>
+</template>
+<script>
+export default {
+   name:"publisherList",
+   data(){
+      return {
+         tabletab:[
+            {
+               pid:'1',
+               pname:'哈尔滨某公司',
+               
+            }
+         ]
+      }
+   }
+}
+</script>
+<style>
+.search {
+  border: 1px solid #ccc;
+  border-radius: 4px;
+  margin: 16px;
+}
+.addpub {
+  border: 1px solid #ccc;
+  border-radius: 4px;
+  margin: 16px;
+}
+.pubform {
+  padding: 0 16px;
+}
+</style>

src/views/sets/addSet.vue

@@ -0,0 +1,166 @@
+<template>
+    <div class="collection-add">
+
+        <!-- <el-page-header @back="goBack" content="创建消息"></el-page-header> -->
+        <div class="collection-add-box">
+            <el-form :model="collection" :rules="rules" ref="form" label-width="100px">
+                <el-form-item label="藏品名称(套):" prop="collectionTitle" label-width="120px">
+                    <el-input v-model="collection.collectionTitle" maxlength="20" show-word-limit></el-input>
+                </el-form-item>
+                <el-form-item label="藏品头图:" prop="collectionImg" label-width="120px">
+                    <el-upload class="avatar-uploader" action="https://jsonplaceholder.typicode.com/posts/"
+                        :show-file-list="true" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
+                        <img v-if="collection.imageUrl" :src="collection.imageUrl" class="avatar">
+                        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                    </el-upload>
+                    <span style="color: red;">请按照规范上传尺寸为750px * 750px的照片</span>
+                </el-form-item>
+                <el-form-item label="设置套系时间:" prop="collectionTime" label-width="120px">
+                    <el-date-picker v-model="collection.dataput" type="datetimerange" class="up-input-right"
+                        range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" align="right">
+                    </el-date-picker>
+                </el-form-item>
+                <el-form-item label="线下礼品兑换:" prop="giftRedemption" label-width="120px">
+                    <el-radio-group v-model="collection.resource">
+                        <el-radio label="可兑换"></el-radio>
+                        <el-radio label="不可兑换"></el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label-width="120px">
+                    <el-button type="primary" @click="subSet()">提交</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+    </div>
+</template>
+
+<script>
+
+export default {
+    data() {
+        return {
+            collection: {
+                collectionTitle: '',
+                collectionTime: '',
+                resource: '',
+                imageUrl: '',
+                dataput: ''
+            },
+            rules: {
+                collectionTitle: [
+                    { required: true, collection: '请输入藏品名称', trigger: 'blur' }
+                ],
+
+                collectionImg: [
+                    { required: true, collection: '请设置头图', trigger: 'blur' }
+                ],
+                collectionTime: [
+                    { required: true, collection: '请设置时间', trigger: 'blur' }
+                ],
+                giftRedemption: [
+                    { required: true, collection: '请设置是否可兑换', trigger: 'blur' }
+                ],
+            },
+
+
+        }
+    },
+    methods: {
+        handleAvatarSuccess(res, file) {
+            this.collection.imageUrl = URL.createObjectURL(file.raw);
+        },
+        //限制图片大小
+        beforeAvatarUpload(file) {
+            const isJPG = file.type === "image/jpeg" || file.type === "image/png";
+            if (!isJPG) {
+                this.$message.error("上传头像图片只能是 JPG和PNG 格式!");
+            }
+            //调用[限制图片尺寸]函数
+            this.limitFileWH(750, 750, file).then((res) => {
+                file.isFlag = res
+            })
+            return isJPG && file.isFlag;
+        },
+        //限制图片尺寸
+        limitFileWH(E_width, E_height, file) {
+            let _this = this;
+            let imgWidth = "";
+            let imgHight = "";
+            const isSize = new Promise(function (resolve, reject) {
+                let width = E_width;
+                let height = E_height;
+                let _URL = window.URL || window.webkitURL;
+                let img = new Image();
+                img.onload = function () {
+                    imgWidth = img.width;
+                    imgHight = img.height;
+                    let valid = img.width == width && img.height == height;
+                    valid ? resolve() : reject();
+                }
+                img.src = _URL.createObjectURL(file);
+            }).then(() => {
+                return true;
+            }, () => {
+                _this.$message.warning({
+                    message: '上传文件的图片大小不合符标准,宽需要为' + E_width + 'px，高需要为' + E_height + 'px。当前上传图片的宽高分别为：' + imgWidth + 'px和' +
+                        imgHight + 'px',
+                    btn: false
+                })
+                return false;
+            });
+            return isSize
+        },
+        //
+        subSet() {
+            console.log("提交")
+        }
+    }
+}
+
+
+</script>
+
+<style>
+.collection-add {
+    width: 700px;
+    height: 100%;
+    position: absolute;
+    top: 30px;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    margin: auto;
+    border: 1px solid #ccc;
+}
+
+.collection-add-box {
+    padding: 40px;
+}
+
+.avatar-uploader .el-upload {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+}
+
+.avatar-uploader .el-upload:hover {
+    border-color: #409EFF;
+}
+
+.avatar-uploader-icon {
+    font-size: 28px;
+    color: #8c939d;
+    width: 447px;
+    height: 447px;
+    line-height: 447px;
+    text-align: center;
+}
+
+.avatar {
+    width: 178px;
+    height: 178px;
+    display: block;
+}
+</style>

src/views/sets/collectionDetails.vue

@@ -0,0 +1,143 @@
+<template>
+    <div class="container">
+        <h3 class="title">藏品详情</h3>
+        <div class="content">
+            <el-row>
+                <el-col :span="24">
+                    <div class="grid-content-title bg-title">藏品图片</div>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="24">
+                    <div class="grid-content-content bg-img">
+                        <img src="../../assets/images/邮票6.png" alt="">
+                    </div>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="10">
+                    <div class="grid-content-title bg-title">藏品名称</div>
+                </el-col>
+                <el-col :span="7">
+                    <div class="grid-content-title bg-title">藏品价格</div>
+                </el-col>
+                <el-col :span="7">
+                    <div class="grid-content-title bg-title">藏品数量</div>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="10">
+                    <div class="grid-content-title bg-content">可邮寄藏品</div>
+                </el-col>
+                <el-col :span="7">
+                    <div class="grid-content-title bg-content">0.01元</div>
+                </el-col>
+                <el-col :span="7">
+                    <div class="grid-content-title bg-content">16份</div>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="10">
+                    <div class="grid-content-title bg-title">发行方</div>
+                </el-col>
+                <el-col :span="14">
+                    <div class="grid-content-title bg-title">售卖时间</div>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="10">
+                    <div class="grid-content-title bg-content">北京原创三色广告有限公司</div>
+                </el-col>
+                <el-col :span="14">
+                    <div class="grid-content-title bg-content">2023-02-15 10:10:10 - 2023-02-17 00:00:00</div>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="10">
+                    <div class="grid-content-title bg-title">实体邮品邮寄</div>
+                </el-col>
+                <el-col :span="7">
+                    <div class="grid-content-title bg-title">积分返佣</div>
+                </el-col>
+                <el-col :span="7">
+                    <div class="grid-content-title bg-title">返利百分比</div>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="10">
+                    <div class="grid-content-title bg-content">邮寄</div>
+                </el-col>
+                <el-col :span="7">
+                    <div class="grid-content-title bg-content">返佣</div>
+                </el-col>
+                <el-col :span="7">
+                    <div class="grid-content-title bg-content">100%</div>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="24">
+                    <div class="grid-content-title bg-title">作品故事</div>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="24">
+                    <div class="grid-content-content bg-img2">
+                        <img src="../../assets/images/邮票6详情.png" alt="">
+                    </div>
+                </el-col>
+            </el-row>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    methods: {
+
+    }
+}
+</script>
+
+<style scoped>
+.container {
+    width: 1220px;
+    height: 660px;
+    border: 2px solid #FAFAFA;
+    border-radius: 2px;
+    margin: 20px auto;
+    padding: 0 24px;
+}
+
+.grid-content-title {
+    height: 38px;
+    border: 1px solid #EBEEF5;
+}
+.grid-content-content {
+    min-height: 126px;
+    padding: 20px 60px;
+}
+.grid-content-content img {
+    height: 86px;
+}
+
+.content {
+    height: 580px;
+    border: 2px solid #FAFAFA;
+}
+
+.bg-title {
+    background-color: #FAFAFA;
+    color: #909399;
+    font-size: 14px;
+    line-height: 38px;
+    padding-left: 10px;
+}
+.bg-content {
+    font-size: 13px;
+    line-height: 38px;
+    padding-left: 10px;
+}
+.bg-img2 {
+    margin-left: 32px;
+}
+</style>

src/views/sets/setList.vue

@@ -0,0 +1,356 @@
+<template>
+    <div>
+        <el-card>
+            <el-page-header @back="goback" content="套系列表"></el-page-header>
+        </el-card>
+        <el-container>
+            <el-header style="height: 120px;">
+                <div id="header-one">
+                    <h3 class="el-icon-search" style="margin-left: 10px;">筛选搜索</h3>
+                    <div id="header-one-btu">
+                        <el-button @click="empty">重置</el-button>
+                        <el-button type="primary" @click="check">搜索</el-button>
+                    </div>
+                </div>
+                <div id="header-two">
+                    <el-row>
+                        <el-col :span="5" id="header-two-left">
+                            <el-form ref="anFormRef" :model="anForm" label-width="80px">
+                                <el-form-item label="藏品名称(套):" label-width="102px">
+                                    <el-input v-model="anForm.anName" class="anInput" placeholder="筛选藏品标题"
+                                        center></el-input>
+                                </el-form-item>
+                            </el-form>
+                        </el-col>
+                        <el-col :span="8">
+                            <el-form label-width="80px">
+                                <el-form-item label="创建时间:">
+                                    <el-date-picker v-model="dataput" type="datetimerange" class="up-input-right"
+                                        range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" align="right">
+                                    </el-date-picker>
+                                </el-form-item>
+                            </el-form>
+                        </el-col>
+                    </el-row>
+                </div>
+            </el-header>
+            <el-main style="height: 110px;">
+                <h3 class="el-icon-tickets">套系列表 共有{{ total }}条数据</h3>
+                <el-button id="main-btu" @click="addSet()">添加</el-button>
+            </el-main>
+            <div class="footer">
+                <!-- 这破玩意帮点击为啥不好使...... -->
+                <!-- <el-radio-group v-model="tabPosition">
+                                                                                             <el-radio-button label="onSale" tab-click="onSale1">在售</el-radio-button>
+                                                                                            <el-radio-button label="preSale" @click="preSale()">预售</el-radio-button>
+                                                                                                 <el-radio-button label="expired" @click="expired()">已过期</el-radio-button>
+                                                                                               </el-radio-group> -->
+                <el-row>
+                    <!-- 这块样式需要index没有只能先这么写 -->
+                    <el-button size="small" @click="onSale1()" :class="btnact">在售</el-button>
+                    <el-button size="small" @click="preSale()" :class="btnact1">预售</el-button>
+                    <el-button size="small" @click="expired()" :class="btnact2">已过期</el-button>
+                </el-row>
+                <!-- 非响应式？？‘’‘不是非响应式上面帮点击时间不好使 -->
+                <el-table :data="tableData" border style="width: 100%">
+                    <el-table-column prop="id" label="id" width="110" align="center">
+                    </el-table-column>
+                    <el-table-column prop="name" label="藏品名称(套)" width="280" align="center">
+                    </el-table-column>
+                    <el-table-column prop="time" label="创建时间" width="280" align="center">
+                    </el-table-column>
+                    <el-table-column prop="time2" label="展示时间" width="280" align="center">
+                    </el-table-column>
+                    <el-table-column prop="number" label="藏品数量" width="280" align="center">
+                    </el-table-column>
+                    <el-table-column prop="tai" label="状态" width="280" align="center">
+                    </el-table-column>
+                    <el-table-column prop="edit" label="操作" width="280" align="center">
+                        <el-button type="text" @click="sList()">藏品列表</el-button>
+                        <el-row>
+                            <el-button type="text" @click="upJia()">上架</el-button>
+                            <el-button type="text" @click="editTime()">修改时间</el-button>
+                        </el-row>
+                    </el-table-column>
+                </el-table>
+            </div>
+        </el-container>
+    </div>
+</template>
+<script>
+import { getSet, searchSet } from "@/api/sets/index"
+export default {
+    data() {
+        return {
+            anForm: {
+                anName: '',
+            },
+            total: 1,
+            dataput: '',
+            activeName: 'first',
+            //列表
+            tabPosition: 'onSale',
+            //
+            btnact: 'th',
+            btnact1: 'th1',
+            btnact2: 'th2',
+            tableData: [{
+                id: '17',
+                name: 'wangxiu',
+                time: '20230218',
+                time2: '20230218',
+                number: '7',
+                tai: '已上线',
+                edit: 'caozuo'
+            }],
+        }
+    },
+    watch: {
+        activeName(newVal, oldVal) {
+            console.log(newVal, "\n", oldVal)
+        }
+    },
+    created() {
+
+    },
+    methods: {
+        goback() {
+            window.history.go(-1)
+        },
+        //点击标签切换修改后
+        onSale1() {
+            console.log("11")
+            if (this.btnact == 'activeBack') {
+                this.btnact = 'th'
+                this.btnact1 = 'activeBack1'
+                this.btnact2 = 'activeBack2'
+            }
+            else {
+                this.btnact = 'activeBack'
+                this.btnact1 = 'th1'
+                this.btnact2 = 'th2'
+            }
+            this.tableData = [{
+                id: '17',
+                name: 'wangxiu',
+                time: '20230218',
+                time2: '20230218',
+                number: '7',
+                tai: '已上线',
+                edit: 'caozuo'
+            }]
+
+
+
+        },
+        preSale() {
+            console.log('222')
+            if (this.btnact1 == 'activeBack1') {
+                this.btnact1 = 'th1'
+                this.btnact = 'activeBack'
+                this.btnact2 = 'activeBack2'
+            }
+            else {
+                this.btnact1 = 'activeBack1'
+                this.btnact = 'th'
+                this.btnact2 = 'th2'
+            }
+            this.tableData = [{
+                id: '17',
+                name: 'wangxiu 预售',
+                time: '20230218',
+                time2: '20230218',
+                number: '7',
+                tai: '已上线',
+                edit: 'caozuo'
+            }]
+        },
+        expired() {
+            console.log('333')
+            if (this.btnact2 == 'activeBack2') {
+                this.btnact2 = 'th2'
+                this.btnact = 'activeBack'
+                this.btnact1 = 'activeBack1'
+            }
+            else {
+                this.btnact2 = 'activeBack'
+                this.btnact = 'th'
+                this.btnact1 = 'th1'
+            }
+            this.tableData = [{
+                id: '17',
+                name: 'wangxiu77777',
+                time: '20230218',
+                time2: '20230218',
+                number: '7',
+                tai: '已上线',
+                edit: 'caozuo'
+            }]
+        },
+        //重置
+        empty() {
+            this.anForm.anName = "";
+            this.dataput = "";
+        },
+        //搜索
+        check() {
+            if (this.anForm.anName) {
+            let con = {
+            name: this.anForm.anName
+        }
+            searchNotice(con).then((data) => {
+             this.tableData = data.list;
+             this.total = data.count;
+        })
+      } else {
+        this.getnotice();
+      }
+        },
+        //添加
+        addSet() {
+            this.$router.push('./addSet')
+        },
+        //藏品列表
+        sList() {
+            this.$router.push('./collectionDetails')
+        },
+        //上架
+        upJia() {
+            this.$confirm('是否要上架商品?', '提示', {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+        }).then(() => {
+            this.$message({
+            type: 'success',
+            message: '上架成功!'
+        });
+        }).catch(() => {
+            this.$message({
+            type: 'info',
+             message: '已取消'
+        });
+        });
+
+        },
+        //修改时间
+        editTime() {
+            console.log("修改时间")
+        }
+
+
+    }
+};
+
+</script>
+<style scoped>
+.el-main {
+    color: #333;
+    border: 1px solid #d3d7d4;
+    border-radius: 5px;
+    margin-left: 30px;
+    margin-right: 30px;
+}
+
+.el-header {
+    color: #333;
+    border: 1px solid #d3d7d4;
+    border-radius: 5px;
+    margin: 30px;
+}
+
+/* .el-footer {} */
+
+#footer-t {
+    color: #333;
+    border: 1px solid #d3d7d4;
+    border-radius: 5px;
+    margin-left: 10px;
+    margin-top: 30px;
+}
+
+/* #header-one {} */
+
+#header-two {
+    /* background-color: aqua; */
+    margin-left: 90px;
+}
+
+#header-one-btu {
+    margin: 20px 20px 0px 0px;
+    float: right;
+}
+
+#header-two-left {
+    margin-right: 150px;
+}
+
+#main-btu {
+    float: right;
+    margin-top: 10px;
+}
+
+#page {
+    float: right;
+    margin-top: 15px;
+}
+
+.footer {
+    margin: 20px auto;
+    width: 97%;
+}
+
+.th {
+    /* margin: 0;
+    padding: 0; */
+    margin-right: -10.75px;
+    font-size: 16px;
+    font-weight: 800;
+    background-color: #FFFFFF;
+    color: #606266;
+}
+
+.activeBack {
+    margin-right: -10.75px;
+    font-size: 16px;
+    font-weight: 800;
+    background-color: #409EFF;
+    color: white;
+}
+
+.th1 {
+    /* margin: 0;
+    padding: 0; */
+    margin-right: -10.75px;
+    font-size: 16px;
+    font-weight: 800;
+    background-color: #FFFFFF;
+    color: #606266;
+}
+
+.activeBack1 {
+    margin-right: -10.75px;
+    font-size: 16px;
+    font-weight: 800;
+    background-color: #409EFF;
+    color: white;
+}
+
+.th2 {
+    /* margin: 0;
+    padding: 0; */
+    margin-right: -10.75px;
+    font-size: 16px;
+    font-weight: 800;
+    background-color: #FFFFFF;
+    color: #606266;
+}
+
+.activeBack2 {
+    margin-right: -10.75px;
+    font-size: 16px;
+    font-weight: 800;
+    background-color: #409EFF;
+    color: white;
+}
+</style>

src/views/system/menu/index.vue

@@ -2,21 +2,12 @@
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
       <el-form-item label="菜单名称" prop="menuName">
-        <el-input
-          v-model="queryParams.menuName"
-          placeholder="请输入菜单名称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
+        <el-input v-model="queryParams.menuName" placeholder="请输入菜单名称" clearable @keyup.enter.native="handleQuery" />
       </el-form-item>
       <el-form-item label="状态" prop="status">
         <el-select v-model="queryParams.status" placeholder="菜单状态" clearable>
-          <el-option
-            v-for="dict in dict.type.sys_normal_disable"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
+          <el-option v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.label"
+            :value="dict.value" />
         </el-select>
       </el-form-item>
       <el-form-item>
@@ -27,35 +18,17 @@
 
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['system:menu:add']"
-        >新增</el-button>
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
+          v-hasPermi="['system:menu:add']">新增</el-button>
       </el-col>
       <el-col :span="1.5">
-        <el-button
-          type="info"
-          plain
-          icon="el-icon-sort"
-          size="mini"
-          @click="toggleExpandAll"
-        >展开/折叠</el-button>
+        <el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
-    <el-table
-      v-if="refreshTable"
-      v-loading="loading"
-      :data="menuList"
-      row-key="menuId"
-      :default-expand-all="isExpandAll"
-      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
-    >
+    <el-table v-if="refreshTable" v-loading="loading" :data="menuList" row-key="menuId"
+      :default-expand-all="isExpandAll" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
       <el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>
       <el-table-column prop="icon" label="图标" align="center" width="100">
         <template slot-scope="scope">
@@ -67,7 +40,7 @@
       <el-table-column prop="component" label="组件路径" :show-overflow-tooltip="true"></el-table-column>
       <el-table-column prop="status" label="状态" width="80">
         <template slot-scope="scope">
-          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
+          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status" />
         </template>
       </el-table-column>
       <el-table-column label="创建时间" align="center" prop="createTime">
@@ -77,27 +50,12 @@
       </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button 
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['system:menu:edit']"
-          >修改</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-plus"
-            @click="handleAdd(scope.row)"
-            v-hasPermi="['system:menu:add']"
-          >新增</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['system:menu:remove']"
-          >删除</el-button>
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
+            v-hasPermi="['system:menu:edit']">修改</el-button>
+          <el-button size="mini" type="text" icon="el-icon-plus" @click="handleAdd(scope.row)"
+            v-hasPermi="['system:menu:add']">新增</el-button>
+          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
+            v-hasPermi="['system:menu:remove']">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -108,13 +66,8 @@
         <el-row>
           <el-col :span="24">
             <el-form-item label="上级菜单" prop="parentId">
-              <treeselect
-                v-model="form.parentId"
-                :options="menuOptions"
-                :normalizer="normalizer"
-                :show-count="true"
-                placeholder="选择上级菜单"
-              />
+              <treeselect v-model="form.parentId" :options="menuOptions" :normalizer="normalizer" :show-count="true"
+                placeholder="选择上级菜单" />
             </el-form-item>
           </el-col>
           <el-col :span="24">
@@ -128,21 +81,11 @@
           </el-col>
           <el-col :span="24" v-if="form.menuType != 'F'">
             <el-form-item label="菜单图标" prop="icon">
-              <el-popover
-                placement="bottom-start"
-                width="460"
-                trigger="click"
-                @show="$refs['iconSelect'].reset()"
-              >
+              <el-popover placement="bottom-start" width="460" trigger="click" @show="$refs['iconSelect'].reset()">
                 <IconSelect ref="iconSelect" @selected="selected" />
                 <el-input slot="reference" v-model="form.icon" placeholder="点击选择图标" readonly>
-                  <svg-icon
-                    v-if="form.icon"
-                    slot="prefix"
-                    :icon-class="form.icon"
-                    class="el-input__icon"
-                    style="height: 32px;width: 16px;"
-                  />
+                  <svg-icon v-if="form.icon" slot="prefix" :icon-class="form.icon" class="el-input__icon"
+                    style="height: 32px;width: 16px;" />
                   <i v-else slot="prefix" class="el-icon-search el-input__icon" />
                 </el-input>
               </el-popover>
@@ -162,7 +105,7 @@
             <el-form-item prop="isFrame">
               <span slot="label">
                 <el-tooltip content="选择是外链则路由地址需要以`http(s)://`开头" placement="top">
-                <i class="el-icon-question"></i>
+                  <i class="el-icon-question"></i>
                 </el-tooltip>
                 是否外链
               </span>
@@ -176,7 +119,7 @@
             <el-form-item prop="path">
               <span slot="label">
                 <el-tooltip content="访问的路由地址，如：`user`，如外网地址需内链访问则以`http(s)://`开头" placement="top">
-                <i class="el-icon-question"></i>
+                  <i class="el-icon-question"></i>
                 </el-tooltip>
                 路由地址
               </span>
@@ -187,7 +130,7 @@
             <el-form-item prop="component">
               <span slot="label">
                 <el-tooltip content="访问的组件路径，如：`system/user/index`，默认在`views`目录下" placement="top">
-                <i class="el-icon-question"></i>
+                  <i class="el-icon-question"></i>
                 </el-tooltip>
                 组件路径
               </span>
@@ -199,7 +142,7 @@
               <el-input v-model="form.perms" placeholder="请输入权限标识" maxlength="100" />
               <span slot="label">
                 <el-tooltip content="控制器中定义的权限字符，如：@PreAuthorize(`@ss.hasPermi('system:user:list')`)" placement="top">
-                <i class="el-icon-question"></i>
+                  <i class="el-icon-question"></i>
                 </el-tooltip>
                 权限字符
               </span>
@@ -210,7 +153,7 @@
               <el-input v-model="form.query" placeholder="请输入路由参数" maxlength="255" />
               <span slot="label">
                 <el-tooltip content='访问路由的默认传递参数，如：`{"id": 1, "name": "ry"}`' placement="top">
-                <i class="el-icon-question"></i>
+                  <i class="el-icon-question"></i>
                 </el-tooltip>
                 路由参数
               </span>
@@ -220,7 +163,7 @@
             <el-form-item prop="isCache">
               <span slot="label">
                 <el-tooltip content="选择是则会被`keep-alive`缓存，需要匹配组件的`name`和地址保持一致" placement="top">
-                <i class="el-icon-question"></i>
+                  <i class="el-icon-question"></i>
                 </el-tooltip>
                 是否缓存
               </span>
@@ -234,16 +177,13 @@
             <el-form-item prop="visible">
               <span slot="label">
                 <el-tooltip content="选择隐藏则路由将不会出现在侧边栏，但仍然可以访问" placement="top">
-                <i class="el-icon-question"></i>
+                  <i class="el-icon-question"></i>
                 </el-tooltip>
                 显示状态
               </span>
               <el-radio-group v-model="form.visible">
-                <el-radio
-                  v-for="dict in dict.type.sys_show_hide"
-                  :key="dict.value"
-                  :label="dict.value"
-                >{{dict.label}}</el-radio>
+                <el-radio v-for="dict in dict.type.sys_show_hide" :key="dict.value"
+                  :label="dict.value">{{ dict.label }}</el-radio>
               </el-radio-group>
             </el-form-item>
           </el-col>
@@ -251,16 +191,13 @@
             <el-form-item prop="status">
               <span slot="label">
                 <el-tooltip content="选择停用则路由将不会出现在侧边栏，也不能被访问" placement="top">
-                <i class="el-icon-question"></i>
+                  <i class="el-icon-question"></i>
                 </el-tooltip>
                 菜单状态
               </span>
               <el-radio-group v-model="form.status">
-                <el-radio
-                  v-for="dict in dict.type.sys_normal_disable"
-                  :key="dict.value"
-                  :label="dict.value"
-                >{{dict.label}}</el-radio>
+                <el-radio v-for="dict in dict.type.sys_normal_disable" :key="dict.value"
+                  :label="dict.value">{{ dict.label }}</el-radio>
               </el-radio-group>
             </el-form-item>
           </el-col>
@@ -420,7 +357,7 @@ export default {
       });
     },
     /** 提交按钮 */
-    submitForm: function() {
+    submitForm: function () {
       this.$refs["form"].validate(valid => {
         if (valid) {
           if (this.form.menuId != undefined) {
@@ -441,12 +378,12 @@ export default {
     },
     /** 删除按钮操作 */
     handleDelete(row) {
-      this.$modal.confirm('是否确认删除名称为"' + row.menuName + '"的数据项？').then(function() {
+      this.$modal.confirm('是否确认删除名称为"' + row.menuName + '"的数据项？').then(function () {
         return delMenu(row.menuId);
       }).then(() => {
         this.getList();
         this.$modal.msgSuccess("删除成功");
-      }).catch(() => {});
+      }).catch(() => { });
     }
   }
 };

vue.config.js

@@ -35,7 +35,7 @@ module.exports = {
     proxy: {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-        target: `http://localhost:8080`,
+        target: `http://39.105.160.25:10996`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''