Jelajahi Sumber

基础代码、站点配置、权限

kevin_zhangl 2 tahun lalu
induk
melakukan
957fafb28f

+ 25 - 0
src/api/config.js

@@ -0,0 +1,25 @@
+import request from '@/utils/request'
+
+/**
+ * 获取站点配置
+ * @returns {*}
+ */
+export function fetchSiteConfig() {
+  return request({
+    url: '/v1/config/base',
+    method: 'get'
+  })
+}
+
+/**
+ * 更新站点配置
+ * @param data
+ * @returns {*}
+ */
+export function updateSiteConfig(data) {
+  return request({
+    url: '/v1/config/base',
+    method: 'post',
+    data
+  })
+}

+ 13 - 0
src/api/member.js

@@ -0,0 +1,13 @@
+import request from '@/utils/request'
+
+/**
+ * 会员列表
+ * @returns {*}
+ */
+export function fetchMemberList(data) {
+  return request({
+    url: '/v1/user/index',
+    method: 'get',
+    params: data
+  })
+}

TEMPAT SAMPAH
src/assets/avatar/avatar.gif


+ 7 - 1
src/lang/zh.js

@@ -200,6 +200,7 @@ export default {
     require: '必须填写'
   },
 
+  // 菜单
   menu: {
     // 一级菜单
     dashboard: '首页',
@@ -232,7 +233,7 @@ export default {
     sponsorNetwork: '推荐网路',
     // 二级菜单/接口-bonusManagement
     closurePeriod: '封期管理',
-    memberBonusBalance: '会员奖金余额',
+    memberBonusBalance: '会员账户余额',
     memberBonus: '往期奖金',
     bonusFlow: '奖金流水',
     memberPerformance: '用户业绩',
@@ -271,5 +272,10 @@ export default {
     decLevelConfig: '会员级别配置',
     empLevelConfig: '会员聘级配置',
     decRoleConfig: '报单中心级别配置'
+  },
+
+  // 会员
+  user: {
+
   }
 }

+ 2 - 2
src/layout/components/Sidebar/Logo.vue

@@ -2,11 +2,11 @@
   <div class="sidebar-logo-container" :class="{'collapse':collapse}">
     <transition name="sidebarLogoFade">
       <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo">
+        <img v-if="logo" src="https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif" class="sidebar-logo" alt="">
         <h1 v-else class="sidebar-title">{{ title }} </h1>
       </router-link>
       <router-link v-else key="expand" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo">
+        <img v-if="logo" :src="logo" class="sidebar-logo" alt="">
         <h1 class="sidebar-title">{{ title }} </h1>
       </router-link>
     </transition>

+ 6 - 255
src/router/index.js

@@ -7,10 +7,8 @@ Vue.use(Router)
 import Layout from '@/layout'
 
 /* Router Modules */
-import componentsRouter from './modules/components'
-import chartsRouter from './modules/charts'
-import tableRouter from './modules/table'
-import nestedRouter from './modules/nested'
+import memberRouter from '@/router/modules/member'
+import configRouter from '@/router/modules/config'
 
 /**
  * Note: sub-menu only appear when route children.length >= 1
@@ -83,31 +81,6 @@ export const constantRoutes = [
       }
     ]
   },
-  {
-    path: '/documentation',
-    component: Layout,
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/documentation/index'),
-        name: 'Documentation',
-        meta: { title: 'documentation', icon: 'documentation', affix: true }
-      }
-    ]
-  },
-  {
-    path: '/guide',
-    component: Layout,
-    redirect: '/guide/index',
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/guide/index'),
-        name: 'Guide',
-        meta: { title: 'guide', icon: 'guide', noCache: true }
-      }
-    ]
-  },
   {
     path: '/profile',
     component: Layout,
@@ -129,111 +102,12 @@ export const constantRoutes = [
  * the routes that need to be dynamically loaded based on user roles
  */
 export const asyncRoutes = [
-  {
-    path: '/permission',
-    component: Layout,
-    redirect: '/permission/page',
-    alwaysShow: true, // will always show the root menu
-    name: 'Permission',
-    meta: {
-      title: 'permission',
-      icon: 'lock',
-      roles: ['admin', 'editor'] // you can set roles in root nav
-    },
-    children: [
-      {
-        path: 'page',
-        component: () => import('@/views/permission/page'),
-        name: 'PagePermission',
-        meta: {
-          title: 'pagePermission',
-          roles: ['admin'] // or you can only set roles in sub nav
-        }
-      },
-      {
-        path: 'directive',
-        component: () => import('@/views/permission/directive'),
-        name: 'DirectivePermission',
-        meta: {
-          title: 'directivePermission'
-          // if do not set roles, means: this page does not require permission
-        }
-      },
-      {
-        path: 'role',
-        component: () => import('@/views/permission/role'),
-        name: 'RolePermission',
-        meta: {
-          title: 'rolePermission',
-          roles: ['admin']
-        }
-      }
-    ]
-  },
-
-  {
-    path: '/icon',
-    component: Layout,
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/icons/index'),
-        name: 'Icons',
-        meta: { title: 'icons', icon: 'icon', noCache: true }
-      }
-    ]
-  },
-
   /** when your routing map is too long, you can split it into small modules **/
-  componentsRouter,
-  chartsRouter,
-  nestedRouter,
-  tableRouter,
 
-  {
-    path: '/example',
-    component: Layout,
-    redirect: '/example/list',
-    name: 'Example',
-    meta: {
-      title: 'example',
-      icon: 'el-icon-s-help'
-    },
-    children: [
-      {
-        path: 'create',
-        component: () => import('@/views/example/create'),
-        name: 'CreateArticle',
-        meta: { title: 'createArticle', icon: 'edit' }
-      },
-      {
-        path: 'edit/:id(\\d+)',
-        component: () => import('@/views/example/edit'),
-        name: 'EditArticle',
-        meta: { title: 'editArticle', noCache: true, activeMenu: '/example/list' },
-        hidden: true
-      },
-      {
-        path: 'list',
-        component: () => import('@/views/example/list'),
-        name: 'ArticleList',
-        meta: { title: 'articleList', icon: 'list' }
-      }
-    ]
-  },
-
-  {
-    path: '/tab',
-    component: Layout,
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/tab/index'),
-        name: 'Tab',
-        meta: { title: 'tab', icon: 'tab' }
-      }
-    ]
-  },
+  // 会员
+  memberRouter,
+  // 设置
+  configRouter,
 
   {
     path: '/error',
@@ -273,129 +147,6 @@ export const asyncRoutes = [
     ]
   },
 
-  {
-    path: '/excel',
-    component: Layout,
-    redirect: '/excel/export-excel',
-    name: 'Excel',
-    meta: {
-      title: 'excel',
-      icon: 'excel'
-    },
-    children: [
-      {
-        path: 'export-excel',
-        component: () => import('@/views/excel/export-excel'),
-        name: 'ExportExcel',
-        meta: { title: 'exportExcel' }
-      },
-      {
-        path: 'export-selected-excel',
-        component: () => import('@/views/excel/select-excel'),
-        name: 'SelectExcel',
-        meta: { title: 'selectExcel' }
-      },
-      {
-        path: 'export-merge-header',
-        component: () => import('@/views/excel/merge-header'),
-        name: 'MergeHeader',
-        meta: { title: 'mergeHeader' }
-      },
-      {
-        path: 'upload-excel',
-        component: () => import('@/views/excel/upload-excel'),
-        name: 'UploadExcel',
-        meta: { title: 'uploadExcel' }
-      }
-    ]
-  },
-
-  {
-    path: '/zip',
-    component: Layout,
-    redirect: '/zip/download',
-    alwaysShow: true,
-    name: 'Zip',
-    meta: { title: 'zip', icon: 'zip' },
-    children: [
-      {
-        path: 'download',
-        component: () => import('@/views/zip/index'),
-        name: 'ExportZip',
-        meta: { title: 'exportZip' }
-      }
-    ]
-  },
-
-  {
-    path: '/pdf',
-    component: Layout,
-    redirect: '/pdf/index',
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/pdf/index'),
-        name: 'PDF',
-        meta: { title: 'pdf', icon: 'pdf' }
-      }
-    ]
-  },
-  {
-    path: '/pdf/download',
-    component: () => import('@/views/pdf/download'),
-    hidden: true
-  },
-
-  {
-    path: '/theme',
-    component: Layout,
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/theme/index'),
-        name: 'Theme',
-        meta: { title: 'theme', icon: 'theme' }
-      }
-    ]
-  },
-
-  {
-    path: '/clipboard',
-    component: Layout,
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/clipboard/index'),
-        name: 'ClipboardDemo',
-        meta: { title: 'clipboardDemo', icon: 'clipboard' }
-      }
-    ]
-  },
-
-  {
-    path: '/i18n',
-    component: Layout,
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/i18n-demo/index'),
-        name: 'I18n',
-        meta: { title: 'i18n', icon: 'international' }
-      }
-    ]
-  },
-
-  {
-    path: 'external-link',
-    component: Layout,
-    children: [
-      {
-        path: 'https://github.com/PanJiaChen/vue-element-admin',
-        meta: { title: 'externalLink', icon: 'link' }
-      }
-    ]
-  },
-
   // 404 page must be placed at the end !!!
   { path: '*', redirect: '/404', hidden: true }
 ]

+ 20 - 0
src/router/modules/config.js

@@ -0,0 +1,20 @@
+/** When your routing table is too long, you can split it into small modules **/
+
+import Layout from '@/layout'
+
+const configRouter = {
+  path: '/config',
+  component: Layout,
+  redirect: '/config/base',
+  hidden: true,
+  children: [
+    {
+      path: 'base', // 站点配置
+      component: () => import('@/views/config/site-config'),
+      name: 'siteConfig',
+      meta: { title: '站点配置', icon: 'user', noCache: true }
+    }
+  ]
+}
+
+export default configRouter

+ 25 - 0
src/router/modules/member.js

@@ -0,0 +1,25 @@
+/** When your routing table is too long, you can split it into small modules **/
+
+import Layout from '@/layout'
+
+const memberRouter = {
+  path: '/user',
+  component: Layout,
+  redirect: '/user/index',
+  name: 'Member Management',
+  meta: {
+    title: 'user',
+    icon: 'el-icon-user-solid'
+  },
+  children: [
+    {
+      path: 'index', // 会员列表
+      component: () => import('@/views/user/member-list'),
+      name: 'memberList',
+      meta: { title: 'Member List', icon: 'el-icon-user-solid' }
+    }
+
+  ]
+}
+
+export default memberRouter

+ 1 - 1
src/settings.js

@@ -11,7 +11,7 @@ module.exports = {
    * @type {boolean} true | false
    * @description Whether need tagsView
    */
-  tagsView: true,
+  tagsView: false,
 
   /**
    * @type {boolean} true | false

+ 74 - 0
src/utils/index.js

@@ -355,3 +355,77 @@ export function removeClass(ele, cls) {
     ele.className = ele.className.replace(reg, ' ')
   }
 }
+
+/**
+ * 查询操作系统
+ * @returns {string}
+ */
+export function getOperatingSystem() {
+  try {
+    // 检测当前操作系统
+    if (/(android|Android|ANDROID)/i.test(navigator.userAgent)) {
+      // 这是Android平台下浏览器
+      return 'Android'
+    }
+    if (/(iPhone|iPad|iPod|iOS|iphone|ipad|ipod|ios)/i.test(navigator.userAgent)) {
+      // 这是iOS平台下浏览器
+      return 'ios'
+    }
+    if (/win|windows|Win|Windows/i.test(navigator.userAgent)) {
+      // 这是Linux平台下浏览器
+      return 'windows'
+    }
+    if (/Linux/i.test(navigator.platform)) {
+      // 这是Linux操作系统平台
+      return 'linux'
+    }
+  } catch (e) {
+    // 可以看看e是什么玩意
+    console.log(e)
+    // 返回未知
+    return 'unknow'
+  }
+}
+
+/**
+ * 获取媒介尺寸
+ * @returns {string}
+ */
+export function getMedia() {
+  return ['Android', 'ios'].includes(getOperatingSystem()) ? 'small' : 'medium'
+}
+
+/**
+ * 查询屏幕分辨率宽度
+ * @returns {number}
+ */
+export function getScreenWidth() {
+  return window.screen.width
+}
+
+/**
+ * 查询屏幕分辨率宽度
+ * @returns {number}
+ */
+export function getScreenHeight() {
+  return window.screen.height
+}
+
+/**
+ * 金额千分符
+ * @param amount
+ * @returns {string}
+ */
+export function formatAmount(amount) {
+  amount = parseFloat(amount)
+  if (amount === 0.00) {
+    return '0.00'
+  }
+
+  amount = String(amount)
+  const left = amount.split('.')[0]
+  let right = amount.split('.')[1]
+  right = right ? '.' + (right.length < 2 ? right + '0' : right) : '.00'
+  const temp = left.split('').reverse().join('').match(/(\d{1,3})/g)
+  return (Number(amount) < 0 ? '-' : '') + temp.join(',').split('').reverse().join('') + right
+}

+ 32 - 1
src/utils/permission.js

@@ -1,11 +1,14 @@
 import store from '@/store'
+import usersInfo from '@/utils/usersInfo'
+import baseInfo from '@/utils/baseInfo'
+import tool from '@/utils/tool'
 
 /**
  * @param {Array} value
  * @returns {Boolean}
  * @example see @/views/permission/directive.vue
  */
-export default function checkPermission(value) {
+export function checkPermission(value) {
   if (value && value instanceof Array && value.length > 0) {
     const roles = store.getters && store.getters.roles
     const permissionRoles = value
@@ -19,3 +22,31 @@ export default function checkPermission(value) {
     return false
   }
 }
+
+/**
+ * 获取权限
+ * @returns {string|*}
+ */
+export function getPermission() {
+  // 自己的管理组
+  const role = usersInfo.baseData().roleId
+  if (role === baseInfo.superAdminRoleId()) {
+    return 'all'
+  } else {
+    // 全部的管理员权限
+    const allAdminRoles = baseInfo.adminRoles()
+    // 自己的权限
+    return allAdminRoles[role].PERMISSION
+  }
+}
+
+/**
+ * 是否拥有权限该路由的权限
+ * @param route
+ * @returns {boolean}
+ */
+export function hasPermission(route) {
+  const permissions = this.getPermission()
+  if (permissions === 'all') return true
+  return tool.isInArray(permissions, route)
+}

+ 124 - 0
src/views/config/site-config.vue

@@ -0,0 +1,124 @@
+<template>
+  <div class="app-container">
+    <div class="white-box">
+      <el-form ref="form" :model="form" label-width="250px" :label-position="labelPosition" class="form-page">
+        <template v-for="item in configData">
+          <el-form-item :key="item.CONFIG_NAME" :label="item.TITLE">
+            <template v-if="item.INPUT_TYPE === '2'">
+              <el-select v-model="item.VALUE" placeholder="请选择">
+                <el-option v-for="optionItem in item.OPTIONS" :key="optionItem.label" :label="optionItem.label" :value="optionItem.value" />
+              </el-select>
+            </template>
+
+            <template v-else-if="item.INPUT_TYPE === '3'">
+              <el-checkbox-group v-model="item.VALUE">
+                <el-checkbox v-for="optionItem in item.OPTIONS" :key="optionItem.label" :label="optionItem.label" :value="optionItem.value" />
+              </el-checkbox-group>
+            </template>
+
+            <template v-else-if="item.INPUT_TYPE === '4'">
+              <el-date-picker v-model="item.VALUE" type="year" placeholder="选择年" />
+            </template>
+
+            <template v-else-if="item.INPUT_TYPE === '5'">
+              <el-date-picker v-model="item.VALUE" type="datetime" placeholder="Select date" />
+            </template>
+
+            <template v-else-if="item.INPUT_TYPE === '6'">
+              <el-date-picker v-model="item.VALUE" type="date" placeholder="Select date" />
+            </template>
+
+            <template v-else-if="item.INPUT_TYPE === '7'">
+              <el-time-select v-model="item.VALUE" :picker-options="{start: item.OPTIONS.start, end: item.OPTIONS.end, step: item.OPTIONS.step}" placeholder="选择时间" />
+            </template>
+
+            <template v-else-if="item.INPUT_TYPE === '8'">
+              <el-switch v-model="item.VALUE" />
+            </template>
+
+            <template v-else>
+              <el-input v-model="item.VALUE" placeholder="请输入内容">
+                <template v-if="!!item.UNIT" slot="append">{{ item.UNIT }}</template>
+              </el-input>
+            </template>
+          </el-form-item>
+        </template>
+        <el-form-item>
+          <el-button type="primary" :loading="submitButtonStat" @click="onSubmit">更新</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<script>
+import waves from '@/directive/waves'
+import { getScreenWidth } from '@/utils'
+import { fetchSiteConfig, updateSiteConfig } from '@/api/config'
+
+export default {
+  name: 'SiteConfig',
+  directives: { waves },
+  data() {
+    return {
+      loading: true,
+      submitButtonStat: false,
+      configData: null,
+      screenWidth: getScreenWidth() > 600 ? '500px' : getScreenWidth() + 'px',
+      labelPosition: getScreenWidth() > 600 ? 'right' : 'top'
+    }
+  },
+  computed: {
+    form: function() {
+      const result = {}
+      for (const i in this.configData) {
+        result[i] = this.configData[i].VALUE
+      }
+      return result
+    }
+  },
+  mounted() {
+    this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      this.loading = true
+      fetchSiteConfig().then(response => {
+        this.configData = response.data
+
+        setTimeout(() => {
+          this.loading = false
+        }, 0.5 * 1000)
+      })
+    },
+    onSubmit() {
+      this.submitButtonStat = true
+      updateSiteConfig(this.form).then(response => {
+        this.$message({
+          message: response.data,
+          type: 'success'
+        })
+
+        setTimeout(() => {
+          this.submitButtonStat = false
+        }, 0.5 * 1000)
+
+        this.submitButtonStat = false
+        this.fetchData()
+      }).catch(error => {
+        this.$message({
+          message: error,
+          type: 'warning'
+        })
+
+        this.submitButtonStat = false
+        this.fetchData()
+      })
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

+ 1 - 5
src/views/dashboard/admin/index.vue

@@ -27,9 +27,7 @@
     </el-row>
 
     <el-row :gutter="8">
-      <el-col :xs="{span: 24}" :sm="{span: 24}" :md="{span: 24}" :lg="{span: 12}" :xl="{span: 12}" style="padding-right:8px;margin-bottom:30px;">
-        <transaction-table />
-      </el-col>
+      <el-col :xs="{span: 24}" :sm="{span: 24}" :md="{span: 24}" :lg="{span: 12}" :xl="{span: 12}" style="padding-right:8px;margin-bottom:30px;" />
       <el-col :xs="{span: 24}" :sm="{span: 12}" :md="{span: 12}" :lg="{span: 6}" :xl="{span: 6}" style="margin-bottom:30px;">
         <todo-list />
       </el-col>
@@ -47,7 +45,6 @@ import LineChart from './components/LineChart'
 import RaddarChart from './components/RaddarChart'
 import PieChart from './components/PieChart'
 import BarChart from './components/BarChart'
-import TransactionTable from './components/TransactionTable'
 import TodoList from './components/TodoList'
 import BoxCard from './components/BoxCard'
 
@@ -79,7 +76,6 @@ export default {
     RaddarChart,
     PieChart,
     BarChart,
-    TransactionTable,
     TodoList,
     BoxCard
   },

+ 1 - 1
src/views/profile/components/UserCard.vue

@@ -6,7 +6,7 @@
 
     <div class="user-profile">
       <div class="box-center">
-        <pan-thumb :image="user.avatar" :height="'100px'" :width="'100px'" :hoverable="false">
+        <pan-thumb image="https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif" :height="'100px'" :width="'100px'" :hoverable="false">
           <div>Hello</div>
           {{ user.role }}
         </pan-thumb>

+ 121 - 0
src/views/user/member-list.vue

@@ -0,0 +1,121 @@
+<template>
+  <div class="app-container">
+    <el-table v-loading="loading" fit lazy highlight-current-row :data="memberData">
+      <!--			<el-table-column fixed type="selection" width="55" v-if="tableHeaders"></el-table-column>-->
+      <el-table-column
+        v-for="(tableHeader, key) in tableHeaders"
+        :key="key"
+        :label="tableHeader.header"
+        :width="tableHeader.other.width ? tableHeader.other.width : ''"
+        :fixed="tableHeader.index == 'USER_NAME' || tableHeader.index == 'REAL_NAME' ? true : false"
+      >
+        <template slot-scope="scope">
+          <template v-if="scope.row[tableHeader.index].other.tag">
+            <el-tag
+              :type="scope.row[tableHeader.index].other.tag.type ? scope.row[tableHeader.index].other.tag.type : null"
+              :size="scope.row[tableHeader.index].other.tag.size ? scope.row[tableHeader.index].other.tag.size : null"
+              :class="scope.row[tableHeader.index].other.tag.class ? scope.row[tableHeader.index].other.tag.class : null"
+            >
+              {{ scope.row[tableHeader.index].value }}
+            </el-tag>
+          </template>
+          <template v-else>
+            <template v-if="tableHeader.index === 'USER_NAME'">
+              <el-dropdown v-if="permission.hasPermission(`user/login-to-frontend`)">
+                <span class="el-dropdown-link">
+                  {{ scope.row.USER_NAME.value }} <i class="el-icon-arrow-down el-icon--right" />
+                </span>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item v-show="scope.row.BTF_URL !== null" command="login">
+                    <a
+                      :href="`${frontendServer}/#/login-by-backend?${scope.row.BTF_URL}`"
+                      target="_blank"
+                      style="color:#606266;"
+                    >Quick logon<!-- 快速登录 --></a>
+                  </el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+              <el-tag
+                v-if="!permission.hasPermission(`user/login-to-frontend`)"
+                type="primary"
+                size="small"
+                class="no-border"
+              >{{ scope.row.USER_NAME.value }}
+              </el-tag>
+            </template>
+            <template v-else>
+              <div v-html="scope.row[tableHeader.index].value" />
+            </template>
+          </template>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.pageSize" @pagination="getMemberList" />
+  </div>
+</template>
+
+<script>
+import waves from '@/directive/waves'
+import Pagination from '@/components/Pagination'
+import { getScreenWidth } from '@/utils'
+import { fetchMemberList } from '@/api/member'
+
+export default {
+  name: 'MemberList',
+  components: { Pagination },
+  directives: { waves },
+  filters: {
+    statusFilter(status) {
+      const statusMap = {
+        Unpaid: 'info',
+        Paid: 'success'
+      }
+      return statusMap[status]
+    }
+  },
+  data() {
+    return {
+      tableKey: 0,
+      total: 0,
+      memberData: [],
+      loading: true,
+      downloadLoading: false,
+      listQuery: {
+        page: 1,
+        pageSize: 20
+      },
+      childrenNode: [],
+      screenWidth: getScreenWidth() > 600 ? '500px' : getScreenWidth() + 'px',
+      labelPosition: getScreenWidth() > 600 ? 'right' : 'top'
+    }
+  },
+  created() {
+    this.getMemberList()
+  },
+  methods: {
+    getMemberList() {
+      this.loading = true
+      fetchMemberList(this.listQuery).then(response => {
+        this.memberData = response.data.list
+        this.total = +response.data.totalCount
+        console.log(this.memberData)
+        setTimeout(() => {
+          this.loading = false
+        }, 0.5 * 1000)
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.el-table th.el-table__cell > .cell {
+	white-space: nowrap;
+}
+
+.el-table td.el-table__cell > .cell {
+	word-break: keep-all;
+	white-space: pre-wrap;
+}
+</style>