删除模板文件

src/router/generator-routers.js

@@ -1,181 +0,0 @@
-// eslint-disable-next-line
-import * as loginService from '@/api/login'
-// eslint-disable-next-line
-import { BasicLayout, BlankLayout, PageView, RouteView } from '@/layouts'
-
-// 前端路由表 (基于动态)
-const constantRouterComponents = {
-  // 基础页面 layout 必须引入
-  BasicLayout: BasicLayout,
-  BlankLayout: BlankLayout,
-  RouteView: RouteView,
-  PageView: PageView,
-  '403': () => import(/* webpackChunkName: "error" */ '@/views/exception/403'),
-  '404': () => import(/* webpackChunkName: "error" */ '@/views/exception/404'),
-  '500': () => import(/* webpackChunkName: "error" */ '@/views/exception/500'),
-
-  // 你需要动态引入的页面组件
-  Workplace: () => import('@/views/dashboard/Workplace'),
-  Analysis: () => import('@/views/dashboard/Analysis'),
-
-  // form
-  BasicForm: () => import('@/views/form/basicForm'),
-  StepForm: () => import('@/views/form/stepForm/StepForm'),
-  AdvanceForm: () => import('@/views/form/advancedForm/AdvancedForm'),
-
-  // list
-  TableList: () => import('@/views/list/TableList'),
-  TableEdit: () => import('@/views/list/table/Edit'),
-  StandardList: () => import('@/views/list/BasicList'),
-  CardList: () => import('@/views/list/CardList'),
-  SearchLayout: () => import('@/views/list/search/SearchLayout'),
-  SearchArticles: () => import('@/views/list/search/Article'),
-  SearchProjects: () => import('@/views/list/search/Projects'),
-  SearchApplications: () => import('@/views/list/search/Applications'),
-  ProfileBasic: () => import('@/views/profile/basic'),
-  ProfileAdvanced: () => import('@/views/profile/advanced/Advanced'),
-
-  // result
-  ResultSuccess: () => import(/* webpackChunkName: "result" */ '@/views/result/Success'),
-  ResultFail: () => import(/* webpackChunkName: "result" */ '@/views/result/Error'),
-
-  // exception
-  Exception403: () => import(/* webpackChunkName: "fail" */ '@/views/exception/403'),
-  Exception404: () => import(/* webpackChunkName: "fail" */ '@/views/exception/404'),
-  Exception500: () => import(/* webpackChunkName: "fail" */ '@/views/exception/500'),
-
-  // 'TestWork': () => import(/* webpackChunkName: "TestWork" */ '@/views/dashboard/TestWork')
-}
-
-// 前端未找到页面路由（固定不用改）
-const notFoundRouter = {
-  path: '*',
-  redirect: '/404',
-  hidden: true
-}
-
-// 根级菜单
-const rootRouter = {
-  key: '',
-  name: 'index',
-  path: '',
-  component: 'BasicLayout',
-  redirect: '/dashboard',
-  meta: {
-    title: '首页'
-  },
-  children: []
-}
-
-// export const generatorStaticRouter = () => {
-
-// }
-
-/**
- * 动态生成菜单
- * @param token
- * @returns {Promise<Router>}
- */
-export const generatorDynamicRouter = token => {
-  return new Promise((resolve, reject) => {
-    loginService
-      .getCurrentUserNav(token)
-      .then(res => {
-        console.log('generatorDynamicRouter response:', res)
-        const { result } = res
-        const menuNav = []
-        const childrenNav = []
-        //      后端数据, 根级树数组,  根级 PID
-        listToTree(result, childrenNav, 0)
-        rootRouter.children = childrenNav
-        menuNav.push(rootRouter)
-        console.log('menuNav', menuNav)
-        const routers = generator(menuNav)
-        routers.push(notFoundRouter)
-        console.log('routers', routers)
-        resolve(routers)
-      })
-      .catch(err => {
-        reject(err)
-      })
-  })
-}
-
-/**
- * 格式化树形结构数据 生成 vue-router 层级路由表
- *
- * @param routerMap
- * @param parent
- * @returns {*}
- */
-export const generator = (routerMap, parent) => {
-  return routerMap.map(item => {
-    const { title, show, hideChildren, hiddenHeaderContent, target, icon } = item.meta || {}
-    const currentRouter = {
-      // 如果路由设置了 path，则作为默认 path，否则 路由地址 动态拼接生成如 /dashboard/workplace
-      path: item.path || `${(parent && parent.path) || ''}/${item.key}`,
-      // 路由名称，建议唯一
-      name: item.name || item.key || '',
-      // 该路由对应页面的 组件 :方案1
-      // component: constantRouterComponents[item.component || item.key],
-      // 该路由对应页面的 组件 :方案2 (动态加载)
-      component: constantRouterComponents[item.component || item.key] || (() => import(`@/views/${item.component}`)),
-
-      // meta: 页面标题, 菜单图标, 页面权限(供指令权限用，可去掉)
-      meta: {
-        title: title,
-        icon: icon || undefined,
-        hiddenHeaderContent: hiddenHeaderContent,
-        target: target,
-        permission: item.name
-      }
-    }
-    // 是否设置了隐藏菜单
-    if (show === false) {
-      currentRouter.hidden = true
-    }
-    // 是否设置了隐藏子菜单
-    if (hideChildren) {
-      currentRouter.hideChildrenInMenu = true
-    }
-    // 为了防止出现后端返回结果不规范，处理有可能出现拼接出两个 反斜杠
-    if (!currentRouter.path.startsWith('http')) {
-      currentRouter.path = currentRouter.path.replace('//', '/')
-    }
-    // 重定向
-    item.redirect && (currentRouter.redirect = item.redirect)
-    // 是否有子菜单，并递归处理
-    if (item.children && item.children.length > 0) {
-      // Recursion
-      currentRouter.children = generator(item.children, currentRouter)
-    }
-    return currentRouter
-  })
-}
-
-/**
- * 数组转树形结构
- * @param list 源数组
- * @param tree 树
- * @param parentId 父ID
- */
-const listToTree = (list, tree, parentId) => {
-  list.forEach(item => {
-    // 判断是否为父级菜单
-    if (item.parentId === parentId) {
-      const child = {
-        ...item,
-        key: item.key || item.name,
-        children: []
-      }
-      // 迭代 list， 找到当前菜单相符合的所有子菜单
-      listToTree(list, child.children, item.id)
-      // 删掉不存在 children 值的属性
-      if (child.children.length <= 0) {
-        delete child.children
-      }
-      // 加入到树中
-      tree.push(child)
-    }
-  })
-}

src/store/modules/async-router.js

@@ -1,33 +0,0 @@
-/**
- * 向后端请求用户的菜单，动态生成路由
- */
-import { constantRouterMap } from '@/config/router.config'
-import { generatorDynamicRouter } from '@/router/generator-routers'
-
-const permission = {
-  state: {
-    routers: constantRouterMap,
-    addRouters: []
-  },
-  mutations: {
-    SET_ROUTERS: (state, routers) => {
-      state.addRouters = routers
-      state.routers = constantRouterMap.concat(routers)
-    }
-  },
-  actions: {
-    GenerateRoutes ({ commit }, data) {
-      return new Promise((resolve, reject) => {
-        const { token } = data
-        generatorDynamicRouter(token).then(routers => {
-          commit('SET_ROUTERS', routers)
-          resolve()
-        }).catch(e => {
-          reject(e)
-        })
-      })
-    }
-  }
-}
-
-export default permission

src/views/form/advancedForm/AdvancedForm.vue

@@ -1,330 +0,0 @@
-<template>
-  <page-header-wrapper content="高级表单常见于一次性输入和提交大批量数据的场景">
-    <a-card class="card" title="仓库管理" :bordered="false">
-      <repository-form ref="repository" :showSubmit="false" />
-    </a-card>
-    <a-card class="card" title="任务管理" :bordered="false">
-      <task-form ref="task" :showSubmit="false" />
-    </a-card>
-
-    <!-- table -->
-    <a-card>
-      <a-table
-        :columns="columns"
-        :dataSource="data"
-        :pagination="false"
-        :loading="memberLoading"
-      >
-        <template v-for="(col, i) in ['name', 'workId', 'department']" :slot="col" slot-scope="text, record">
-          <a-input
-            :key="col"
-            v-if="record.editable"
-            style="margin: -5px 0"
-            :value="text"
-            :placeholder="columns[i].title"
-            @change="e => handleChange(e.target.value, record.key, col)"
-          />
-          <template v-else>{{ text }}</template>
-        </template>
-        <template slot="operation" slot-scope="text, record">
-          <template v-if="record.editable">
-            <span v-if="record.isNew">
-              <a @click="saveRow(record)">添加</a>
-              <a-divider type="vertical" />
-              <a-popconfirm title="是否要删除此行？" @confirm="remove(record.key)">
-                <a>删除</a>
-              </a-popconfirm>
-            </span>
-            <span v-else>
-              <a @click="saveRow(record)">保存</a>
-              <a-divider type="vertical" />
-              <a @click="cancel(record.key)">取消</a>
-            </span>
-          </template>
-          <span v-else>
-            <a @click="toggle(record.key)">编辑</a>
-            <a-divider type="vertical" />
-            <a-popconfirm title="是否要删除此行？" @confirm="remove(record.key)">
-              <a>删除</a>
-            </a-popconfirm>
-          </span>
-        </template>
-      </a-table>
-      <a-button style="width: 100%; margin-top: 16px; margin-bottom: 8px" type="dashed" icon="plus" @click="newMember">新增成员</a-button>
-    </a-card>
-
-    <!-- fixed footer toolbar -->
-    <footer-tool-bar :is-mobile="isMobile" :collapsed="sideCollapsed">
-      <span class="popover-wrapper">
-        <a-popover title="表单校验信息" overlayClassName="antd-pro-pages-forms-style-errorPopover" trigger="click" :getPopupContainer="trigger => trigger.parentNode">
-          <template slot="content">
-            <li v-for="item in errors" :key="item.key" @click="scrollToField(item.key)" class="antd-pro-pages-forms-style-errorListItem">
-              <a-icon type="cross-circle-o" class="antd-pro-pages-forms-style-errorIcon" />
-              <div class="">{{ item.message }}</div>
-              <div class="antd-pro-pages-forms-style-errorField">{{ item.fieldLabel }}</div>
-            </li>
-          </template>
-          <span class="antd-pro-pages-forms-style-errorIcon" v-if="errors.length > 0">
-            <a-icon type="exclamation-circle" />{{ errors.length }}
-          </span>
-        </a-popover>
-      </span>
-      <a-button type="primary" @click="validate" :loading="loading">提交</a-button>
-    </footer-tool-bar>
-  </page-header-wrapper>
-</template>
-
-<script>
-import RepositoryForm from './RepositoryForm'
-import TaskForm from './TaskForm'
-import FooterToolBar from '@/components/FooterToolbar'
-import { baseMixin } from '@/store/app-mixin'
-
-const fieldLabels = {
-  name: '仓库名',
-  url: '仓库域名',
-  owner: '仓库管理员',
-  approver: '审批人',
-  dateRange: '生效日期',
-  type: '仓库类型',
-  name2: '任务名',
-  url2: '任务描述',
-  owner2: '执行人',
-  approver2: '责任人',
-  dateRange2: '生效日期',
-  type2: '任务类型'
-}
-
-export default {
-  name: 'AdvancedForm',
-  mixins: [baseMixin],
-  components: {
-    FooterToolBar,
-    RepositoryForm,
-    TaskForm
-  },
-  data () {
-    return {
-      loading: false,
-      memberLoading: false,
-
-      // table
-      columns: [
-        {
-          title: '成员姓名',
-          dataIndex: 'name',
-          key: 'name',
-          width: '20%',
-          scopedSlots: { customRender: 'name' }
-        },
-        {
-          title: '工号',
-          dataIndex: 'workId',
-          key: 'workId',
-          width: '20%',
-          scopedSlots: { customRender: 'workId' }
-        },
-        {
-          title: '所属部门',
-          dataIndex: 'department',
-          key: 'department',
-          width: '40%',
-          scopedSlots: { customRender: 'department' }
-        },
-        {
-          title: '操作',
-          key: 'action',
-          scopedSlots: { customRender: 'operation' }
-        }
-      ],
-      data: [
-        {
-          key: '1',
-          name: '小明',
-          workId: '001',
-          editable: false,
-          department: '行政部'
-        },
-        {
-          key: '2',
-          name: '李莉',
-          workId: '002',
-          editable: false,
-          department: 'IT部'
-        },
-        {
-          key: '3',
-          name: '王小帅',
-          workId: '003',
-          editable: false,
-          department: '财务部'
-        }
-      ],
-
-      errors: []
-    }
-  },
-  methods: {
-    handleSubmit (e) {
-      e.preventDefault()
-    },
-    newMember () {
-      const length = this.data.length
-      this.data.push({
-        key: length === 0 ? '1' : (parseInt(this.data[length - 1].key) + 1).toString(),
-        name: '',
-        workId: '',
-        department: '',
-        editable: true,
-        isNew: true
-      })
-    },
-    remove (key) {
-      const newData = this.data.filter(item => item.key !== key)
-      this.data = newData
-    },
-    saveRow (record) {
-      this.memberLoading = true
-      const { key, name, workId, department } = record
-      if (!name || !workId || !department) {
-        this.memberLoading = false
-        this.$message.error('请填写完整成员信息。')
-        return
-      }
-      // 模拟网络请求、卡顿 800ms
-      new Promise((resolve) => {
-        setTimeout(() => {
-          resolve({ loop: false })
-        }, 800)
-      }).then(() => {
-        const target = this.data.find(item => item.key === key)
-        target.editable = false
-        target.isNew = false
-        this.memberLoading = false
-      })
-    },
-    toggle (key) {
-      const target = this.data.find(item => item.key === key)
-      target._originalData = { ...target }
-      target.editable = !target.editable
-    },
-    getRowByKey (key, newData) {
-      const data = this.data
-      return (newData || data).find(item => item.key === key)
-    },
-    cancel (key) {
-      const target = this.data.find(item => item.key === key)
-      Object.keys(target).forEach(key => { target[key] = target._originalData[key] })
-      target._originalData = undefined
-    },
-    handleChange (value, key, column) {
-      const newData = [...this.data]
-      const target = newData.find(item => key === item.key)
-      if (target) {
-        target[column] = value
-        this.data = newData
-      }
-    },
-
-    // 最终全页面提交
-    validate () {
-      const { $refs: { repository, task }, $notification } = this
-      const repositoryForm = new Promise((resolve, reject) => {
-        repository.form.validateFields((err, values) => {
-          if (err) {
-            reject(err)
-            return
-          }
-          resolve(values)
-        })
-      })
-      const taskForm = new Promise((resolve, reject) => {
-        task.form.validateFields((err, values) => {
-          if (err) {
-            reject(err)
-            return
-          }
-          resolve(values)
-        })
-      })
-
-      // clean this.errors
-      this.errors = []
-      Promise.all([repositoryForm, taskForm]).then(values => {
-        $notification['error']({
-          message: 'Received values of form:',
-          description: JSON.stringify(values)
-        })
-      }).catch(() => {
-        const errors = Object.assign({}, repository.form.getFieldsError(), task.form.getFieldsError())
-        const tmp = { ...errors }
-        this.errorList(tmp)
-      })
-    },
-    errorList (errors) {
-      if (!errors || errors.length === 0) {
-        return
-      }
-      this.errors = Object.keys(errors)
-        .filter(key => errors[key])
-        .map(key => ({
-          key: key,
-          message: errors[key][0],
-          fieldLabel: fieldLabels[key]
-        }))
-    },
-    scrollToField (fieldKey) {
-      const labelNode = document.querySelector(`label[for="${fieldKey}"]`)
-      if (labelNode) {
-        labelNode.scrollIntoView(true)
-      }
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-  .card{
-    margin-bottom: 24px;
-  }
-  .popover-wrapper {
-    :deep(.antd-pro-pages-forms-style-errorPopover .ant-popover-inner-content) {
-      min-width: 256px;
-      max-height: 290px;
-      padding: 0;
-      overflow: auto;
-    }
-  }
-  .antd-pro-pages-forms-style-errorIcon {
-    user-select: none;
-    margin-right: 24px;
-    color: #f5222d;
-    cursor: pointer;
-    i {
-          margin-right: 4px;
-    }
-  }
-  .antd-pro-pages-forms-style-errorListItem {
-    padding: 8px 16px;
-    list-style: none;
-    border-bottom: 1px solid #e8e8e8;
-    cursor: pointer;
-    transition: all .3s;
-
-    &:hover {
-      background: #e6f7ff;
-    }
-    .antd-pro-pages-forms-style-errorIcon {
-      float: left;
-      margin-top: 4px;
-      margin-right: 12px;
-      padding-bottom: 22px;
-      color: #f5222d;
-    }
-    .antd-pro-pages-forms-style-errorField {
-      margin-top: 2px;
-      color: rgba(0,0,0,.45);
-      font-size: 12px;
-    }
-  }
-</style>

src/views/form/advancedForm/RepositoryForm.vue

@@ -1,119 +0,0 @@
-<template>
-  <a-form @submit="handleSubmit" :form="form" class="form">
-    <a-row class="form-row" :gutter="16">
-      <a-col :lg="6" :md="12" :sm="24">
-        <a-form-item label="仓库名">
-          <a-input
-            placeholder="请输入仓库名称"
-            v-decorator="[
-              'name',
-              {rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
-            ]" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-        <a-form-item
-          label="仓库域名">
-          <a-input
-            addonBefore="http://"
-            addonAfter=".com"
-            placeholder="请输入"
-            v-decorator="[
-              'url',
-              {rules: [{ required: true, message: '请输入仓库域名', whitespace: true}, {validator: validate}]}
-            ]" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-        <a-form-item
-          label="仓库管理员">
-          <a-select placeholder="请选择管理员" v-decorator="[ 'owner', {rules: [{ required: true, message: '请选择管理员'}]} ]">
-            <a-select-option value="王同学">王同学</a-select-option>
-            <a-select-option value="李同学">李同学</a-select-option>
-            <a-select-option value="黄同学">黄同学</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row class="form-row" :gutter="16">
-      <a-col :lg="6" :md="12" :sm="24">
-        <a-form-item
-          label="审批人">
-          <a-select placeholder="请选择审批员" v-decorator="[ 'approver', {rules: [{ required: true, message: '请选择审批员'}]} ]">
-            <a-select-option value="王晓丽">王晓丽</a-select-option>
-            <a-select-option value="李军">李军</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-        <a-form-item
-          label="生效日期">
-          <a-range-picker
-            style="width: 100%"
-            v-decorator="[
-              'dateRange',
-              {rules: [{ required: true, message: '请选择生效日期'}]}
-            ]" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-        <a-form-item
-          label="仓库类型">
-          <a-select
-            placeholder="请选择仓库类型"
-            v-decorator="[
-              'type',
-              {rules: [{ required: true, message: '请选择仓库类型'}]}
-            ]" >
-            <a-select-option value="公开">公开</a-select-option>
-            <a-select-option value="私密">私密</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-form-item v-if="showSubmit">
-      <a-button htmlType="submit" >Submit</a-button>
-    </a-form-item>
-  </a-form>
-</template>
-
-<script>
-export default {
-  name: 'RepositoryForm',
-  props: {
-    showSubmit: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data () {
-    return {
-      form: this.$form.createForm(this)
-    }
-  },
-  methods: {
-    handleSubmit (e) {
-      e.preventDefault()
-      this.form.validateFields((err, values) => {
-        if (!err) {
-          this.$notification['error']({
-            message: 'Received values of form:',
-            description: values
-          })
-        }
-      })
-    },
-    validate (rule, value, callback) {
-      const regex = /^user-(.*)$/
-      if (!regex.test(value)) {
-        callback(new Error('需要以 user- 开头'))
-      }
-      callback()
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/form/advancedForm/TaskForm.vue

@@ -1,107 +0,0 @@
-<template>
-  <a-form @submit="handleSubmit" :form="form" class="form">
-    <a-row class="form-row" :gutter="16">
-      <a-col :lg="6" :md="12" :sm="24">
-        <a-form-item
-          label="任务名">
-          <a-input placeholder="请输入任务名称" v-decorator="[ 'name2', {rules: [{ required: true, message: '请输入任务名称', whitespace: true}]} ]" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-        <a-form-item
-          label="任务描述">
-          <a-input placeholder="请输入任务描述" v-decorator="[ 'url2', {rules: [{ required: true, message: '请输入任务描述', whitespace: true}]} ]" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-        <a-form-item
-          label="执行人">
-          <a-select
-            placeholder="请选择执行人"
-            v-decorator="[
-              'owner2',
-              {rules: [{ required: true, message: '请选择执行人'}]}
-            ]" >
-            <a-select-option value="黄丽丽">黄丽丽</a-select-option>
-            <a-select-option value="李大刀">李大刀</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row class="form-row" :gutter="16">
-      <a-col :lg="6" :md="12" :sm="24">
-        <a-form-item
-          label="责任人">
-          <a-select
-            placeholder="请选择责任人"
-            v-decorator="[
-              'approver2',
-              {rules: [{ required: true, message: '请选择责任人'}]}
-            ]" >
-            <a-select-option value="王伟">王伟</a-select-option>
-            <a-select-option value="李红军">李红军</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-        <a-form-item
-          label="提醒时间">
-          <a-time-picker
-            style="width: 100%"
-            v-decorator="[
-              'dateRange2',
-              {rules: [{ required: true, message: '请选择提醒时间'}]}
-            ]" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-        <a-form-item
-          label="任务类型">
-          <a-select
-            placeholder="请选择任务类型"
-            v-decorator="[ 'type2', {rules: [{ required: true, message: '请选择任务类型'}]} ]" >
-            <a-select-option value="定时执行">定时执行</a-select-option>
-            <a-select-option value="周期执行">周期执行</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-form-item v-if="showSubmit">
-      <a-button htmlType="submit" >Submit</a-button>
-    </a-form-item>
-  </a-form>
-</template>
-
-<script>
-export default {
-  name: 'TaskForm',
-  props: {
-    showSubmit: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data () {
-    return {
-      form: this.$form.createForm(this)
-    }
-  },
-  methods: {
-    handleSubmit (e) {
-      e.preventDefault()
-      this.form.validateFields((err, values) => {
-        if (!err) {
-          this.$notification['error']({
-            message: 'Received values of form:',
-            description: values
-          })
-        }
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/form/basicForm/index.vue

@@ -1,134 +0,0 @@
-<template>
-  <!-- hidden PageHeaderWrapper title demo -->
-  <page-header-wrapper :title="false" :content="$t('form.basic-form.basic.description')">
-    <a-card :body-style="{padding: '24px 32px'}" :bordered="false">
-      <a-form @submit="handleSubmit" :form="form">
-        <a-form-item
-          :label="$t('form.basic-form.title.label')"
-          :labelCol="{lg: {span: 7}, sm: {span: 7}}"
-          :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
-          <a-input
-            v-decorator="[
-              'name',
-              {rules: [{ required: true, message: $t('form.basic-form.title.required') }]}
-            ]"
-            name="name"
-            :placeholder="$t('form.basic-form.title.placeholder')" />
-        </a-form-item>
-        <a-form-item
-          :label="$t('form.basic-form.date.label')"
-          :labelCol="{lg: {span: 7}, sm: {span: 7}}"
-          :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
-          <a-range-picker
-            name="buildTime"
-            style="width: 100%"
-            v-decorator="[
-              'buildTime',
-              {rules: [{ required: true, message: $t('form.basic-form.date.required') }]}
-            ]" />
-        </a-form-item>
-        <a-form-item
-          :label="$t('form.basic-form.goal.label')"
-          :labelCol="{lg: {span: 7}, sm: {span: 7}}"
-          :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
-          <a-textarea
-            rows="4"
-            :placeholder="$t('form.basic-form.goal.placeholder')"
-            v-decorator="[
-              'description',
-              {rules: [{ required: true, message: $t('form.basic-form.goal.required') }]}
-            ]" />
-        </a-form-item>
-        <a-form-item
-          :label="$t('form.basic-form.standard.label')"
-          :labelCol="{lg: {span: 7}, sm: {span: 7}}"
-          :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
-          <a-textarea
-            rows="4"
-            :placeholder="$t('form.basic-form.standard.placeholder')"
-            v-decorator="[
-              'type',
-              {rules: [{ required: true, message: $t('form.basic-form.standard.required') }]}
-            ]" />
-        </a-form-item>
-        <a-form-item
-          :label="$t('form.basic-form.client.label')"
-          :labelCol="{lg: {span: 7}, sm: {span: 7}}"
-          :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
-          <a-input
-            :placeholder="$t('form.basic-form.client.placeholder')"
-            v-decorator="[
-              'customer',
-              {rules: [{ required: true, message: $t('form.basic-form.client.required') }]}
-            ]" />
-        </a-form-item>
-        <a-form-item
-          :label="$t('form.basic-form.invites.label')"
-          :labelCol="{lg: {span: 7}, sm: {span: 7}}"
-          :wrapperCol="{lg: {span: 10}, sm: {span: 17} }"
-          :required="false"
-        >
-          <a-input :placeholder="$t('form.basic-form.invites.placeholder')" />
-        </a-form-item>
-        <a-form-item
-          :label="$t('form.basic-form.weight.label')"
-          :labelCol="{lg: {span: 7}, sm: {span: 7}}"
-          :wrapperCol="{lg: {span: 10}, sm: {span: 17} }"
-          :required="false"
-        >
-          <a-input-number :min="0" :max="100" />
-          <span> %</span>
-        </a-form-item>
-        <a-form-item
-          :label="$t('form.basic-form.public.label')"
-          :labelCol="{lg: {span: 7}, sm: {span: 7}}"
-          :wrapperCol="{lg: {span: 10}, sm: {span: 17} }"
-          :required="false"
-          :help="$t('form.basic-form.label.help')"
-        >
-          <a-radio-group v-decorator="['target', { initialValue: 1 }]">
-            <a-radio :value="1">{{ $t('form.basic-form.radio.public') }}</a-radio>
-            <a-radio :value="2">{{ $t('form.basic-form.radio.partially-public') }}</a-radio>
-            <a-radio :value="3">{{ $t('form.basic-form.radio.private') }}</a-radio>
-          </a-radio-group>
-          <a-form-item v-show="form.getFieldValue('target') === 2">
-            <a-select mode="multiple">
-              <a-select-option value="4">{{ $t('form.basic-form.option.A') }}</a-select-option>
-              <a-select-option value="5">{{ $t('form.basic-form.option.B') }}</a-select-option>
-              <a-select-option value="6">{{ $t('form.basic-form.option.C') }}</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-form-item>
-        <a-form-item
-          :wrapperCol="{ span: 24 }"
-          style="text-align: center"
-        >
-          <a-button htmlType="submit" type="primary">{{ $t('form.basic-form.form.submit') }}</a-button>
-          <a-button style="margin-left: 8px">{{ $t('form.basic-form.form.save') }}</a-button>
-        </a-form-item>
-      </a-form>
-    </a-card>
-  </page-header-wrapper>
-</template>
-
-<script>
-export default {
-  name: 'BaseForm',
-  data () {
-    return {
-      form: this.$form.createForm(this)
-    }
-  },
-  methods: {
-    // handler
-    handleSubmit (e) {
-      e.preventDefault()
-      this.form.validateFields((err, values) => {
-        if (!err) {
-          console.log('Received values of form: ', values)
-        }
-      })
-    }
-  }
-}
-</script>

src/views/form/stepForm/Step1.vue

@@ -1,112 +0,0 @@
-<template>
-  <div>
-    <a-form :form="form" style="max-width: 500px; margin: 40px auto 0;">
-      <a-form-item
-        label="付款账户"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-      >
-        <a-select
-          placeholder="ant-design@alipay.com"
-          v-decorator="['paymentUser', { rules: [{required: true, message: '付款账户必须填写'}] }]">
-          <a-select-option value="1">ant-design@alipay.com</a-select-option>
-        </a-select>
-      </a-form-item>
-      <a-form-item
-        label="收款账户"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-      >
-        <a-input-group
-          style="display: inline-block; vertical-align: middle"
-          :compact="true"
-        >
-          <a-select defaultValue="alipay" style="width: 100px">
-            <a-select-option value="alipay">支付宝</a-select-option>
-            <a-select-option value="wexinpay">微信</a-select-option>
-          </a-select>
-          <a-input
-            :style="{width: 'calc(100% - 100px)'}"
-            v-decorator="['payType', { initialValue: 'test@example.com', rules: [{required: true, message: '收款账户必须填写'}]}]"
-          />
-        </a-input-group>
-      </a-form-item>
-      <a-form-item
-        label="收款人姓名"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-      >
-        <a-input v-decorator="['name', { initialValue: 'Alex', rules: [{required: true, message: '收款人名称必须核对'}] }]"/>
-      </a-form-item>
-      <a-form-item
-        label="转账金额"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-      >
-        <a-input prefix="￥" v-decorator="['momey', { initialValue: '5000', rules: [{required: true, message: '转账金额必须填写'}] }]"/>
-      </a-form-item>
-      <a-form-item :wrapperCol="{span: 19, offset: 5}">
-        <a-button type="primary" @click="nextStep">下一步</a-button>
-      </a-form-item>
-    </a-form>
-    <a-divider />
-    <div class="step-form-style-desc">
-      <h3>说明</h3>
-      <h4>转账到支付宝账户</h4>
-      <p>如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。</p>
-      <h4>转账到银行卡</h4>
-      <p>如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。</p>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Step1',
-  data () {
-    return {
-      labelCol: { lg: { span: 5 }, sm: { span: 5 } },
-      wrapperCol: { lg: { span: 19 }, sm: { span: 19 } },
-      form: this.$form.createForm(this)
-    }
-  },
-  methods: {
-    nextStep () {
-      const { form: { validateFields } } = this
-      // 先校验，通过表单校验后，才进入下一步
-      validateFields((err, values) => {
-        if (!err) {
-          this.$emit('nextStep')
-        }
-      })
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.step-form-style-desc {
-  padding: 0 56px;
-  color: rgba(0,0,0,.45);
-
-  h3 {
-    margin: 0 0 12px;
-    color: rgba(0,0,0,.45);
-    font-size: 16px;
-    line-height: 32px;
-  }
-
-  h4 {
-    margin: 0 0 4px;
-    color: rgba(0,0,0,.45);
-    font-size: 14px;
-    line-height: 22px;
-  }
-
-  p {
-    margin-top: 0;
-    margin-bottom: 12px;
-    line-height: 22px;
-  }
-}
-</style>

src/views/form/stepForm/Step2.vue

@@ -1,110 +0,0 @@
-<template>
-  <div>
-    <a-form :form="form" style="max-width: 500px; margin: 40px auto 0;">
-      <a-alert
-        :closable="true"
-        message="确认转账后，资金将直接打入对方账户，无法退回。"
-        style="margin-bottom: 24px;"
-      />
-      <a-form-item
-        label="付款账户"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        class="stepFormText"
-      >
-        ant-design@alipay.com
-      </a-form-item>
-      <a-form-item
-        label="收款账户"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        class="stepFormText"
-      >
-        test@example.com
-      </a-form-item>
-      <a-form-item
-        label="收款人姓名"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        class="stepFormText"
-      >
-        Alex
-      </a-form-item>
-      <a-form-item
-        label="转账金额"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        class="stepFormText"
-      >
-        ￥ 5,000.00
-      </a-form-item>
-      <a-divider />
-      <a-form-item
-        label="支付密码"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        class="stepFormText"
-      >
-        <a-input
-          type="password"
-          style="width: 80%;"
-          v-decorator="['paymentPassword', { initialValue: '123456', rules: [{required: true, message: '请输入支付密码'}] }]" />
-      </a-form-item>
-      <a-form-item :wrapperCol="{span: 19, offset: 5}">
-        <a-button :loading="loading" type="primary" @click="nextStep">提交</a-button>
-        <a-button style="margin-left: 8px" @click="prevStep">上一步</a-button>
-      </a-form-item>
-    </a-form>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Step2',
-  data () {
-    return {
-      labelCol: { lg: { span: 5 }, sm: { span: 5 } },
-      wrapperCol: { lg: { span: 19 }, sm: { span: 19 } },
-      form: this.$form.createForm(this),
-      loading: false,
-      timer: 0
-    }
-  },
-  methods: {
-    nextStep () {
-      const that = this
-      const { form: { validateFields } } = this
-      that.loading = true
-      validateFields((err, values) => {
-        if (!err) {
-          console.log('表单 values', values)
-          that.timer = setTimeout(function () {
-            that.loading = false
-            that.$emit('nextStep')
-          }, 1500)
-        } else {
-          that.loading = false
-        }
-      })
-    },
-    prevStep () {
-      this.$emit('prevStep')
-    }
-  },
-  beforeDestroy () {
-    clearTimeout(this.timer)
-  }
-}
-</script>
-
-<style lang="less" scoped>
-  .stepFormText {
-    margin-bottom: 24px;
-
-    .ant-form-item-label,
-    .ant-form-item-control {
-      line-height: 22px;
-    }
-  }
-
-</style>

src/views/form/stepForm/Step3.vue

@@ -1,64 +0,0 @@
-<template>
-  <div>
-    <a-form>
-      <a-result title="操作成功" :is-success="true" sub-title="预计两小时内到账" style="max-width: 560px; margin: 40px auto 0;">
-        <div class="information">
-          <a-row>
-            <a-col :sm="8" :xs="24">付款账户：</a-col>
-            <a-col :sm="16" :xs="24">ant-design@alipay.com</a-col>
-          </a-row>
-          <a-row>
-            <a-col :sm="8" :xs="24">收款账户：</a-col>
-            <a-col :sm="16" :xs="24">test@example.com</a-col>
-          </a-row>
-          <a-row>
-            <a-col :sm="8" :xs="24">收款人姓名：</a-col>
-            <a-col :sm="16" :xs="24">辉夜</a-col>
-          </a-row>
-          <a-row>
-            <a-col :sm="8" :xs="24">转账金额：</a-col>
-            <a-col :sm="16" :xs="24"><span class="money">500</span> 元</a-col>
-          </a-row>
-        </div>
-        <template #extra>
-          <a-button type="primary" @click="finish">再转一笔</a-button>
-          <a-button style="margin-left: 8px" @click="toOrderList">查看账单</a-button>
-        </template>
-      </a-result>
-    </a-form>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Step3',
-  data () {
-    return {
-      loading: false
-    }
-  },
-  methods: {
-    finish () {
-      this.$emit('finish')
-    },
-    toOrderList () {
-      this.$router.push('/list/table-list')
-    }
-  }
-}
-</script>
-<style lang="less" scoped>
-  .information {
-    line-height: 22px;
-
-    .ant-row:not(:last-child) {
-      margin-bottom: 24px;
-    }
-  }
-  .money {
-    font-family: "Helvetica Neue",sans-serif;
-    font-weight: 500;
-    font-size: 20px;
-    line-height: 14px;
-  }
-</style>

src/views/form/stepForm/StepForm.vue

@@ -1,66 +0,0 @@
-<template>
-  <page-header-wrapper>
-    <!-- PageHeader 第二种使用方式 (v-slot) -->
-    <template v-slot:content>
-      将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。
-    </template>
-    <a-card :bordered="false">
-      <a-steps class="steps" :current="currentTab">
-        <a-step title="填写转账信息" />
-        <a-step title="确认转账信息" />
-        <a-step title="完成" />
-      </a-steps>
-      <div class="content">
-        <step1 v-if="currentTab === 0" @nextStep="nextStep"/>
-        <step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep"/>
-        <step3 v-if="currentTab === 2" @prevStep="prevStep" @finish="finish"/>
-      </div>
-    </a-card>
-  </page-header-wrapper>
-</template>
-
-<script>
-import Step1 from './Step1'
-import Step2 from './Step2'
-import Step3 from './Step3'
-
-export default {
-  name: 'StepForm',
-  components: {
-    Step1,
-    Step2,
-    Step3
-  },
-  data () {
-    return {
-      currentTab: 0,
-      // form
-      form: null
-    }
-  },
-  methods: {
-
-    // handler
-    nextStep () {
-      if (this.currentTab < 2) {
-        this.currentTab += 1
-      }
-    },
-    prevStep () {
-      if (this.currentTab > 0) {
-        this.currentTab -= 1
-      }
-    },
-    finish () {
-      this.currentTab = 0
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-  .steps {
-    max-width: 750px;
-    margin: 16px auto;
-  }
-</style>

src/views/list/BasicList.vue

@@ -1,220 +0,0 @@
-<template>
-  <page-header-wrapper>
-    <a-card :bordered="false">
-      <a-row>
-        <a-col :sm="8" :xs="24">
-          <info title="我的待办" value="8个任务" :bordered="true" />
-        </a-col>
-        <a-col :sm="8" :xs="24">
-          <info title="本周任务平均处理时间" value="32分钟" :bordered="true" />
-        </a-col>
-        <a-col :sm="8" :xs="24">
-          <info title="本周完成任务数" value="24个" />
-        </a-col>
-      </a-row>
-    </a-card>
-
-    <a-card
-      style="margin-top: 24px"
-      :bordered="false"
-      title="标准列表">
-
-      <div slot="extra">
-        <a-radio-group v-model="status">
-          <a-radio-button value="all">全部</a-radio-button>
-          <a-radio-button value="processing">进行中</a-radio-button>
-          <a-radio-button value="waiting">等待中</a-radio-button>
-        </a-radio-group>
-        <a-input-search style="margin-left: 16px; width: 272px;" />
-      </div>
-
-      <div class="operate">
-        <a-button type="dashed" style="width: 100%" icon="plus" @click="add">添加</a-button>
-      </div>
-
-      <a-list size="large" :pagination="{showSizeChanger: true, showQuickJumper: true, pageSize: 5, total: 50}">
-        <a-list-item :key="index" v-for="(item, index) in data">
-          <a-list-item-meta :description="item.description">
-            <a-avatar slot="avatar" size="large" shape="square" :src="item.avatar"/>
-            <a slot="title">{{ item.title }}</a>
-          </a-list-item-meta>
-          <div slot="actions">
-            <a @click="edit(item)">编辑</a>
-          </div>
-          <div slot="actions">
-            <a-dropdown>
-              <a-menu slot="overlay">
-                <a-menu-item><a>编辑</a></a-menu-item>
-                <a-menu-item><a>删除</a></a-menu-item>
-              </a-menu>
-              <a>更多<a-icon type="down"/></a>
-            </a-dropdown>
-          </div>
-          <div class="list-content">
-            <div class="list-content-item">
-              <span>Owner</span>
-              <p>{{ item.owner }}</p>
-            </div>
-            <div class="list-content-item">
-              <span>开始时间</span>
-              <p>{{ item.startAt }}</p>
-            </div>
-            <div class="list-content-item">
-              <a-progress :percent="item.progress.value" :status="!item.progress.status ? null : item.progress.status" style="width: 180px" />
-            </div>
-          </div>
-        </a-list-item>
-      </a-list>
-    </a-card>
-  </page-header-wrapper>
-</template>
-
-<script>
-// 演示如何使用 this.$dialog 封装 modal 组件
-import TaskForm from './modules/TaskForm'
-import Info from './components/Info'
-
-const data = []
-data.push({
-  title: 'Alipay',
-  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/WdGqmHpayyMjiEhcKoVE.png',
-  description: '那是一种内在的东西， 他们到达不了，也无法触及的',
-  owner: '付晓晓',
-  startAt: '2018-07-26 22:44',
-  progress: {
-    value: 90
-  }
-})
-data.push({
-  title: 'Angular',
-  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/zOsKZmFRdUtvpqCImOVY.png',
-  description: '希望是一个好东西，也许是最好的，好东西是不会消亡的',
-  owner: '曲丽丽',
-  startAt: '2018-07-26 22:44',
-  progress: {
-    value: 54
-  }
-})
-data.push({
-  title: 'Ant Design',
-  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/dURIMkkrRFpPgTuzkwnB.png',
-  description: '生命就像一盒巧克力，结果往往出人意料',
-  owner: '林东东',
-  startAt: '2018-07-26 22:44',
-  progress: {
-    value: 66
-  }
-})
-data.push({
-  title: 'AutoCDE',
-  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/sfjbOqnsXXJgNCjCzDBL.png',
-  description: '城镇中有那么多的酒馆，她却偏偏走进了我的酒馆',
-  owner: '周星星',
-  startAt: '2018-07-26 22:44',
-  progress: {
-    value: 30
-  }
-})
-data.push({
-  title: 'Bootstrap',
-  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/siCrBXXhmvTQGWPNLBow.png',
-  description: '那时候我只会想自己想要什么，从不想自己拥有什么',
-  owner: '吴加好',
-  startAt: '2018-07-26 22:44',
-  progress: {
-    status: 'exception',
-    value: 100
-  }
-})
-
-export default {
-  name: 'StandardList',
-  components: {
-    TaskForm,
-    Info
-  },
-  data () {
-    return {
-      data,
-      status: 'all'
-    }
-  },
-  methods: {
-    add () {
-      this.$dialog(TaskForm,
-        // component props
-        {
-          record: {},
-          on: {
-            ok () {
-              console.log('ok 回调')
-            },
-            cancel () {
-              console.log('cancel 回调')
-            },
-            close () {
-              console.log('modal close 回调')
-            }
-          }
-        },
-        // modal props
-        {
-          title: '新增',
-          width: 700,
-          centered: true,
-          maskClosable: false
-        })
-    },
-    edit (record) {
-      console.log('record', record)
-      this.$dialog(TaskForm,
-        // component props
-        {
-          record,
-          on: {
-            ok () {
-              console.log('ok 回调')
-            },
-            cancel () {
-              console.log('cancel 回调')
-            },
-            close () {
-              console.log('modal close 回调')
-            }
-          }
-        },
-        // modal props
-        {
-          title: '操作',
-          width: 700,
-          centered: true,
-          maskClosable: false
-        })
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.ant-avatar-lg {
-    width: 48px;
-    height: 48px;
-    line-height: 48px;
-}
-
-.list-content-item {
-    color: rgba(0, 0, 0, .45);
-    display: inline-block;
-    vertical-align: middle;
-    font-size: 14px;
-    margin-left: 40px;
-    span {
-        line-height: 20px;
-    }
-    p {
-        margin-top: 4px;
-        margin-bottom: 0;
-        line-height: 22px;
-    }
-}
-</style>

src/views/list/CardList.vue

@@ -1,152 +0,0 @@
-<template>
-  <page-header-wrapper
-    :tab-list="tabList"
-    :tab-active-key="tabActiveKey"
-    :tab-change="(key) => {
-      this.tabActiveKey = key
-    }"
-    content="段落示意：蚂蚁金服务设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态， 提供跨越设计与开发的体验解决方案。"
-  >
-    <template v-slot:extraContent>
-      <div style="width: 155px; margin-top: -20px;"><img style="width: 100%" :src="extraImage" /></div>
-    </template>
-    <a-list
-      rowKey="id"
-      :grid="{gutter: 24, lg: 3, md: 2, sm: 1, xs: 1}"
-      :dataSource="dataSource"
-      class="card-list"
-    >
-      <a-list-item slot="renderItem" slot-scope="item">
-        <template v-if="!item || item.id === undefined">
-          <a-button class="new-btn" type="dashed">
-            <a-icon type="plus"/>
-            新增产品
-          </a-button>
-        </template>
-        <template v-else>
-          <a-card :hoverable="true">
-            <a-card-meta>
-              <a slot="title">{{ item.title }}</a>
-              <a-avatar class="card-avatar" slot="avatar" :src="item.avatar" size="large"/>
-              <div class="meta-content" slot="description">{{ item.content }}</div>
-            </a-card-meta>
-            <template class="ant-card-actions" slot="actions">
-              <a>操作一</a>
-              <a>操作二</a>
-            </template>
-          </a-card>
-        </template>
-      </a-list-item>
-    </a-list>
-  </page-header-wrapper>
-</template>
-
-<script>
-
-const dataSource = []
-dataSource.push({})
-for (let i = 0; i < 11; i++) {
-  dataSource.push({
-    id: i,
-    title: 'Alipay',
-    avatar: 'https://gw.alipayobjects.com/zos/rmsportal/WdGqmHpayyMjiEhcKoVE.png',
-    content: '在中台产品的研发过程中，会出现不同的设计规范和实现方式，但其中往往存在很多类似的页面和组件，这些类似的组件会被抽离成一套标准规范。'
-  })
-}
-
-export default {
-  name: 'CardList',
-  data () {
-    this.tabList = [
-      { key: 'tab1', tab: '快速开始' },
-      { key: 'tab2', tab: '产品简介' },
-      { key: 'tab3', tab: '产品文档' }
-    ]
-    return {
-      tabActiveKey: 'tab1',
-
-      extraImage: 'https://gw.alipayobjects.com/zos/rmsportal/RzwpdLnhmvDJToTdfDPe.png',
-      dataSource
-    }
-  },
-  methods: {
-    testFun () {
-      this.$message.info('快速开始被点击！')
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-  @import "~@/components/index.less";
-
-  .card-list {
-    :deep(.ant-card-body:hover) {
-      .ant-card-meta-title>a {
-        color: @primary-color;
-      }
-    }
-
-    :deep(.ant-card-meta-title) {
-      margin-bottom: 12px;
-
-      &>a {
-        display: inline-block;
-        max-width: 100%;
-        color: rgba(0,0,0,.85);
-      }
-    }
-
-    :deep(.meta-content) {
-      position: relative;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      display: -webkit-box;
-      height: 64px;
-      -webkit-line-clamp: 3;
-      -webkit-box-orient: vertical;
-
-      margin-bottom: 1em;
-    }
-  }
-
-  .card-avatar {
-    width: 48px;
-    height: 48px;
-    border-radius: 48px;
-  }
-
-  .ant-card-actions {
-    background: #f7f9fa;
-
-    li {
-      float: left;
-      text-align: center;
-      margin: 12px 0;
-      color: rgba(0, 0, 0, 0.45);
-      width: 50%;
-
-      &:not(:last-child) {
-        border-right: 1px solid #e8e8e8;
-      }
-
-      a {
-        color: rgba(0, 0, 0, .45);
-        line-height: 22px;
-        display: inline-block;
-        width: 100%;
-        &:hover {
-          color: @primary-color;
-        }
-      }
-    }
-  }
-
-  .new-btn {
-    background-color: #fff;
-    border-radius: 2px;
-    width: 100%;
-    height: 188px;
-  }
-
-</style>

src/views/list/QueryList.vue

@@ -1,50 +0,0 @@
-<template>
-  <a-card :bordered="false">
-    <component @onEdit="handleEdit" @onGoBack="handleGoBack" :record="record" :is="currentComponet"></component>
-  </a-card>
-</template>
-
-<script>
-
-import ATextarea from 'ant-design-vue/es/input/TextArea'
-import AInput from 'ant-design-vue/es/input/Input'
-// 动态切换组件
-import List from '@/views/list/table/List'
-import Edit from '@/views/list/table/Edit'
-
-export default {
-  name: 'TableListWrapper',
-  components: {
-    AInput,
-    ATextarea,
-    List,
-    Edit
-  },
-  data () {
-    return {
-      currentComponet: 'List',
-      record: ''
-    }
-  },
-  created () {
-
-  },
-  methods: {
-    handleEdit (record) {
-      this.record = record || ''
-      this.currentComponet = 'Edit'
-      console.log(record)
-    },
-    handleGoBack () {
-      this.record = ''
-      this.currentComponet = 'List'
-    }
-  },
-  watch: {
-    '$route.path' () {
-      this.record = ''
-      this.currentComponet = 'List'
-    }
-  }
-}
-</script>

src/views/list/TableList.vue

@@ -1,317 +0,0 @@
-<template>
-  <page-header-wrapper>
-    <a-card :bordered="false">
-      <div class="table-page-search-wrapper">
-        <a-form layout="inline">
-          <a-row :gutter="48">
-            <a-col :md="8" :sm="24">
-              <a-form-item label="规则编号">
-                <a-input v-model="queryParam.id" placeholder="" />
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item label="使用状态">
-                <a-select v-model="queryParam.status" placeholder="请选择" default-value="0">
-                  <a-select-option value="0">全部</a-select-option>
-                  <a-select-option value="1">关闭</a-select-option>
-                  <a-select-option value="2">运行中</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <template v-if="advanced">
-              <a-col :md="8" :sm="24">
-                <a-form-item label="调用次数">
-                  <a-input-number v-model="queryParam.callNo" style="width: 100%" />
-                </a-form-item>
-              </a-col>
-              <a-col :md="8" :sm="24">
-                <a-form-item label="更新日期">
-                  <a-date-picker v-model="queryParam.date" style="width: 100%" placeholder="请输入更新日期" />
-                </a-form-item>
-              </a-col>
-              <a-col :md="8" :sm="24">
-                <a-form-item label="使用状态">
-                  <a-select v-model="queryParam.useStatus" placeholder="请选择" default-value="0">
-                    <a-select-option value="0">全部</a-select-option>
-                    <a-select-option value="1">关闭</a-select-option>
-                    <a-select-option value="2">运行中</a-select-option>
-                  </a-select>
-                </a-form-item>
-              </a-col>
-              <a-col :md="8" :sm="24">
-                <a-form-item label="使用状态">
-                  <a-select placeholder="请选择" default-value="0">
-                    <a-select-option value="0">全部</a-select-option>
-                    <a-select-option value="1">关闭</a-select-option>
-                    <a-select-option value="2">运行中</a-select-option>
-                  </a-select>
-                </a-form-item>
-              </a-col>
-            </template>
-            <a-col :md="(!advanced && 8) || 24" :sm="24">
-              <span
-                class="table-page-search-submitButtons"
-                :style="(advanced && { float: 'right', overflow: 'hidden' }) || {}"
-              >
-                <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
-                <a-button style="margin-left: 8px" @click="() => (this.queryParam = {})">重置</a-button>
-                <a @click="toggleAdvanced" style="margin-left: 8px">
-                  {{ advanced ? '收起' : '展开' }}
-                  <a-icon :type="advanced ? 'up' : 'down'" />
-                </a>
-              </span>
-            </a-col>
-          </a-row>
-        </a-form>
-      </div>
-
-      <div class="table-operator">
-        <a-button type="primary" icon="plus" @click="handleAdd">新建</a-button>
-        <a-dropdown>
-          <a-menu slot="overlay">
-            <a-menu-item key="1"><a-icon type="delete" />删除</a-menu-item>
-            <!-- lock | unlock -->
-            <a-menu-item key="2"><a-icon type="lock" />锁定</a-menu-item>
-          </a-menu>
-          <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /> </a-button>
-        </a-dropdown>
-      </div>
-
-      <s-table
-        ref="table"
-        size="default"
-        rowKey="key"
-        :columns="columns"
-        :data="loadData"
-        :alert="true"
-        :rowSelection="rowSelection"
-        showPagination="auto"
-      >
-        <span slot="serial" slot-scope="text, record, index">
-          {{ index + 1 }}
-        </span>
-        <span slot="status" slot-scope="text">
-          <a-badge :status="text | statusTypeFilter" :text="text | statusFilter" />
-        </span>
-        <span slot="description" slot-scope="text">
-          <ellipsis :length="4" tooltip>{{ text }}</ellipsis>
-        </span>
-
-        <span slot="action" slot-scope="text, record">
-          <template>
-            <a @click="handleEdit(record)">配置</a>
-            <a-divider type="vertical" />
-            <a @click="handleSub(record)">订阅报警</a>
-          </template>
-        </span>
-      </s-table>
-
-      <create-form
-        ref="createModal"
-        :visible="visible"
-        :loading="confirmLoading"
-        :model="mdl"
-        @cancel="handleCancel"
-        @ok="handleOk"
-      />
-      <step-by-step-modal ref="modal" @ok="handleOk" />
-    </a-card>
-  </page-header-wrapper>
-</template>
-
-<script>
-import moment from 'moment'
-import { STable, Ellipsis } from '@/components'
-import { getRoleList, getServiceList } from '@/api/manage'
-
-import StepByStepModal from './modules/StepByStepModal'
-import CreateForm from './modules/CreateForm'
-
-const columns = [
-  {
-    title: '#',
-    scopedSlots: { customRender: 'serial' },
-  },
-  {
-    title: '规则编号',
-    dataIndex: 'no',
-  },
-  {
-    title: '描述',
-    dataIndex: 'description',
-    scopedSlots: { customRender: 'description' },
-  },
-  {
-    title: '服务调用次数',
-    dataIndex: 'callNo',
-    sorter: true,
-    needTotal: true,
-    customRender: (text) => text + ' 次',
-  },
-  {
-    title: '状态',
-    dataIndex: 'status',
-    scopedSlots: { customRender: 'status' },
-  },
-  {
-    title: '更新时间',
-    dataIndex: 'updatedAt',
-    sorter: true,
-  },
-  {
-    title: '操作',
-    dataIndex: 'action',
-    width: '150px',
-    scopedSlots: { customRender: 'action' },
-  },
-]
-
-const statusMap = {
-  0: {
-    status: 'default',
-    text: '关闭',
-  },
-  1: {
-    status: 'processing',
-    text: '运行中',
-  },
-  2: {
-    status: 'success',
-    text: '已上线',
-  },
-  3: {
-    status: 'error',
-    text: '异常',
-  },
-}
-
-export default {
-  name: 'TableList',
-  components: {
-    STable,
-    Ellipsis,
-    CreateForm,
-    StepByStepModal,
-  },
-  data() {
-    this.columns = columns
-    return {
-      // create model
-      visible: false,
-      confirmLoading: false,
-      mdl: null,
-      // 高级搜索 展开/关闭
-      advanced: false,
-      // 查询参数
-      queryParam: {},
-      // 加载数据方法 必须为 Promise 对象
-      loadData: (parameter) => {
-        const requestParameters = Object.assign({}, parameter, this.queryParam)
-        return getServiceList(requestParameters).then((res) => {
-          return res.result
-        })
-      },
-      selectedRowKeys: [],
-      selectedRows: [],
-    }
-  },
-  filters: {
-    statusFilter(type) {
-      return statusMap[type].text
-    },
-    statusTypeFilter(type) {
-      return statusMap[type].status
-    },
-  },
-  created() {
-    getRoleList({ t: new Date() })
-  },
-  computed: {
-    rowSelection() {
-      return {
-        selectedRowKeys: this.selectedRowKeys,
-        onChange: this.onSelectChange,
-      }
-    },
-  },
-  methods: {
-    handleAdd() {
-      this.mdl = null
-      this.visible = true
-    },
-    handleEdit(record) {
-      this.visible = true
-      this.mdl = { ...record }
-    },
-    handleOk() {
-      const form = this.$refs.createModal.form
-      this.confirmLoading = true
-      form.validateFields((errors, values) => {
-        if (!errors) {
-          console.log('values', values)
-          if (values.id > 0) {
-            // 修改 e.g.
-            new Promise((resolve, reject) => {
-              setTimeout(() => {
-                resolve()
-              }, 1000)
-            }).then((res) => {
-              this.visible = false
-              this.confirmLoading = false
-              // 重置表单数据
-              form.resetFields()
-              // 刷新表格
-              this.$refs.table.refresh()
-
-              this.$message.info('修改成功')
-            })
-          } else {
-            // 新增
-            new Promise((resolve, reject) => {
-              setTimeout(() => {
-                resolve()
-              }, 1000)
-            }).then((res) => {
-              this.visible = false
-              this.confirmLoading = false
-              // 重置表单数据
-              form.resetFields()
-              // 刷新表格
-              this.$refs.table.refresh()
-
-              this.$message.info('新增成功')
-            })
-          }
-        } else {
-          this.confirmLoading = false
-        }
-      })
-    },
-    handleCancel() {
-      this.visible = false
-
-      const form = this.$refs.createModal.form
-      form.resetFields() // 清理表单数据（可不做）
-    },
-    handleSub(record) {
-      if (record.status !== 0) {
-        this.$message.info(`${record.no} 订阅成功`)
-      } else {
-        this.$message.error(`${record.no} 订阅失败，规则已关闭`)
-      }
-    },
-    onSelectChange(selectedRowKeys, selectedRows) {
-      this.selectedRowKeys = selectedRowKeys
-      this.selectedRows = selectedRows
-    },
-    toggleAdvanced() {
-      this.advanced = !this.advanced
-    },
-    resetSearchForm() {
-      this.queryParam = {
-        date: moment(new Date()),
-      }
-    },
-  },
-}
-</script>

src/views/list/components/Info.vue

@@ -1,57 +0,0 @@
-<template>
-  <div class="header-info">
-    <span>{{ title }}</span>
-    <p>{{ value }}</p>
-    <em v-if="bordered" />
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Info',
-  props: {
-    title: {
-      type: String,
-      default: ''
-    },
-    value: {
-      type: String,
-      default: ''
-    },
-    bordered: {
-      type: Boolean,
-      default: false
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-@import "~ant-design-vue/es/style/themes/default.less";
-
-.header-info {
-  position: relative;
-  text-align: center;
-  & > span {
-    display: inline-block;
-    margin-bottom: 4px;
-    color: @text-color-secondary;
-    font-size: @font-size-base;
-    line-height: 22px;
-  }
-  & > p {
-    margin: 0;
-    color: @heading-color;
-    font-size: 24px;
-    line-height: 32px;
-  }
-  & > em {
-    position: absolute;
-    top: 0;
-    right: 0;
-    width: 1px;
-    height: 56px;
-    background-color: @border-color-split;
-  }
-}
-</style>

src/views/list/modules/CreateForm.vue

@@ -1,72 +0,0 @@
-<template>
-  <a-modal
-    title="新建规则"
-    :width="640"
-    :visible="visible"
-    :confirmLoading="loading"
-    @ok="() => { $emit('ok') }"
-    @cancel="() => { $emit('cancel') }"
-  >
-    <a-spin :spinning="loading">
-      <a-form :form="form" v-bind="formLayout">
-        <!-- 检查是否有 id 并且大于0，大于0是修改。其他是新增，新增不显示主键ID -->
-        <a-form-item v-show="model && model.id > 0" label="主键ID">
-          <a-input v-decorator="['id', { initialValue: 0 }]" disabled />
-        </a-form-item>
-        <a-form-item label="描述">
-          <a-input v-decorator="['description', {rules: [{required: true, min: 5, message: '请输入至少五个字符的规则描述！'}]}]" />
-        </a-form-item>
-      </a-form>
-    </a-spin>
-  </a-modal>
-</template>
-
-<script>
-import pick from 'lodash.pick'
-
-// 表单字段
-const fields = ['description', 'id']
-
-export default {
-  props: {
-    visible: {
-      type: Boolean,
-      required: true
-    },
-    loading: {
-      type: Boolean,
-      default: () => false
-    },
-    model: {
-      type: Object,
-      default: () => null
-    }
-  },
-  data () {
-    this.formLayout = {
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 7 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 13 }
-      }
-    }
-    return {
-      form: this.$form.createForm(this)
-    }
-  },
-  created () {
-    console.log('custom modal created')
-
-    // 防止表单未注册
-    fields.forEach(v => this.form.getFieldDecorator(v))
-
-    // 当 model 发生改变时，为表单设置值
-    this.$watch('model', () => {
-      this.model && this.form.setFieldsValue(pick(this.model, fields))
-    })
-  }
-}
-</script>

src/views/list/modules/StepByStepModal.vue

@@ -1,172 +0,0 @@
-<template>
-  <a-modal
-    title="分步对话框"
-    :width="640"
-    :visible="visible"
-    :confirmLoading="confirmLoading"
-    @cancel="handleCancel"
-  >
-    <a-spin :spinning="confirmLoading">
-      <a-steps :current="currentStep" :style="{ marginBottom: '28px' }" size="small">
-        <a-step title="基本信息" />
-        <a-step title="配置规则属性" />
-        <a-step title="设定调度周期" />
-      </a-steps>
-      <a-form :form="form">
-        <!-- step1 -->
-        <div v-show="currentStep === 0">
-          <a-form-item
-            label="规则名称"
-            :labelCol="labelCol"
-            :wrapperCol="wrapperCol"
-          >
-            <a-input v-decorator="['name', {rules: [{required: true}]}]" />
-          </a-form-item>
-          <a-form-item
-            label="规则描述"
-            :labelCol="labelCol"
-            :wrapperCol="wrapperCol"
-          >
-            <a-textarea :rows="4" v-decorator="['desc', {rules: [{required: true}]}]"></a-textarea>
-          </a-form-item>
-        </div>
-        <div v-show="currentStep === 1">
-          <a-form-item
-            label="监控对象"
-            :labelCol="labelCol"
-            :wrapperCol="wrapperCol"
-          >
-            <a-select v-decorator="['target', {initialValue: 0, rules: [{required: true}]}]" style="width: 100%">
-              <a-select-option :value="0">表一</a-select-option>
-              <a-select-option :value="1">表二</a-select-option>
-            </a-select>
-          </a-form-item>
-
-          <a-form-item
-            label="规则模板"
-            :labelCol="labelCol"
-            :wrapperCol="wrapperCol"
-          >
-            <a-select v-decorator="['template', { initialValue: 0, rules: [{required: true}]}]" style="width: 100%">
-              <a-select-option :value="0">规则模板一</a-select-option>
-              <a-select-option :value="1">规则模板二</a-select-option>
-            </a-select>
-          </a-form-item>
-
-          <a-form-item
-            label="规则类型"
-            :labelCol="labelCol"
-            :wrapperCol="wrapperCol"
-          >
-            <a-radio-group v-decorator="['type', {initialValue: 0, rules: [{required: true}]}]" style="width: 100%">
-              <a-radio :value="0">强</a-radio>
-              <a-radio :value="1">弱</a-radio>
-            </a-radio-group>
-          </a-form-item>
-        </div>
-
-        <div v-show="currentStep === 2">
-          <a-form-item
-            label="开始时间"
-            :labelCol="labelCol"
-            :wrapperCol="wrapperCol"
-          >
-            <a-date-picker v-decorator="['time', {rules: [{ type: 'object', required: true, message: 'Please select time!' }]}]" style="width: 100%" />
-          </a-form-item>
-          <a-form-item
-            label="调度周期"
-            :labelCol="labelCol"
-            :wrapperCol="wrapperCol"
-          >
-            <a-select v-decorator="['frequency', { initialValue: 'month', rules: [{required: true}]}]" style="width: 100%">
-              <a-select-option value="month">月</a-select-option>
-              <a-select-option value="week">周</a-select-option>
-            </a-select>
-          </a-form-item>
-        </div>
-        <!-- step1 end -->
-      </a-form>
-    </a-spin>
-    <template slot="footer">
-      <a-button key="back" @click="backward" v-if="currentStep > 0" :style="{ float: 'left' }" >上一步</a-button>
-      <a-button key="cancel" @click="handleCancel">取消</a-button>
-      <a-button key="forward" :loading="confirmLoading" type="primary" @click="handleNext(currentStep)">{{ currentStep === 2 && '完成' || '下一步' }}</a-button>
-    </template>
-  </a-modal>
-</template>
-
-<script>
-import pick from 'lodash.pick'
-
-const stepForms = [
-  ['name', 'desc'],
-  ['target', 'template', 'type'],
-  ['time', 'frequency']
-]
-
-export default {
-  name: 'StepByStepModal',
-  data () {
-    return {
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 7 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 13 }
-      },
-      visible: false,
-      confirmLoading: false,
-      currentStep: 0,
-      mdl: {},
-
-      form: this.$form.createForm(this)
-    }
-  },
-  methods: {
-    edit (record) {
-      this.visible = true
-      const { form: { setFieldsValue } } = this
-      this.$nextTick(() => {
-        setFieldsValue(pick(record, []))
-      })
-    },
-    handleNext (step) {
-      const { form: { validateFields } } = this
-      const currentStep = step + 1
-      if (currentStep <= 2) {
-        // stepForms
-        validateFields(stepForms[ this.currentStep ], (errors, values) => {
-          if (!errors) {
-            this.currentStep = currentStep
-          }
-        })
-        return
-      }
-      // last step
-      this.confirmLoading = true
-      validateFields((errors, values) => {
-        console.log('errors:', errors, 'val:', values)
-        if (!errors) {
-          console.log('values:', values)
-          setTimeout(() => {
-            this.confirmLoading = false
-            this.$emit('ok', values)
-          }, 1500)
-        } else {
-          this.confirmLoading = false
-        }
-      })
-    },
-    backward () {
-      this.currentStep--
-    },
-    handleCancel () {
-      // clear form & currentStep
-      this.visible = false
-      this.currentStep = 0
-    }
-  }
-}
-</script>

src/views/list/modules/TaskForm.vue

@@ -1,94 +0,0 @@
-<template>
-  <a-form @submit="handleSubmit" :form="form">
-    <a-form-item
-      label="任务名称"
-      :labelCol="labelCol"
-      :wrapperCol="wrapperCol"
-    >
-      <a-input v-decorator="['title', {rules:[{required: true, message: '请输入任务名称'}]}]" />
-    </a-form-item>
-    <a-form-item
-      label="开始时间"
-      :labelCol="labelCol"
-      :wrapperCol="wrapperCol"
-    >
-      <a-date-picker
-        style="width: 100%"
-        valueFormat="YYYY-MM-DD HH:mm"
-        v-decorator="['startAt', {rules:[{required: true, message: '请选择开始时间'}]}]"
-      />
-    </a-form-item>
-    <a-form-item
-      label="任务负责人"
-      :labelCol="labelCol"
-      :wrapperCol="wrapperCol"
-    >
-      <a-select v-decorator="['owner', {rules:[{required: true, message: '请选择开始时间'}]}]">
-        <a-select-option :value="0">付晓晓</a-select-option>
-        <a-select-option :value="1">周毛毛</a-select-option>
-      </a-select>
-    </a-form-item>
-    <a-form-item
-      label="产品描述"
-      :labelCol="labelCol"
-      :wrapperCol="wrapperCol"
-    >
-      <a-textarea v-decorator="['description']"></a-textarea>
-    </a-form-item>
-  </a-form>
-</template>
-
-<script>
-import pick from 'lodash.pick'
-
-const fields = ['title', 'startAt', 'owner', 'description']
-
-export default {
-  name: 'TaskForm',
-  props: {
-    record: {
-      type: Object,
-      default: null
-    }
-  },
-  data () {
-    return {
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 7 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 13 }
-      },
-      form: this.$form.createForm(this)
-    }
-  },
-  mounted () {
-    this.record && this.form.setFieldsValue(pick(this.record, fields))
-  },
-  methods: {
-    onOk () {
-      console.log('监听了 modal ok 事件')
-      return new Promise(resolve => {
-        resolve(true)
-      })
-    },
-    onCancel () {
-      console.log('监听了 modal cancel 事件')
-      return new Promise(resolve => {
-        resolve(true)
-      })
-    },
-    handleSubmit () {
-      const { form: { validateFields } } = this
-      this.visible = true
-      validateFields((errors, values) => {
-        if (!errors) {
-          console.log('values', values)
-        }
-      })
-    }
-  }
-}
-</script>

src/views/list/search/Applications.vue

@@ -1,187 +0,0 @@
-<template>
-  <div>
-    <a-card :bordered="false" class="ant-pro-components-tag-select">
-      <a-form :form="form" layout="inline">
-        <standard-form-row title="所属类目" block style="padding-bottom: 11px;">
-          <a-form-item>
-            <tag-select>
-              <tag-select-option value="Category1">类目一</tag-select-option>
-              <tag-select-option value="Category2">类目二</tag-select-option>
-              <tag-select-option value="Category3">类目三</tag-select-option>
-              <tag-select-option value="Category4">类目四</tag-select-option>
-              <tag-select-option value="Category5">类目五</tag-select-option>
-              <tag-select-option value="Category6">类目六</tag-select-option>
-              <tag-select-option value="Category7">类目七</tag-select-option>
-              <tag-select-option value="Category8">类目八</tag-select-option>
-              <tag-select-option value="Category9">类目九</tag-select-option>
-              <tag-select-option value="Category10">类目十</tag-select-option>
-            </tag-select>
-          </a-form-item>
-        </standard-form-row>
-
-        <standard-form-row title="其它选项" grid last>
-          <a-row>
-            <a-col :lg="8" :md="10" :sm="10" :xs="24">
-              <a-form-item :wrapper-col="{ sm: { span: 16 }, xs: { span: 24 } }" label="作者">
-                <a-select
-                  style="max-width: 200px; width: 100%;"
-                  mode="multiple"
-                  placeholder="不限"
-                  v-decorator="['author']"
-                  @change="handleChange"
-                >
-                  <a-select-option value="lisa">王昭君</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :lg="8" :md="10" :sm="10" :xs="24">
-              <a-form-item :wrapper-col="{ sm: { span: 16 }, xs: { span: 24 } }" label="好评度">
-                <a-select style="max-width: 200px; width: 100%;" placeholder="不限" v-decorator="['rate']">
-                  <a-select-option value="good">优秀</a-select-option>
-                  <a-select-option value="normal">普通</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-          </a-row>
-        </standard-form-row>
-      </a-form>
-    </a-card>
-
-    <div class="ant-pro-pages-list-applications-filterCardList">
-      <a-list
-        :loading="loading"
-        :data-source="data"
-        :grid="{ gutter: 24, xl: 4, lg: 3, md: 3, sm: 2, xs: 1 }"
-        style="margin-top: 24px;"
-      >
-        <a-list-item slot="renderItem" slot-scope="item">
-          <a-card :body-style="{ paddingBottom: 20 }" hoverable>
-            <a-card-meta :title="item.title">
-              <template slot="avatar">
-                <a-avatar size="small" :src="item.avatar" />
-              </template>
-            </a-card-meta>
-            <template slot="actions">
-              <a-tooltip title="下载">
-                <a-icon type="download" />
-              </a-tooltip>
-              <a-tooltip title="编辑">
-                <a-icon type="edit" />
-              </a-tooltip>
-              <a-tooltip title="分享">
-                <a-icon type="share-alt" />
-              </a-tooltip>
-              <a-dropdown>
-                <a class="ant-dropdown-link">
-                  <a-icon type="ellipsis" />
-                </a>
-                <a-menu slot="overlay">
-                  <a-menu-item>
-                    <a href="javascript:;">1st menu item</a>
-                  </a-menu-item>
-                  <a-menu-item>
-                    <a href="javascript:;">2nd menu item</a>
-                  </a-menu-item>
-                  <a-menu-item>
-                    <a href="javascript:;">3rd menu item</a>
-                  </a-menu-item>
-                </a-menu>
-              </a-dropdown>
-            </template>
-            <div class="">
-              <card-info active-user="100" new-user="999"></card-info>
-            </div>
-          </a-card>
-        </a-list-item>
-      </a-list>
-    </div>
-  </div>
-</template>
-
-<script>
-import moment from 'moment'
-import { TagSelect, StandardFormRow, Ellipsis, AvatarList } from '@/components'
-import CardInfo from './components/CardInfo'
-const TagSelectOption = TagSelect.Option
-const AvatarListItem = AvatarList.Item
-
-export default {
-  components: {
-    AvatarList,
-    AvatarListItem,
-    Ellipsis,
-    TagSelect,
-    TagSelectOption,
-    StandardFormRow,
-    CardInfo
-  },
-  data () {
-    return {
-      data: [],
-      form: this.$form.createForm(this),
-      loading: true
-    }
-  },
-  filters: {
-    fromNow (date) {
-      return moment(date).fromNow()
-    }
-  },
-  mounted () {
-    this.getList()
-  },
-  methods: {
-    handleChange (value) {
-      console.log(`selected ${value}`)
-    },
-    getList () {
-      this.$http.get('/list/article', { params: { count: 8 } }).then(res => {
-        console.log('res', res)
-        this.data = res.result
-        this.loading = false
-      })
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.ant-pro-components-tag-select {
-  :deep(.ant-pro-tag-select .ant-tag) {
-    margin-right: 24px;
-    padding: 0 8px;
-    font-size: 14px;
-  }
-}
-.ant-pro-pages-list-projects-cardList {
-  margin-top: 24px;
-
-  :deep(.ant-card-meta-title) {
-    margin-bottom: 4px;
-  }
-
-  :deep(.ant-card-meta-description) {
-    height: 44px;
-    overflow: hidden;
-    line-height: 22px;
-  }
-
-  .cardItemContent {
-    display: flex;
-    height: 20px;
-    margin-top: 16px;
-    margin-bottom: -4px;
-    line-height: 20px;
-
-    > span {
-      flex: 1 1;
-      color: rgba(0, 0, 0, 0.45);
-      font-size: 12px;
-    }
-
-    :deep(.ant-pro-avatar-list) {
-      flex: 0 1 auto;
-    }
-  }
-}
-</style>

src/views/list/search/Article.vue

@@ -1,185 +0,0 @@
-<template>
-  <div>
-    <a-card :bordered="false" class="ant-pro-components-tag-select">
-      <a-form :form="form" layout="inline">
-        <standard-form-row title="所属类目" block style="padding-bottom: 11px;">
-          <a-form-item>
-            <tag-select>
-              <tag-select-option value="Category1">类目一</tag-select-option>
-              <tag-select-option value="Category2">类目二</tag-select-option>
-              <tag-select-option value="Category3">类目三</tag-select-option>
-              <tag-select-option value="Category4">类目四</tag-select-option>
-              <tag-select-option value="Category5">类目五</tag-select-option>
-              <tag-select-option value="Category6">类目六</tag-select-option>
-              <tag-select-option value="Category7">类目七</tag-select-option>
-              <tag-select-option value="Category8">类目八</tag-select-option>
-              <tag-select-option value="Category9">类目九</tag-select-option>
-              <tag-select-option value="Category10">类目十</tag-select-option>
-            </tag-select>
-          </a-form-item>
-        </standard-form-row>
-
-        <standard-form-row title="owner" grid>
-          <a-row>
-            <a-col :md="24">
-              <a-form-item :wrapper-col="{ span: 24 }">
-                <a-select
-                  style="max-width: 268px; width: 100%;"
-                  mode="multiple"
-                  placeholder="选择 onwer"
-                  v-decorator="['owner']"
-                  @change="handleChange"
-                >
-                  <a-select-option v-for="item in owners" :key="item.id">{{ item.name }}</a-select-option>
-                </a-select>
-                <a class="list-articles-trigger" @click="setOwner">只看自己的</a>
-              </a-form-item>
-            </a-col>
-          </a-row>
-        </standard-form-row>
-
-        <standard-form-row title="其它选项" grid last>
-          <a-row :gutter="16">
-            <a-col :xs="24" :sm="24" :md="12" :lg="10" :xl="8">
-              <a-form-item label="活跃用户" :wrapper-col="{ xs: 24, sm: 24, md: 12 }">
-                <a-select placeholder="不限" style="max-width: 200px; width: 100%;">
-                  <a-select-option value="李三">李三</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :xs="24" :sm="24" :md="12" :lg="10" :xl="8">
-              <a-form-item label="好评度" :wrapper-col="{ xs: 24, sm: 24, md: 12 }">
-                <a-select placeholder="不限" style="max-width: 200px; width: 100%;">
-                  <a-select-option value="优秀">优秀</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-          </a-row>
-        </standard-form-row>
-      </a-form>
-    </a-card>
-
-    <a-card style="margin-top: 24px;" :bordered="false">
-      <a-list
-        size="large"
-        rowKey="id"
-        :loading="loading"
-        itemLayout="vertical"
-        :dataSource="data"
-      >
-        <a-list-item :key="item.id" slot="renderItem" slot-scope="item">
-          <template slot="actions">
-            <icon-text type="star-o" :text="item.star" />
-            <icon-text type="like-o" :text="item.like" />
-            <icon-text type="message" :text="item.message" />
-          </template>
-          <a-list-item-meta>
-            <a slot="title" href="https://vue.ant.design/">{{ item.title }}</a>
-            <template slot="description">
-              <span>
-                <a-tag>Ant Design</a-tag>
-                <a-tag>设计语言</a-tag>
-                <a-tag>蚂蚁金服</a-tag>
-              </span>
-            </template>
-          </a-list-item-meta>
-          <article-list-content :description="item.description" :owner="item.owner" :avatar="item.avatar" :href="item.href" :updateAt="item.updatedAt" />
-        </a-list-item>
-        <div slot="footer" v-if="data.length > 0" style="text-align: center; margin-top: 16px;">
-          <a-button @click="loadMore" :loading="loadingMore">加载更多</a-button>
-        </div>
-      </a-list>
-    </a-card>
-  </div>
-</template>
-
-<script>
-import { TagSelect, StandardFormRow, ArticleListContent } from '@/components'
-import IconText from './components/IconText'
-const TagSelectOption = TagSelect.Option
-
-const owners = [
-  {
-    id: 'wzj',
-    name: '我自己'
-  },
-  {
-    id: 'wjh',
-    name: '吴家豪'
-  },
-  {
-    id: 'zxx',
-    name: '周星星'
-  },
-  {
-    id: 'zly',
-    name: '赵丽颖'
-  },
-  {
-    id: 'ym',
-    name: '姚明'
-  }
-]
-
-export default {
-  components: {
-    TagSelect,
-    TagSelectOption,
-    StandardFormRow,
-    ArticleListContent,
-    IconText
-  },
-  data () {
-    return {
-      owners,
-      loading: true,
-      loadingMore: false,
-      data: [],
-      form: this.$form.createForm(this)
-    }
-  },
-  mounted () {
-    this.getList()
-  },
-  methods: {
-    handleChange (value) {
-      console.log(`selected ${value}`)
-    },
-    getList () {
-      this.$http.get('/list/article').then(res => {
-        console.log('res', res)
-        this.data = res.result
-        this.loading = false
-      })
-    },
-    loadMore () {
-      this.loadingMore = true
-      this.$http.get('/list/article').then(res => {
-        this.data = this.data.concat(res.result)
-      }).finally(() => {
-        this.loadingMore = false
-      })
-    },
-    setOwner () {
-      const { form: { setFieldsValue } } = this
-      setFieldsValue({
-        owner: ['wzj']
-      })
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.ant-pro-components-tag-select {
-  :deep(.ant-pro-tag-select .ant-tag) {
-    margin-right: 24px;
-    padding: 0 8px;
-    font-size: 14px;
-  }
-}
-
-.list-articles-trigger {
-  margin-left: 12px;
-}
-</style>

src/views/list/search/Projects.vue

@@ -1,168 +0,0 @@
-<template>
-  <div>
-    <a-card :bordered="false" class="ant-pro-components-tag-select">
-      <a-form :form="form" layout="inline">
-        <standard-form-row title="所属类目" block style="padding-bottom: 11px;">
-          <a-form-item>
-            <tag-select>
-              <tag-select-option value="Category1">类目一</tag-select-option>
-              <tag-select-option value="Category2">类目二</tag-select-option>
-              <tag-select-option value="Category3">类目三</tag-select-option>
-              <tag-select-option value="Category4">类目四</tag-select-option>
-              <tag-select-option value="Category5">类目五</tag-select-option>
-              <tag-select-option value="Category6">类目六</tag-select-option>
-              <tag-select-option value="Category7">类目七</tag-select-option>
-              <tag-select-option value="Category8">类目八</tag-select-option>
-              <tag-select-option value="Category9">类目九</tag-select-option>
-              <tag-select-option value="Category10">类目十</tag-select-option>
-            </tag-select>
-          </a-form-item>
-        </standard-form-row>
-
-        <standard-form-row title="其它选项" grid last>
-          <a-row>
-            <a-col :lg="8" :md="10" :sm="10" :xs="24">
-              <a-form-item :wrapper-col="{ sm: { span: 16 }, xs: { span: 24 } }" label="作者">
-                <a-select
-                  style="max-width: 200px; width: 100%;"
-                  mode="multiple"
-                  placeholder="不限"
-                  v-decorator="['author']"
-                  @change="handleChange"
-                >
-                  <a-select-option value="lisa">王昭君</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :lg="8" :md="10" :sm="10" :xs="24">
-              <a-form-item :wrapper-col="{ sm: { span: 16 }, xs: { span: 24 } }" label="好评度">
-                <a-select
-                  style="max-width: 200px; width: 100%;"
-                  placeholder="不限"
-                  v-decorator="['rate']"
-                >
-                  <a-select-option value="good">优秀</a-select-option>
-                  <a-select-option value="normal">普通</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-          </a-row>
-        </standard-form-row>
-      </a-form>
-    </a-card>
-
-    <div class="ant-pro-pages-list-projects-cardList">
-      <a-list :loading="loading" :data-source="data" :grid="{ gutter: 24, xl: 4, lg: 3, md: 3, sm: 2, xs: 1 }">
-        <a-list-item slot="renderItem" slot-scope="item">
-          <a-card class="ant-pro-pages-list-projects-card" hoverable>
-            <img slot="cover" :src="item.cover" :alt="item.title" />
-            <a-card-meta :title="item.title">
-              <template slot="description">
-                <ellipsis :length="50">{{ item.description }}</ellipsis>
-              </template>
-            </a-card-meta>
-            <div class="cardItemContent">
-              <span>{{ item.updatedAt | fromNow }}</span>
-              <div class="avatarList">
-                <avatar-list size="small" :max-length="2">
-                  <avatar-list-item
-                    v-for="(member, i) in item.members"
-                    :key="`${item.id}-avatar-${i}`"
-                    :src="member.avatar"
-                    :tips="member.name"
-                  />
-                </avatar-list>
-              </div>
-            </div>
-          </a-card>
-        </a-list-item>
-      </a-list>
-    </div>
-  </div>
-</template>
-
-<script>
-import moment from 'moment'
-import { TagSelect, StandardFormRow, Ellipsis, AvatarList } from '@/components'
-const TagSelectOption = TagSelect.Option
-const AvatarListItem = AvatarList.Item
-
-export default {
-  components: {
-    AvatarList,
-    AvatarListItem,
-    Ellipsis,
-    TagSelect,
-    TagSelectOption,
-    StandardFormRow
-  },
-  data () {
-    return {
-      data: [],
-      form: this.$form.createForm(this),
-      loading: true
-    }
-  },
-  filters: {
-    fromNow (date) {
-      return moment(date).fromNow()
-    }
-  },
-  mounted () {
-    this.getList()
-  },
-  methods: {
-    handleChange (value) {
-      console.log(`selected ${value}`)
-    },
-    getList () {
-      this.$http.get('/list/article', { params: { count: 8 } }).then(res => {
-        console.log('res', res)
-        this.data = res.result
-        this.loading = false
-      })
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.ant-pro-components-tag-select {
-  :deep(.ant-pro-tag-select .ant-tag) {
-    margin-right: 24px;
-    padding: 0 8px;
-    font-size: 14px;
-  }
-}
-.ant-pro-pages-list-projects-cardList {
-  margin-top: 24px;
-
-  :deep(.ant-card-meta-title) {
-    margin-bottom: 4px;
-  }
-
-  :deep(.ant-card-meta-description) {
-    height: 44px;
-    overflow: hidden;
-    line-height: 22px;
-  }
-
-  .cardItemContent {
-    display: flex;
-    height: 20px;
-    margin-top: 16px;
-    margin-bottom: -4px;
-    line-height: 20px;
-
-    > span {
-      flex: 1 1;
-      color: rgba(0,0,0,.45);
-      font-size: 12px;
-    }
-
-    :deep(.ant-pro-avatar-list) {
-      flex: 0 1 auto;
-    }
-  }
-}
-</style>

src/views/list/search/SearchLayout.vue

@@ -1,79 +0,0 @@
-<template>
-  <page-header-wrapper
-    :tab-list="tabList"
-    :tab-active-key="tabActiveKey"
-    :tab-change="handleTabChange"
-  >
-    <template v-slot:content>
-      <div class="ant-pro-page-header-search">
-        <a-input-search size="large" style="width: 80%; max-width: 522px;">
-          <template v-slot:enterButton>
-            搜索
-          </template>
-        </a-input-search>
-      </div>
-    </template>
-    <router-view />
-  </page-header-wrapper>
-</template>
-
-<script>
-const getActiveKey = (path) => {
-  switch (path) {
-    case '/list/search/article':
-      return '1'
-    case '/list/search/project':
-      return '2'
-    case '/list/search/application':
-      return '3'
-    default:
-      return '1'
-  }
-}
-export default {
-  name: 'SearchLayout',
-  data () {
-    return {
-      tabList: [
-        { key: '1', tab: '文章' },
-        { key: '2', tab: '项目' },
-        { key: '3', tab: '应用' }
-      ],
-      tabActiveKey: '1',
-      search: true
-    }
-  },
-  created () {
-    this.tabActiveKey = getActiveKey(this.$route.path)
-
-    this.$watch('$route', (val) => {
-      this.tabActiveKey = getActiveKey(val.path)
-    })
-  },
-  methods: {
-    handleTabChange (key) {
-      this.tabActiveKey = key
-      switch (key) {
-        case '1':
-          this.$router.push('/list/search/article')
-          break
-        case '2':
-          this.$router.push('/list/search/project')
-          break
-        case '3':
-          this.$router.push('/list/search/application')
-          break
-        default:
-          this.$router.push('/workplace')
-      }
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.ant-pro-page-header-search {
-  text-align: center;
-  margin-bottom: 16px;
-}
-</style>

src/views/list/search/components/CardInfo.vue

@@ -1,58 +0,0 @@
-<template>
-  <div class="cardInfo">
-    <div>
-      <p>活跃用户</p>
-      <p>{{ activeUser }}</p>
-    </div>
-    <div>
-      <p>新增用户</p>
-      <p>{{ newUser }}</p>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'CardInfo',
-  props: {
-    activeUser: {
-      type: [String, Number],
-      default: 0
-    },
-    newUser: {
-      type: [String, Number],
-      default: 0
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-@import "~@/components/index.less";
-@import "~@/utils/utils.less";
-
-.cardInfo {
-
-  .clearfix();
-
-  margin-top: 16px;
-  margin-left: 40px;
-  & > div {
-    position: relative;
-    float: left;
-    width: 50%;
-    text-align: left;
-    p {
-      margin: 0;
-      font-size: 24px;
-      line-height: 32px;
-    }
-    p:first-child {
-      margin-bottom: 4px;
-      color: @text-color-secondary;
-      font-size: 12px;
-      line-height: 20px;
-    }
-  }
-}
-</style>

src/views/list/search/components/IconText.vue

@@ -1,22 +0,0 @@
-<template>
-  <span>
-    <a-icon :type="type" style="margin-right: 8px" />
-    {{ text }}
-  </span>
-</template>
-
-<script>
-export default {
-  name: 'IconText',
-  props: {
-    'type': {
-      type: String,
-      required: true
-    },
-    text: {
-      type: [String, Number],
-      required: true
-    }
-  }
-}
-</script>

src/views/list/table/Edit.vue

@@ -1,160 +0,0 @@
-<template>
-  <div>
-    <a-form :form="form" @submit="handleSubmit">
-
-      <a-form-item
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        label="规则编号"
-        hasFeedback
-        validateStatus="success"
-      >
-        <a-input
-          placeholder="规则编号"
-          v-decorator="[
-            'no',
-            {rules: [{ required: true, message: '请输入规则编号' }]}
-          ]"
-          :disabled="true"
-        ></a-input>
-      </a-form-item>
-
-      <a-form-item
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        label="服务调用次数"
-        hasFeedback
-        validateStatus="success"
-      >
-        <a-input-number :min="1" style="width: 100%" v-decorator="['callNo', {rules: [{ required: true }]}]" />
-      </a-form-item>
-
-      <a-form-item
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        label="状态"
-        hasFeedback
-        validateStatus="warning"
-      >
-        <a-select v-decorator="['status', {rules: [{ required: true, message: '请选择状态' }], initialValue: '1'}]">
-          <a-select-option :value="1">Option 1</a-select-option>
-          <a-select-option :value="2">Option 2</a-select-option>
-          <a-select-option :value="3">Option 3</a-select-option>
-        </a-select>
-      </a-form-item>
-
-      <a-form-item
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        label="描述"
-        hasFeedback
-        help="请填写一段描述"
-      >
-        <a-textarea :rows="5" placeholder="..." v-decorator="['description', {rules: [{ required: true }]}]" />
-      </a-form-item>
-
-      <a-form-item
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        label="更新时间"
-        hasFeedback
-        validateStatus="error"
-      >
-        <a-date-picker
-          style="width: 100%"
-          showTime
-          format="YYYY-MM-DD HH:mm:ss"
-          placeholder="Select Time"
-          v-decorator="['updatedAt']"
-        />
-      </a-form-item>
-
-      <a-form-item
-        v-bind="buttonCol"
-      >
-        <a-row>
-          <a-col span="6">
-            <a-button type="primary" html-type="submit">提交</a-button>
-          </a-col>
-          <a-col span="10">
-            <a-button @click="handleGoBack">返回</a-button>
-          </a-col>
-          <a-col span="8"></a-col>
-        </a-row>
-      </a-form-item>
-    </a-form>
-  </div>
-</template>
-
-<script>
-import moment from 'moment'
-import pick from 'lodash.pick'
-
-export default {
-  name: 'TableEdit',
-  props: {
-    record: {
-      type: [Object, String],
-      default: ''
-    }
-  },
-  data () {
-    return {
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 5 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 12 }
-      },
-      buttonCol: {
-        wrapperCol: {
-          xs: { span: 24 },
-          sm: { span: 12, offset: 5 }
-        }
-      },
-      form: this.$form.createForm(this),
-      id: 0
-    }
-  },
-  // beforeCreate () {
-  //   this.form = this.$form.createForm(this)
-  // },
-  mounted () {
-    this.$nextTick(() => {
-      this.loadEditInfo(this.record)
-    })
-  },
-  methods: {
-    handleGoBack () {
-      this.$emit('onGoBack')
-    },
-    handleSubmit () {
-      const { form: { validateFields } } = this
-      validateFields((err, values) => {
-        if (!err) {
-          // eslint-disable-next-line no-console
-          console.log('Received values of form: ', values)
-        }
-      })
-    },
-    handleGetInfo () {
-
-    },
-    loadEditInfo (data) {
-      const { form } = this
-      // ajax
-      console.log(`将加载 ${this.id} 信息到表单`)
-      new Promise((resolve) => {
-        setTimeout(resolve, 1500)
-      }).then(() => {
-        const formData = pick(data, ['no', 'callNo', 'status', 'description', 'updatedAt'])
-        formData.updatedAt = moment(data.updatedAt)
-        console.log('formData', formData)
-        form.setFieldsValue(formData)
-      })
-    }
-  }
-}
-</script>

src/views/list/table/List.vue

@@ -1,238 +0,0 @@
-<template>
-  <div>
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline">
-        <a-row :gutter="48">
-          <a-col :md="8" :sm="24">
-            <a-form-item label="规则编号">
-              <a-input v-model="queryParam.id" placeholder=""/>
-            </a-form-item>
-          </a-col>
-          <a-col :md="8" :sm="24">
-            <a-form-item label="使用状态">
-              <a-select v-model="queryParam.status" placeholder="请选择" default-value="0">
-                <a-select-option value="0">全部</a-select-option>
-                <a-select-option value="1">关闭</a-select-option>
-                <a-select-option value="2">运行中</a-select-option>
-              </a-select>
-            </a-form-item>
-          </a-col>
-          <template v-if="advanced">
-            <a-col :md="8" :sm="24">
-              <a-form-item label="调用次数">
-                <a-input-number v-model="queryParam.callNo" style="width: 100%"/>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item label="更新日期">
-                <a-date-picker v-model="queryParam.date" style="width: 100%" placeholder="请输入更新日期"/>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item label="使用状态">
-                <a-select v-model="queryParam.useStatus" placeholder="请选择" default-value="0">
-                  <a-select-option value="0">全部</a-select-option>
-                  <a-select-option value="1">关闭</a-select-option>
-                  <a-select-option value="2">运行中</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item label="使用状态">
-                <a-select placeholder="请选择" default-value="0">
-                  <a-select-option value="0">全部</a-select-option>
-                  <a-select-option value="1">关闭</a-select-option>
-                  <a-select-option value="2">运行中</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-          </template>
-          <a-col :md="!advanced && 8 || 24" :sm="24">
-            <span class="table-page-search-submitButtons" :style="advanced && { float: 'right', overflow: 'hidden' } || {} ">
-              <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
-              <a-button style="margin-left: 8px" @click="() => queryParam = {}">重置</a-button>
-              <a @click="toggleAdvanced" style="margin-left: 8px">
-                {{ advanced ? '收起' : '展开' }}
-                <a-icon :type="advanced ? 'up' : 'down'"/>
-              </a>
-            </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-    <div class="table-operator">
-      <a-button type="primary" icon="plus" @click="handleEdit()">新建</a-button>
-      <a-button type="dashed" @click="tableOption">{{ optionAlertShow && '关闭' || '开启' }} alert</a-button>
-      <a-dropdown v-action:edit v-if="selectedRowKeys.length > 0">
-        <a-menu slot="overlay">
-          <a-menu-item key="1"><a-icon type="delete" />删除</a-menu-item>
-          <!-- lock | unlock -->
-          <a-menu-item key="2"><a-icon type="lock" />锁定</a-menu-item>
-        </a-menu>
-        <a-button style="margin-left: 8px">
-          批量操作 <a-icon type="down" />
-        </a-button>
-      </a-dropdown>
-    </div>
-
-    <s-table
-      ref="table"
-      size="default"
-      rowKey="key"
-      :columns="columns"
-      :data="loadData"
-      :alert="options.alert"
-      :rowSelection="options.rowSelection"
-    >
-      <span slot="serial" slot-scope="text, record, index">
-        {{ index + 1 }}
-      </span>
-      <span slot="action" slot-scope="text, record">
-        <template>
-          <a @click="handleEdit(record)">编辑</a>
-          <a-divider type="vertical" />
-        </template>
-        <a-dropdown>
-          <a class="ant-dropdown-link">
-            更多 <a-icon type="down" />
-          </a>
-          <a-menu slot="overlay">
-            <a-menu-item>
-              <a href="javascript:;">详情</a>
-            </a-menu-item>
-            <a-menu-item v-if="$auth('table.disable')">
-              <a href="javascript:;">禁用</a>
-            </a-menu-item>
-            <a-menu-item v-if="$auth('table.delete')">
-              <a href="javascript:;">删除</a>
-            </a-menu-item>
-          </a-menu>
-        </a-dropdown>
-      </span>
-    </s-table>
-  </div>
-</template>
-
-<script>
-import moment from 'moment'
-import { STable } from '@/components'
-import { getRoleList, getServiceList } from '@/api/manage'
-
-export default {
-  name: 'TableList',
-  components: {
-    STable
-  },
-  data () {
-    return {
-      mdl: {},
-      // 高级搜索 展开/关闭
-      advanced: false,
-      // 查询参数
-      queryParam: {},
-      // 表头
-      columns: [
-        {
-          title: '#',
-          scopedSlots: { customRender: 'serial' }
-        },
-        {
-          title: '规则编号',
-          dataIndex: 'no'
-        },
-        {
-          title: '描述',
-          dataIndex: 'description'
-        },
-        {
-          title: '服务调用次数',
-          dataIndex: 'callNo',
-          sorter: true,
-          needTotal: true,
-          customRender: (text) => text + ' 次'
-        },
-        {
-          title: '状态',
-          dataIndex: 'status',
-          needTotal: true
-        },
-        {
-          title: '更新时间',
-          dataIndex: 'updatedAt',
-          sorter: true
-        },
-        {
-          title: '操作',
-          dataIndex: 'action',
-          width: '150px',
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      // 加载数据方法 必须为 Promise 对象
-      loadData: parameter => {
-        return getServiceList(Object.assign(parameter, this.queryParam))
-          .then(res => {
-            return res.result
-          })
-      },
-      selectedRowKeys: [],
-      selectedRows: [],
-
-      // custom table alert & rowSelection
-      options: {
-        alert: { show: true, clear: () => { this.selectedRowKeys = [] } },
-        rowSelection: {
-          selectedRowKeys: this.selectedRowKeys,
-          onChange: this.onSelectChange
-        }
-      },
-      optionAlertShow: false
-    }
-  },
-  created () {
-    this.tableOption()
-    getRoleList({ t: new Date() })
-  },
-  methods: {
-    tableOption () {
-      if (!this.optionAlertShow) {
-        this.options = {
-          alert: { show: true, clear: () => { this.selectedRowKeys = [] } },
-          rowSelection: {
-            selectedRowKeys: this.selectedRowKeys,
-            onChange: this.onSelectChange
-          }
-        }
-        this.optionAlertShow = true
-      } else {
-        this.options = {
-          alert: false,
-          rowSelection: null
-        }
-        this.optionAlertShow = false
-      }
-    },
-
-    handleEdit (record) {
-      this.$emit('onEdit', record)
-    },
-    handleOk () {
-
-    },
-
-    onSelectChange (selectedRowKeys, selectedRows) {
-      this.selectedRowKeys = selectedRowKeys
-      this.selectedRows = selectedRows
-    },
-    toggleAdvanced () {
-      this.advanced = !this.advanced
-    },
-
-    resetSearchForm () {
-      this.queryParam = {
-        date: moment(new Date())
-      }
-    }
-  }
-}
-</script>

src/views/other/BigForm.vue

@@ -1,554 +0,0 @@
-<template>
-  <a-card :bordered="false">
-    <a-form :form="form1" :self-update="true" @submit="handleForm1Submit">
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item label="仓库名">
-            <a-input
-              placeholder="请输入仓库名称"
-              v-decorator="[
-                'name',
-                {rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="仓库域名">
-            <a-input
-              addonBefore="http://"
-              addonAfter=".com"
-              placeholder="请输入"
-              v-decorator="[
-                'url',
-                {rules: [{ required: true, message: '请输入仓库域名', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库管理员">
-            <a-select placeholder="请选择管理员" v-decorator="[ 'owner', {rules: [{ required: true, message: '请选择管理员'}]} ]">
-              <a-select-option value="王同学">王同学</a-select-option>
-              <a-select-option value="李同学">李同学</a-select-option>
-              <a-select-option value="黄同学">黄同学</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item
-            label="审批人">
-            <a-select placeholder="请选择审批员" v-decorator="[ 'approver', {rules: [{ required: true, message: '请选择审批员'}]} ]">
-              <a-select-option value="王晓丽">王晓丽</a-select-option>
-              <a-select-option value="李军">李军</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="生效日期">
-            <a-range-picker
-              style="width: 100%"
-              v-decorator="[
-                'dateRange',
-                {rules: [{ required: true, message: '请选择生效日期'}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库类型">
-            <a-select
-              placeholder="请选择仓库类型"
-              v-decorator="[
-                'type',
-                {rules: [{ required: true, message: '请选择仓库类型'}]}
-              ]" >
-              <a-select-option value="公开">公开</a-select-option>
-              <a-select-option value="私密">私密</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-form-item v-if="showSubmit">
-        <a-button htmlType="submit" >Submit</a-button>
-      </a-form-item>
-    </a-form>
-
-    <a-form :form="form2" :self-update="true" @submit="handleForm2Submit">
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item label="仓库名">
-            <a-input
-              placeholder="请输入仓库名称"
-              v-decorator="[
-                'name',
-                {rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="仓库域名">
-            <a-input
-              addonBefore="http://"
-              addonAfter=".com"
-              placeholder="请输入"
-              v-decorator="[
-                'url',
-                {rules: [{ required: true, message: '请输入仓库域名', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库管理员">
-            <a-select placeholder="请选择管理员" v-decorator="[ 'owner', {rules: [{ required: true, message: '请选择管理员'}]} ]">
-              <a-select-option value="王同学">王同学</a-select-option>
-              <a-select-option value="李同学">李同学</a-select-option>
-              <a-select-option value="黄同学">黄同学</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item
-            label="审批人">
-            <a-select placeholder="请选择审批员" v-decorator="[ 'approver', {rules: [{ required: true, message: '请选择审批员'}]} ]">
-              <a-select-option value="王晓丽">王晓丽</a-select-option>
-              <a-select-option value="李军">李军</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="生效日期">
-            <a-range-picker
-              style="width: 100%"
-              v-decorator="[
-                'dateRange',
-                {rules: [{ required: true, message: '请选择生效日期'}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库类型">
-            <a-select
-              placeholder="请选择仓库类型"
-              v-decorator="[
-                'type',
-                {rules: [{ required: true, message: '请选择仓库类型'}]}
-              ]" >
-              <a-select-option value="公开">公开</a-select-option>
-              <a-select-option value="私密">私密</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-form-item v-if="showSubmit">
-        <a-button htmlType="submit" >Submit</a-button>
-      </a-form-item>
-    </a-form>
-
-    <a-form :form="form3" :self-update="true" @submit="handleForm2Submit">
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item label="仓库名">
-            <a-input
-              placeholder="请输入仓库名称"
-              v-decorator="[
-                'name',
-                {rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="仓库域名">
-            <a-input
-              addonBefore="http://"
-              addonAfter=".com"
-              placeholder="请输入"
-              v-decorator="[
-                'url',
-                {rules: [{ required: true, message: '请输入仓库域名', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库管理员">
-            <a-select placeholder="请选择管理员" v-decorator="[ 'owner', {rules: [{ required: true, message: '请选择管理员'}]} ]">
-              <a-select-option value="王同学">王同学</a-select-option>
-              <a-select-option value="李同学">李同学</a-select-option>
-              <a-select-option value="黄同学">黄同学</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item
-            label="审批人">
-            <a-select placeholder="请选择审批员" v-decorator="[ 'approver', {rules: [{ required: true, message: '请选择审批员'}]} ]">
-              <a-select-option value="王晓丽">王晓丽</a-select-option>
-              <a-select-option value="李军">李军</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="生效日期">
-            <a-range-picker
-              style="width: 100%"
-              v-decorator="[
-                'dateRange',
-                {rules: [{ required: true, message: '请选择生效日期'}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库类型">
-            <a-select
-              placeholder="请选择仓库类型"
-              v-decorator="[
-                'type',
-                {rules: [{ required: true, message: '请选择仓库类型'}]}
-              ]" >
-              <a-select-option value="公开">公开</a-select-option>
-              <a-select-option value="私密">私密</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-form-item v-if="showSubmit">
-        <a-button htmlType="submit" >Submit</a-button>
-      </a-form-item>
-    </a-form>
-
-    <a-form :form="form4" :self-update="true" @submit="handleForm2Submit">
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item label="仓库名">
-            <a-input
-              placeholder="请输入仓库名称"
-              v-decorator="[
-                'name',
-                {rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="仓库域名">
-            <a-input
-              addonBefore="http://"
-              addonAfter=".com"
-              placeholder="请输入"
-              v-decorator="[
-                'url',
-                {rules: [{ required: true, message: '请输入仓库域名', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库管理员">
-            <a-select placeholder="请选择管理员" v-decorator="[ 'owner', {rules: [{ required: true, message: '请选择管理员'}]} ]">
-              <a-select-option value="王同学">王同学</a-select-option>
-              <a-select-option value="李同学">李同学</a-select-option>
-              <a-select-option value="黄同学">黄同学</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item
-            label="审批人">
-            <a-select placeholder="请选择审批员" v-decorator="[ 'approver', {rules: [{ required: true, message: '请选择审批员'}]} ]">
-              <a-select-option value="王晓丽">王晓丽</a-select-option>
-              <a-select-option value="李军">李军</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="生效日期">
-            <a-range-picker
-              style="width: 100%"
-              v-decorator="[
-                'dateRange',
-                {rules: [{ required: true, message: '请选择生效日期'}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库类型">
-            <a-select
-              placeholder="请选择仓库类型"
-              v-decorator="[
-                'type',
-                {rules: [{ required: true, message: '请选择仓库类型'}]}
-              ]" >
-              <a-select-option value="公开">公开</a-select-option>
-              <a-select-option value="私密">私密</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-form-item v-if="showSubmit">
-        <a-button htmlType="submit" >Submit</a-button>
-      </a-form-item>
-    </a-form>
-
-    <a-form :form="form5" :self-update="true" @submit="handleForm2Submit">
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item label="仓库名">
-            <a-input
-              placeholder="请输入仓库名称"
-              v-decorator="[
-                'name',
-                {rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="仓库域名">
-            <a-input
-              addonBefore="http://"
-              addonAfter=".com"
-              placeholder="请输入"
-              v-decorator="[
-                'url',
-                {rules: [{ required: true, message: '请输入仓库域名', whitespace: true}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库管理员">
-            <a-select placeholder="请选择管理员" v-decorator="[ 'owner', {rules: [{ required: true, message: '请选择管理员'}]} ]">
-              <a-select-option value="王同学">王同学</a-select-option>
-              <a-select-option value="李同学">李同学</a-select-option>
-              <a-select-option value="黄同学">黄同学</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row class="form-row" :gutter="16">
-        <a-col :lg="6" :md="12" :sm="24">
-          <a-form-item
-            label="审批人">
-            <a-select placeholder="请选择审批员" v-decorator="[ 'approver', {rules: [{ required: true, message: '请选择审批员'}]} ]">
-              <a-select-option value="王晓丽">王晓丽</a-select-option>
-              <a-select-option value="李军">李军</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-          <a-form-item
-            label="生效日期">
-            <a-range-picker
-              style="width: 100%"
-              v-decorator="[
-                'dateRange',
-                {rules: [{ required: true, message: '请选择生效日期'}]}
-              ]" />
-          </a-form-item>
-        </a-col>
-        <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-          <a-form-item
-            label="仓库类型">
-            <a-select
-              placeholder="请选择仓库类型"
-              v-decorator="[
-                'type',
-                {rules: [{ required: true, message: '请选择仓库类型'}]}
-              ]" >
-              <a-select-option value="公开">公开</a-select-option>
-              <a-select-option value="私密">私密</a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-form-item v-if="showSubmit">
-        <a-button htmlType="submit" >Submit</a-button>
-      </a-form-item>
-    </a-form>
-
-    <a-divider />
-
-    <a-table
-      :columns="columns"
-      :dataSource="data"
-      :pagination="false"
-      :loading="tableLoading"
-    >
-      <template v-for="(col, i) in ['name', 'workId', 'department']" :slot="col" slot-scope="text, record">
-        <a-input
-          :key="col"
-          v-if="record.editable"
-          style="margin: -5px 0"
-          :value="text"
-          :placeholder="columns[i].title"
-          @change="e => handleChange(e.target.value, record.key, col)"
-        />
-        <template v-else>{{ text }}</template>
-      </template>
-      <template slot="operation" slot-scope="text, record">
-        <template v-if="record.editable">
-          <span v-if="record.isNew">
-            <a @click="saveRow(record)">添加</a>
-            <a-divider type="vertical" />
-            <a-popconfirm title="是否要删除此行？" @confirm="remove(record.key)">
-              <a>删除</a>
-            </a-popconfirm>
-          </span>
-          <span v-else>
-            <a @click="saveRow(record)">保存</a>
-            <a-divider type="vertical" />
-            <a @click="cancel(record.key)">取消</a>
-          </span>
-        </template>
-        <span v-else>
-          <a @click="toggle(record.key)">编辑</a>
-          <a-divider type="vertical" />
-          <a-popconfirm title="是否要删除此行？" @confirm="remove(record.key)">
-            <a>删除</a>
-          </a-popconfirm>
-        </span>
-      </template>
-    </a-table>
-    <a-button style="width: 100%; margin-top: 16px; margin-bottom: 8px" type="dashed" icon="plus" @click="newMember">新增成员</a-button>
-
-  </a-card>
-</template>
-
-<script>
-const columns = [
-  {
-    title: '成员姓名',
-    dataIndex: 'name',
-    key: 'name',
-    width: '20%',
-    scopedSlots: { customRender: 'name' }
-  },
-  {
-    title: '工号',
-    dataIndex: 'workId',
-    key: 'workId',
-    width: '20%',
-    scopedSlots: { customRender: 'workId' }
-  },
-  {
-    title: '所属部门',
-    dataIndex: 'department',
-    key: 'department',
-    width: '40%',
-    scopedSlots: { customRender: 'department' }
-  },
-  {
-    title: '操作',
-    key: 'action',
-    scopedSlots: { customRender: 'operation' }
-  }
-]
-
-export default {
-  name: 'BigForm',
-  data () {
-    return {
-      showSubmit: true,
-      form1: this.$form.createForm(this),
-      form2: this.$form.createForm(this),
-      form3: this.$form.createForm(this),
-      form4: this.$form.createForm(this),
-      form5: this.$form.createForm(this),
-      tableLoading: false,
-      columns,
-      data: [{
-        key: '1',
-        name: '小明',
-        workId: '001',
-        editable: false,
-        department: '行政部'
-      },
-        {
-          key: '2',
-          name: '李莉',
-          workId: '002',
-          editable: false,
-          department: 'IT部'
-        },
-        {
-          key: '3',
-          name: '王小帅',
-          workId: '003',
-          editable: false,
-          department: '财务部'
-        }]
-    }
-  },
-  mounted () {
-    // 加 10 个表单行
-    new Array(10).fill(0).forEach(() => {
-      this.newMember()
-    })
-  },
-  methods: {
-    handleForm1Submit (e) {
-      e.preventDefault()
-      this.form1.validateFields()
-    },
-    handleForm2Submit (e) {
-      e.preventDefault()
-      this.form2.validateFields()
-    },
-
-    handleChange (value, key, column) {
-      const target = this.data.find(item => key === item.key)
-      if (target) {
-        target[column] = value
-      }
-    },
-
-    toggle (record) {
-
-    },
-    saveRow (record) {
-
-    },
-    cancel (key) {
-
-    },
-    remove (key) {
-      this.data = this.data.filter(item => item.key !== key)
-    },
-
-    newMember () {
-      const length = this.data.length
-      this.data.push({
-        key: length === 0 ? '1' : (parseInt(this.data[length - 1].key) + 1).toString(),
-        name: '',
-        workId: '',
-        department: '',
-        editable: true,
-        isNew: true
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/other/IconSelectorView.vue

@@ -1,36 +0,0 @@
-<template>
-  <a-card :body-style="{padding: '24px 32px'}" :bordered="false">
-    <icon-selector v-model="currentSelectedIcon" @change="handleIconChange"/>
-
-    <a-divider />
-    <p>测试 IconSelector 组件 v-model 功能</p>
-    <a-button @click="changeIcon('down')">改变 Icon-down</a-button>
-    <a-divider type="vertical" />
-    <a-button @click="changeIcon('cloud-download')">改变 Icon-cloud-download</a-button>
-  </a-card>
-</template>
-
-<script>
-import IconSelector from '@/components/IconSelector'
-
-export default {
-  name: 'IconSelectorView',
-  components: {
-    IconSelector
-  },
-  data () {
-    return {
-      currentSelectedIcon: 'pause-circle'
-    }
-  },
-  methods: {
-    handleIconChange (icon) {
-      console.log('change Icon', icon)
-      this.$message.info(<span>选中图标 <code>{icon}</code></span>)
-    },
-    changeIcon (type) {
-      this.currentSelectedIcon = type
-    }
-  }
-}
-</script>

src/views/other/PermissionList.vue

@@ -1,272 +0,0 @@
-<template>
-  <a-card :bordered="false">
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline">
-        <a-row :gutter="48">
-          <a-col :md="8" :sm="24">
-            <a-form-item label="角色ID">
-              <a-input placeholder="请输入"/>
-            </a-form-item>
-          </a-col>
-          <a-col :md="8" :sm="24">
-            <a-form-item label="状态">
-              <a-select placeholder="请选择" default-value="0">
-                <a-select-option value="0">全部</a-select-option>
-                <a-select-option value="1">关闭</a-select-option>
-                <a-select-option value="2">运行中</a-select-option>
-              </a-select>
-            </a-form-item>
-          </a-col>
-          <a-col :md="8" :sm="24">
-            <span class="table-page-search-submitButtons">
-              <a-button type="primary">查询</a-button>
-              <a-button style="margin-left: 8px">重置</a-button>
-            </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-
-    <s-table :columns="columns" :data="loadData">
-
-      <span slot="actions" slot-scope="text, record">
-        <a-tag v-for="(action, index) in record.actionList" :key="index">{{ action.describe }}</a-tag>
-      </span>
-
-      <span slot="status" slot-scope="text">
-        {{ text | statusFilter }}
-      </span>
-
-      <span slot="action" slot-scope="text, record">
-        <a @click="handleEdit(record)">编辑</a>
-        <a-divider type="vertical" />
-        <a-dropdown>
-          <a class="ant-dropdown-link">
-            更多 <a-icon type="down" />
-          </a>
-          <a-menu slot="overlay">
-            <a-menu-item>
-              <a href="javascript:;">详情</a>
-            </a-menu-item>
-            <a-menu-item>
-              <a href="javascript:;">禁用</a>
-            </a-menu-item>
-            <a-menu-item>
-              <a href="javascript:;">删除</a>
-            </a-menu-item>
-          </a-menu>
-        </a-dropdown>
-      </span>
-    </s-table>
-
-    <a-modal
-      title="操作"
-      :width="800"
-      v-model="visible"
-      @ok="handleOk"
-    >
-      <a-form :autoFormCreate="(form)=>{this.form = form}">
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="唯一识别码"
-          hasFeedback
-          validateStatus="success"
-        >
-          <a-input placeholder="唯一识别码" v-model="mdl.id" id="no" disabled="disabled" />
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="权限名称"
-          hasFeedback
-          validateStatus="success"
-        >
-          <a-input placeholder="起一个名字" v-model="mdl.name" id="permission_name" />
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="状态"
-          hasFeedback
-          validateStatus="warning"
-        >
-          <a-select v-model="mdl.status">
-            <a-select-option value="1">正常</a-select-option>
-            <a-select-option value="2">禁用</a-select-option>
-          </a-select>
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="描述"
-          hasFeedback
-        >
-          <a-textarea :rows="5" v-model="mdl.describe" placeholder="..." id="describe"/>
-        </a-form-item>
-
-        <a-divider />
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="赋予权限"
-          hasFeedback
-        >
-          <a-select
-            style="width: 100%"
-            mode="multiple"
-            v-model="mdl.actions"
-            :allowClear="true"
-          >
-            <a-select-option v-for="(action, index) in permissionList" :key="index" :value="action.value">{{ action.label }}</a-select-option>
-          </a-select>
-        </a-form-item>
-
-      </a-form>
-    </a-modal>
-
-  </a-card>
-</template>
-
-<script>
-import { STable } from '@/components'
-
-export default {
-  name: 'TableList',
-  components: {
-    STable
-  },
-  data () {
-    return {
-      description: '列表使用场景：后台管理中的权限管理以及角色管理，可用于基于 RBAC 设计的角色权限控制，颗粒度细到每一个操作类型。',
-
-      visible: false,
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 5 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 16 }
-      },
-      form: null,
-      mdl: {},
-
-      // 高级搜索 展开/关闭
-      advanced: false,
-      // 查询参数
-      queryParam: {},
-      // 表头
-      columns: [
-        {
-          title: '唯一识别码',
-          dataIndex: 'id'
-        },
-        {
-          title: '权限名称',
-          dataIndex: 'name'
-        },
-        {
-          title: '可操作权限',
-          dataIndex: 'actions',
-          scopedSlots: { customRender: 'actions' }
-        },
-        {
-          title: '状态',
-          dataIndex: 'status',
-          scopedSlots: { customRender: 'status' }
-        },
-        {
-          title: '操作',
-          width: '150px',
-          dataIndex: 'action',
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      // 向后端拉取可以用的操作列表
-      permissionList: null,
-      // 加载数据方法 必须为 Promise 对象
-      loadData: parameter => {
-        return this.$http.get('/permission', {
-          params: Object.assign(parameter, this.queryParam)
-        }).then(res => {
-          const result = res.result
-          result.data.map(permission => {
-            permission.actionList = JSON.parse(permission.actionData)
-            return permission
-          })
-          return result
-        })
-      },
-
-      selectedRowKeys: [],
-      selectedRows: []
-    }
-  },
-  filters: {
-    statusFilter (status) {
-      const statusMap = {
-        1: '正常',
-        2: '禁用'
-      }
-      return statusMap[status]
-    }
-  },
-  created () {
-    this.loadPermissionList()
-  },
-  methods: {
-    loadPermissionList () {
-      // permissionList
-      new Promise(resolve => {
-        const data = [
-          { label: '新增', value: 'add', defaultChecked: false },
-          { label: '查询', value: 'get', defaultChecked: false },
-          { label: '修改', value: 'update', defaultChecked: false },
-          { label: '列表', value: 'query', defaultChecked: false },
-          { label: '删除', value: 'delete', defaultChecked: false },
-          { label: '导入', value: 'import', defaultChecked: false },
-          { label: '导出', value: 'export', defaultChecked: false }
-        ]
-        setTimeout(resolve(data), 1500)
-      }).then(res => {
-        this.permissionList = res
-      })
-    },
-    handleEdit (record) {
-      this.mdl = Object.assign({}, record)
-      console.log(this.mdl)
-      this.visible = true
-    },
-    handleOk () {
-
-    },
-    onChange (selectedRowKeys, selectedRows) {
-      this.selectedRowKeys = selectedRowKeys
-      this.selectedRows = selectedRows
-    },
-    toggleAdvanced () {
-      this.advanced = !this.advanced
-    }
-  },
-  watch: {
-    /*
-      'selectedRows': function (selectedRows) {
-        this.needTotalList = this.needTotalList.map(item => {
-          return {
-            ...item,
-            total: selectedRows.reduce( (sum, val) => {
-              return sum + val[item.dataIndex]
-            }, 0)
-          }
-        })
-      }
-      */
-  }
-}
-</script>

src/views/other/RoleList.vue

@@ -1,182 +0,0 @@
-<template>
-  <a-card :bordered="false">
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline">
-        <a-row :gutter="48">
-          <a-col :md="8" :sm="24">
-            <a-form-item label="角色ID">
-              <a-input placeholder="请输入"/>
-            </a-form-item>
-          </a-col>
-          <a-col :md="8" :sm="24">
-            <a-form-item label="状态">
-              <a-select placeholder="请选择" default-value="0">
-                <a-select-option value="0">全部</a-select-option>
-                <a-select-option value="1">正常</a-select-option>
-                <a-select-option value="2">禁用</a-select-option>
-              </a-select>
-            </a-form-item>
-          </a-col>
-          <a-col :md="8" :sm="24">
-            <span class="table-page-search-submitButtons">
-              <a-button type="primary">查询</a-button>
-              <a-button style="margin-left: 8px">重置</a-button>
-            </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-
-    <s-table
-      ref="table"
-      size="default"
-      :columns="columns"
-      :data="loadData"
-    >
-      <div
-        slot="expandedRowRender"
-        slot-scope="record"
-        style="margin: 0">
-        <a-row
-          :gutter="24"
-          :style="{ marginBottom: '12px' }">
-          <a-col :span="12" v-for="(role, index) in record.permissions" :key="index" :style="{ marginBottom: '12px' }">
-            <a-col :span="4">
-              <span>{{ role.permissionName }}：</span>
-            </a-col>
-            <a-col :span="20" v-if="role.actionEntitySet.length > 0">
-              <a-tag color="cyan" v-for="(action, k) in role.actionEntitySet" :key="k">{{ action.describe }}</a-tag>
-            </a-col>
-            <a-col :span="20" v-else>-</a-col>
-          </a-col>
-        </a-row>
-      </div>
-      <span slot="action" slot-scope="text, record">
-        <a @click="$refs.modal.edit(record)">编辑</a>
-        <a-divider type="vertical" />
-        <a-dropdown>
-          <a class="ant-dropdown-link">
-            更多 <a-icon type="down" />
-          </a>
-          <a-menu slot="overlay">
-            <a-menu-item>
-              <a href="javascript:;">详情</a>
-            </a-menu-item>
-            <a-menu-item>
-              <a href="javascript:;">禁用</a>
-            </a-menu-item>
-            <a-menu-item>
-              <a href="javascript:;">删除</a>
-            </a-menu-item>
-          </a-menu>
-        </a-dropdown>
-      </span>
-    </s-table>
-
-    <role-modal ref="modal" @ok="handleOk"></role-modal>
-
-  </a-card>
-</template>
-
-<script>
-import { STable } from '@/components'
-import RoleModal from './modules/RoleModal'
-
-export default {
-  name: 'TableList',
-  components: {
-    STable,
-    RoleModal
-  },
-  data () {
-    return {
-      description: '列表使用场景：后台管理中的权限管理以及角色管理，可用于基于 RBAC 设计的角色权限控制，颗粒度细到每一个操作类型。',
-
-      visible: false,
-
-      form: null,
-      mdl: {},
-
-      // 高级搜索 展开/关闭
-      advanced: false,
-      // 查询参数
-      queryParam: {},
-      // 表头
-      columns: [
-        {
-          title: '唯一识别码',
-          dataIndex: 'id'
-        },
-        {
-          title: '角色名称',
-          dataIndex: 'name'
-        },
-        {
-          title: '状态',
-          dataIndex: 'status'
-        },
-        {
-          title: '创建时间',
-          dataIndex: 'createTime',
-          sorter: true
-        }, {
-          title: '操作',
-          width: '150px',
-          dataIndex: 'action',
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      // 加载数据方法 必须为 Promise 对象
-      loadData: parameter => {
-        return this.$http.get('/role', {
-          params: Object.assign(parameter, this.queryParam)
-        }).then(res => {
-          return res.result
-        })
-      },
-
-      selectedRowKeys: [],
-      selectedRows: []
-    }
-  },
-  methods: {
-    handleEdit (record) {
-      this.mdl = Object.assign({}, record)
-
-      this.mdl.permissions.forEach(permission => {
-        permission.actionsOptions = permission.actionEntitySet.map(action => {
-          return { label: action.describe, value: action.action, defaultCheck: action.defaultCheck }
-        })
-      })
-
-      console.log(this.mdl)
-      this.visible = true
-    },
-    handleOk () {
-      // 新增/修改 成功时，重载列表
-      this.$refs.table.refresh()
-    },
-    onChange (selectedRowKeys, selectedRows) {
-      this.selectedRowKeys = selectedRowKeys
-      this.selectedRows = selectedRows
-    },
-    toggleAdvanced () {
-      this.advanced = !this.advanced
-    }
-  },
-  watch: {
-    /*
-      'selectedRows': function (selectedRows) {
-        this.needTotalList = this.needTotalList.map(item => {
-          return {
-            ...item,
-            total: selectedRows.reduce( (sum, val) => {
-              return sum + val[item.dataIndex]
-            }, 0)
-          }
-        })
-      }
-      */
-  }
-}
-</script>

src/views/other/TableInnerEditList.vue

@@ -1,266 +0,0 @@
-<template>
-  <a-card :bordered="false">
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline">
-        <a-row :gutter="48">
-          <a-col :md="8" :sm="24">
-            <a-form-item label="规则编号">
-              <a-input placeholder=""/>
-            </a-form-item>
-          </a-col>
-          <a-col :md="8" :sm="24">
-            <a-form-item label="使用状态">
-              <a-select placeholder="请选择" default-value="0">
-                <a-select-option value="0">全部</a-select-option>
-                <a-select-option value="1">关闭</a-select-option>
-                <a-select-option value="2">运行中</a-select-option>
-              </a-select>
-            </a-form-item>
-          </a-col>
-          <template v-if="advanced">
-            <a-col :md="8" :sm="24">
-              <a-form-item label="调用次数">
-                <a-input-number style="width: 100%"/>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item label="更新日期">
-                <a-date-picker style="width: 100%" placeholder="请输入更新日期"/>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item label="使用状态">
-                <a-select placeholder="请选择" default-value="0">
-                  <a-select-option value="0">全部</a-select-option>
-                  <a-select-option value="1">关闭</a-select-option>
-                  <a-select-option value="2">运行中</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item label="使用状态">
-                <a-select placeholder="请选择" default-value="0">
-                  <a-select-option value="0">全部</a-select-option>
-                  <a-select-option value="1">关闭</a-select-option>
-                  <a-select-option value="2">运行中</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-          </template>
-          <a-col :md="!advanced && 8 || 24" :sm="24">
-            <span class="table-page-search-submitButtons" :style="advanced && { float: 'right', overflow: 'hidden' } || {} ">
-              <a-button type="primary">查询</a-button>
-              <a-button style="margin-left: 8px">重置</a-button>
-              <a @click="toggleAdvanced" style="margin-left: 8px">
-                {{ advanced ? '收起' : '展开' }}
-                <a-icon :type="advanced ? 'up' : 'down'"/>
-              </a>
-            </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-
-    <div class="table-operator">
-      <a-button type="primary" icon="plus">新建</a-button>
-      <a-dropdown v-if="selectedRowKeys.length > 0">
-        <a-menu slot="overlay">
-          <a-menu-item key="1"><a-icon type="delete" />删除</a-menu-item>
-          <!-- lock | unlock -->
-          <a-menu-item key="2"><a-icon type="lock" />锁定</a-menu-item>
-        </a-menu>
-        <a-button style="margin-left: 8px">
-          批量操作 <a-icon type="down" />
-        </a-button>
-      </a-dropdown>
-    </div>
-
-    <s-table
-      ref="table"
-      size="default"
-      :columns="columns"
-      :data="loadData"
-      :alert="{ show: true, clear: true }"
-      :rowSelection="{ selectedRowKeys: this.selectedRowKeys, onChange: this.onSelectChange }"
-    >
-      <template v-for="(col, index) in columns" v-if="col.scopedSlots" :slot="col.dataIndex" slot-scope="text, record">
-        <div :key="index">
-          <a-input
-            v-if="record.editable"
-            style="margin: -5px 0"
-            :value="text"
-            @change="e => handleChange(e.target.value, record.key, col, record)"
-          />
-          <template v-else>{{ text }}</template>
-        </div>
-      </template>
-      <template slot="action" slot-scope="text, record">
-        <div class="editable-row-operations">
-          <span v-if="record.editable">
-            <a @click="() => save(record)">保存</a>
-            <a-divider type="vertical" />
-            <a-popconfirm title="真的放弃编辑吗?" @confirm="() => cancel(record)">
-              <a>取消</a>
-            </a-popconfirm>
-          </span>
-          <span v-else>
-            <a class="edit" @click="() => edit(record)">修改</a>
-            <a-divider type="vertical" />
-            <a class="delete" @click="() => del(record)">删除</a>
-          </span>
-        </div>
-      </template>
-    </s-table>
-
-  </a-card>
-</template>
-
-<script>
-import { STable } from '@/components'
-
-export default {
-  name: 'TableList',
-  components: {
-    STable
-  },
-  data () {
-    return {
-      // 高级搜索 展开/关闭
-      advanced: false,
-      // 查询参数
-      queryParam: {},
-      // 表头
-      columns: [
-        {
-          title: '规则编号',
-          dataIndex: 'no',
-          width: 90
-        },
-        {
-          title: '描述',
-          dataIndex: 'description',
-          scopedSlots: { customRender: 'description' }
-        },
-        {
-          title: '服务调用次数',
-          dataIndex: 'callNo',
-          width: '150px',
-          sorter: true,
-          needTotal: true,
-          scopedSlots: { customRender: 'callNo' }
-          // customRender: (text) => text + ' 次'
-        },
-        {
-          title: '状态',
-          dataIndex: 'status',
-          width: '100px',
-          needTotal: true,
-          scopedSlots: { customRender: 'status' }
-        },
-        {
-          title: '更新时间',
-          dataIndex: 'updatedAt',
-          width: '200px',
-          sorter: true,
-          scopedSlots: { customRender: 'updatedAt' }
-        },
-        {
-          table: '操作',
-          dataIndex: 'action',
-          width: '120px',
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      // 加载数据方法 必须为 Promise 对象
-      loadData: parameter => {
-        return this.$http.get('/service', {
-          params: Object.assign(parameter, this.queryParam)
-        }).then(res => {
-          return res.result
-        })
-      },
-
-      selectedRowKeys: [],
-      selectedRows: []
-    }
-  },
-  methods: {
-
-    handleChange (value, key, column, record) {
-      record[column.dataIndex] = value
-    },
-    edit (row) {
-      row.editable = true
-      // row = Object.assign({}, row)
-    },
-    // eslint-disable-next-line
-    del (row) {
-      this.$confirm({
-        title: '警告',
-        content: `真的要删除 ${row.no} 吗?`,
-        okText: '删除',
-        okType: 'danger',
-        cancelText: '取消',
-        onOk () {
-          // 在这里调用删除接口
-          return new Promise((resolve, reject) => {
-            setTimeout(Math.random() > 0.5 ? resolve : reject, 1000)
-          }).catch(() => console.log('Oops errors!'))
-        },
-        onCancel () {
-          console.log('Cancel')
-        }
-      })
-    },
-    save (row) {
-      row.editable = false
-    },
-    cancel (row) {
-      row.editable = false
-    },
-
-    onSelectChange (selectedRowKeys, selectedRows) {
-      this.selectedRowKeys = selectedRowKeys
-      this.selectedRows = selectedRows
-    },
-    toggleAdvanced () {
-      this.advanced = !this.advanced
-    }
-  },
-  watch: {
-    /*
-      'selectedRows': function (selectedRows) {
-        this.needTotalList = this.needTotalList.map(item => {
-          return {
-            ...item,
-            total: selectedRows.reduce( (sum, val) => {
-              return sum + val[item.dataIndex]
-            }, 0)
-          }
-        })
-      }
-      */
-  }
-}
-</script>
-
-<style lang="less" scoped>
-  .search {
-    margin-bottom: 54px;
-  }
-
-  .fold {
-    width: calc(100% - 216px);
-    display: inline-block
-  }
-
-  .operator {
-    margin-bottom: 18px;
-  }
-
-  @media screen and (max-width: 900px) {
-    .fold {
-      width: 100%;
-    }
-  }
-</style>

src/views/other/TreeList.vue

@@ -1,192 +0,0 @@
-<template>
-  <a-card :bordered="false">
-    <a-row :gutter="8">
-      <a-col :span="5">
-        <s-tree
-          :dataSource="orgTree"
-          :openKeys.sync="openKeys"
-          :search="true"
-          @click="handleClick"
-          @add="handleAdd"
-          @titleClick="handleTitleClick"></s-tree>
-      </a-col>
-      <a-col :span="19">
-        <s-table
-          ref="table"
-          size="default"
-          :columns="columns"
-          :data="loadData"
-          :alert="false"
-          :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
-        >
-          <span slot="action" slot-scope="text, record">
-            <template v-if="$auth('table.update')">
-              <a @click="handleEdit(record)">编辑</a>
-              <a-divider type="vertical" />
-            </template>
-            <a-dropdown>
-              <a class="ant-dropdown-link">
-                更多 <a-icon type="down" />
-              </a>
-              <a-menu slot="overlay">
-                <a-menu-item>
-                  <a href="javascript:;">详情</a>
-                </a-menu-item>
-                <a-menu-item v-if="$auth('table.disable')">
-                  <a href="javascript:;">禁用</a>
-                </a-menu-item>
-                <a-menu-item v-if="$auth('table.delete')">
-                  <a href="javascript:;">删除</a>
-                </a-menu-item>
-              </a-menu>
-            </a-dropdown>
-          </span>
-        </s-table>
-      </a-col>
-    </a-row>
-
-    <org-modal ref="modal" @ok="handleSaveOk" @close="handleSaveClose" />
-  </a-card>
-</template>
-
-<script>
-import STree from '@/components/Tree/Tree'
-import { STable } from '@/components'
-import OrgModal from './modules/OrgModal'
-import { getOrgTree, getServiceList } from '@/api/manage'
-
-export default {
-  name: 'TreeList',
-  components: {
-    STable,
-    STree,
-    OrgModal
-  },
-  data () {
-    return {
-      openKeys: ['key-01'],
-
-      // 查询参数
-      queryParam: {},
-      // 表头
-      columns: [
-        {
-          title: '#',
-          dataIndex: 'no'
-        },
-        {
-          title: '成员名称',
-          dataIndex: 'description'
-        },
-        {
-          title: '登录次数',
-          dataIndex: 'callNo',
-          sorter: true,
-          needTotal: true,
-          customRender: (text) => text + ' 次'
-        },
-        {
-          title: '状态',
-          dataIndex: 'status',
-          needTotal: true
-        },
-        {
-          title: '更新时间',
-          dataIndex: 'updatedAt',
-          sorter: true
-        },
-        {
-          title: '操作',
-          dataIndex: 'action',
-          width: '150px',
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      // 加载数据方法 必须为 Promise 对象
-      loadData: parameter => {
-        return getServiceList(Object.assign(parameter, this.queryParam))
-          .then(res => {
-            return res.result
-          })
-      },
-      orgTree: [],
-      selectedRowKeys: [],
-      selectedRows: []
-    }
-  },
-  created () {
-    getOrgTree().then(res => {
-      this.orgTree = res.result
-    })
-  },
-  methods: {
-    handleClick (e) {
-      console.log('handleClick', e)
-      this.queryParam = {
-        key: e.key
-      }
-      this.$refs.table.refresh(true)
-    },
-    handleAdd (item) {
-      console.log('add button, item', item)
-      this.$message.info(`提示：你点了 ${item.key} - ${item.title} `)
-      this.$refs.modal.add(item.key)
-    },
-    handleTitleClick (item) {
-      console.log('handleTitleClick', item)
-    },
-    titleClick (e) {
-      console.log('titleClick', e)
-    },
-    handleSaveOk () {
-
-    },
-    handleSaveClose () {
-
-    },
-
-    onSelectChange (selectedRowKeys, selectedRows) {
-      this.selectedRowKeys = selectedRowKeys
-      this.selectedRows = selectedRows
-    }
-  }
-}
-</script>
-
-<style lang="less">
-  .custom-tree {
-
-    :deep(.ant-menu-item-group-title) {
-      position: relative;
-      &:hover {
-        .btn {
-          display: block;
-        }
-      }
-    }
-
-    :deep(.ant-menu-item) {
-      &:hover {
-        .btn {
-          display: block;
-        }
-      }
-    }
-
-    :deep(.btn) {
-      display: none;
-      position: absolute;
-      top: 0;
-      right: 10px;
-      width: 20px;
-      height: 40px;
-      line-height: 40px;
-      z-index: 1050;
-
-      &:hover {
-        transform: scale(1.2);
-        transition: 0.5s all;
-      }
-    }
-  }
-</style>

src/views/other/UserList.vue

@@ -1,340 +0,0 @@
-<template>
-  <a-card :bordered="false">
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline">
-        <a-row :gutter="48">
-          <a-col :md="8" :sm="24">
-            <a-form-item label="角色ID">
-              <a-input placeholder="请输入"/>
-            </a-form-item>
-          </a-col>
-          <a-col :md="8" :sm="24">
-            <a-form-item label="状态">
-              <a-select placeholder="请选择" default-value="0">
-                <a-select-option value="0">全部</a-select-option>
-                <a-select-option value="1">关闭</a-select-option>
-                <a-select-option value="2">运行中</a-select-option>
-              </a-select>
-            </a-form-item>
-          </a-col>
-          <a-col :md="8" :sm="24">
-            <span class="table-page-search-submitButtons">
-              <a-button type="primary">查询</a-button>
-              <a-button style="margin-left: 8px">重置</a-button>
-            </span>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-
-    <s-table
-      row-key="id"
-      size="default"
-      :columns="columns"
-      :data="loadData"
-      :expandedRowKeys="expandedRowKeys"
-      @expand="handleExpand"
-    >
-      <div
-        slot="expandedRowRender"
-        slot-scope="record"
-        style="margin: 0">
-        <a-row
-          :gutter="24"
-          :style="{ marginBottom: '12px' }">
-          <a-col :span="12" v-for="(role, index) in record.permissions" :key="index" :style="{ marginBottom: '12px', height: '23px' }">
-            <a-col :lg="4" :md="24">
-              <span>{{ role.permissionName }}：</span>
-            </a-col>
-            <a-col :lg="20" :md="24" v-if="role.actionList && role.actionList.length > 0">
-              <a-tag color="cyan" v-for="action in role.actionList" :key="action">{{ action | permissionFilter }}</a-tag>
-            </a-col>
-            <a-col :span="20" v-else>-</a-col>
-          </a-col>
-        </a-row>
-      </div>
-      <a-tag color="blue" slot="status" slot-scope="text">{{ text | statusFilter }}</a-tag>
-      <span slot="createTime" slot-scope="text">{{ text | moment }}</span>
-      <span slot="action" slot-scope="text, record">
-        <a @click="handleEdit(record)">编辑</a>
-        <a-divider type="vertical" />
-        <a-dropdown>
-          <a class="ant-dropdown-link">
-            更多 <a-icon type="down" />
-          </a>
-          <a-menu slot="overlay">
-            <a-menu-item>
-              <a href="javascript:;">详情</a>
-            </a-menu-item>
-            <a-menu-item>
-              <a href="javascript:;">禁用</a>
-            </a-menu-item>
-            <a-menu-item>
-              <a href="javascript:;">删除</a>
-            </a-menu-item>
-          </a-menu>
-        </a-dropdown>
-      </span>
-    </s-table>
-
-    <a-modal
-      title="操作"
-      style="top: 20px;"
-      :width="800"
-      v-model="visible"
-      @ok="handleOk"
-    >
-      <a-form class="permission-form" :form="form">
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="唯一识别码"
-          hasFeedback
-          validateStatus="success"
-        >
-          <a-input
-            placeholder="唯一识别码"
-            disabled="disabled"
-            v-decorator="['id']"
-          />
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="角色名称"
-          hasFeedback
-          validateStatus="success"
-        >
-          <a-input
-            placeholder="起一个名字"
-            v-decorator="['name']"
-          />
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="状态"
-          hasFeedback
-          validateStatus="warning"
-        >
-          <a-select v-decorator="['status', { initialValue: 1 }]">
-            <a-select-option :value="1">正常</a-select-option>
-            <a-select-option :value="2">禁用</a-select-option>
-          </a-select>
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="描述"
-          hasFeedback
-        >
-          <a-textarea
-            :rows="5"
-            placeholder="..."
-            id="describe"
-            v-decorator="['describe']"
-          />
-        </a-form-item>
-
-        <a-divider>拥有权限</a-divider>
-        <template v-for="permission in permissions">
-          <a-form-item
-            class="permission-group"
-            v-if="permission.actionsOptions && permission.actionsOptions.length > 0"
-            :labelCol="labelCol"
-            :wrapperCol="wrapperCol"
-            :key="permission.permissionId"
-            :label="permission.permissionName"
-          >
-            <a-checkbox>全选</a-checkbox>
-            <a-checkbox-group v-decorator="[`permissions.${permission.permissionId}`]" :options="permission.actionsOptions"/>
-          </a-form-item>
-        </template>
-
-      </a-form>
-    </a-modal>
-
-  </a-card>
-</template>
-
-<script>
-import pick from 'lodash.pick'
-import { STable } from '@/components'
-import { getRoleList, getServiceList } from '@/api/manage'
-import { PERMISSION_ENUM } from '@/core/permission/permission'
-
-const STATUS = {
-  1: '启用',
-  2: '禁用'
-}
-
-const columns = [
-  {
-    title: '唯一识别码',
-    dataIndex: 'id'
-  },
-  {
-    title: '角色名称',
-    dataIndex: 'name'
-  },
-  {
-    title: '状态',
-    dataIndex: 'status',
-    scopedSlots: { customRender: 'status' }
-  },
-  {
-    title: '创建时间',
-    dataIndex: 'createTime',
-    scopedSlots: { customRender: 'createTime' },
-    sorter: true
-  }, {
-    title: '操作',
-    width: '150px',
-    dataIndex: 'action',
-    scopedSlots: { customRender: 'action' }
-  }
-]
-
-export default {
-  name: 'TableList',
-  components: {
-    STable
-  },
-  data () {
-    return {
-      description: '列表使用场景：后台管理中的权限管理以及角色管理，可用于基于 RBAC 设计的角色权限控制，颗粒度细到每一个操作类型。',
-
-      visible: false,
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 5 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 16 }
-      },
-      form: this.$form.createForm(this),
-      permissions: [],
-
-      // 高级搜索 展开/关闭
-      advanced: false,
-      // 查询参数
-      queryParam: {},
-      // 表头
-      columns,
-      // 加载数据方法 必须为 Promise 对象
-      loadData: parameter => {
-        return getRoleList(parameter)
-          .then(res => {
-            console.log('getRoleList', res)
-            // 展开全部行
-            this.expandedRowKeys = res.result.data.map(item => item.id)
-            return res.result
-          })
-      },
-
-      expandedRowKeys: [],
-      selectedRowKeys: [],
-      selectedRows: []
-    }
-  },
-  filters: {
-    statusFilter (key) {
-      return STATUS[key]
-    },
-    permissionFilter (key) {
-      const permission = PERMISSION_ENUM[key]
-      return permission && permission.label
-    }
-  },
-  created () {
-    getServiceList().then(res => {
-      console.log('getServiceList.call()', res)
-    })
-
-    getRoleList().then(res => {
-      console.log('getRoleList.call()', res)
-    })
-  },
-  methods: {
-    handleEdit (record) {
-      this.visible = true
-      console.log('record', record)
-
-      const checkboxGroup = {}
-      this.permissions = record.permissions.map(permission => {
-        const groupKey = `permissions.${permission.permissionId}`
-        checkboxGroup[groupKey] = permission.actionList
-        const actionsOptions = permission.actionEntitySet.map(action => {
-          return {
-            label: action.describe,
-            value: action.action,
-            defaultCheck: action.defaultCheck
-          }
-        })
-        return {
-          ...permission,
-          actionsOptions
-        }
-      })
-
-      this.$nextTick(() => {
-        console.log('permissions', this.permissions)
-        console.log('checkboxGroup', checkboxGroup)
-
-        this.form.setFieldsValue(pick(record, ['id', 'status', 'describe', 'name']))
-        this.form.setFieldsValue(checkboxGroup)
-      })
-    },
-    handleOk (e) {
-      e.preventDefault()
-      this.form.validateFields((err, values) => {
-        console.log(err, values)
-      })
-    },
-    onChange (selectedRowKeys, selectedRows) {
-      this.selectedRowKeys = selectedRowKeys
-      this.selectedRows = selectedRows
-    },
-    handleExpand (expanded, record) {
-      console.log('expanded', expanded, record)
-      if (expanded) {
-        this.expandedRowKeys.push(record.id)
-      } else {
-        this.expandedRowKeys = this.expandedRowKeys.filter(item => record.id !== item)
-      }
-    },
-    toggleAdvanced () {
-      this.advanced = !this.advanced
-    }
-  },
-  watch: {
-    /*
-      'selectedRows': function (selectedRows) {
-        this.needTotalList = this.needTotalList.map(item => {
-          return {
-            ...item,
-            total: selectedRows.reduce( (sum, val) => {
-              return sum + val[item.dataIndex]
-            }, 0)
-          }
-        })
-      }
-      */
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.permission-form {
-  :deep(.permission-group) {
-    margin-top: 0;
-    margin-bottom: 0;
-  }
-}
-
-</style>

src/views/other/modules/OrgModal.vue

@@ -1,100 +0,0 @@
-<template>
-  <a-modal
-    title="操作"
-    :width="600"
-    :visible="visible"
-    :confirmLoading="confirmLoading"
-    @ok="handleOk"
-    @cancel="handleCancel"
-  >
-    <a-spin :spinning="confirmLoading">
-      <a-form :form="form">
-
-        <a-form-item
-          label="父级ID"
-        >
-          <a-input v-decorator="['parentId', {}]" disabled />
-        </a-form-item>
-
-        <a-form-item
-          label="机构名称"
-        >
-          <a-input v-decorator="['orgName', {}]" />
-        </a-form-item>
-      </a-form>
-    </a-spin>
-  </a-modal>
-</template>
-
-<script>
-export default {
-  name: 'OrgModal',
-  data () {
-    return {
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 5 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 16 }
-      },
-      visible: false,
-      confirmLoading: false,
-      mdl: {}
-    }
-  },
-  beforeCreate () {
-    this.form = this.$form.createForm(this)
-    console.log('form::', this.form)
-  },
-  created () {
-
-  },
-  methods: {
-    add (id) {
-      this.edit({ parentId: id })
-    },
-    edit (record) {
-      this.mdl = Object.assign({}, record)
-      this.visible = true
-      this.$nextTick(() => {
-        this.form.setFieldsValue({ ...record })
-      })
-    },
-    close () {
-      this.$emit('close')
-      this.visible = false
-    },
-    handleOk () {
-      const _this = this
-      // 触发表单验证
-      this.form.validateFields((err, values) => {
-        // 验证表单没错误
-        if (!err) {
-          console.log('form values', values)
-
-          _this.confirmLoading = true
-          // 模拟后端请求 2000 毫秒延迟
-          new Promise((resolve) => {
-            setTimeout(() => resolve(), 2000)
-          }).then(() => {
-            // Do something
-            _this.$message.success('保存成功')
-            _this.$emit('ok')
-          }).catch(() => {
-            // Do something
-          }).finally(() => {
-            _this.confirmLoading = false
-            _this.close()
-          })
-        }
-      })
-    },
-    handleCancel () {
-      this.close()
-    }
-
-  }
-}
-</script>

src/views/other/modules/RoleModal.vue

@@ -1,146 +0,0 @@
-<template>
-  <a-modal
-    title="操作"
-    :width="800"
-    :visible="visible"
-    :confirmLoading="confirmLoading"
-    @ok="handleOk"
-    @cancel="handleCancel"
-  >
-    <a-steps :current="1">
-      <a-step>
-        <!-- <span slot="title">Finished</span> -->
-        <template slot="title">
-          Finished
-        </template>
-        <span slot="description">This is a description.</span>
-      </a-step>
-      <a-step title="In Progress" description="This is a description." />
-      <a-step title="Waiting" description="This is a description." />
-    </a-steps>
-  </a-modal>
-</template>
-
-<script>
-import { getPermissions } from '@/api/manage'
-import pick from 'lodash.pick'
-
-export default {
-  name: 'RoleModal',
-  data () {
-    return {
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 5 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 16 }
-      },
-      visible: false,
-      confirmLoading: false,
-      mdl: {},
-
-      form: this.$form.createForm(this),
-      permissions: []
-    }
-  },
-  created () {
-    this.loadPermissions()
-  },
-  methods: {
-    add () {
-      this.edit({ id: 0 })
-    },
-    edit (record) {
-      this.mdl = Object.assign({}, record)
-      this.visible = true
-
-      // 有权限表，处理勾选
-      if (this.mdl.permissions && this.permissions) {
-        // 先处理要勾选的权限结构
-        const permissionsAction = {}
-        this.mdl.permissions.forEach(permission => {
-          permissionsAction[permission.permissionId] = permission.actionEntitySet.map(entity => entity.action)
-        })
-        // 把权限表遍历一遍，设定要勾选的权限 action
-        this.permissions.forEach(permission => {
-          permission.selected = permissionsAction[permission.id] || []
-        })
-      }
-
-      this.$nextTick(() => {
-        this.form.setFieldsValue(pick(this.mdl, 'id', 'name', 'status', 'describe'))
-      })
-      console.log('this.mdl', this.mdl)
-    },
-    close () {
-      this.$emit('close')
-      this.visible = false
-    },
-    handleOk () {
-      const _this = this
-      // 触发表单验证
-      this.form.validateFields((err, values) => {
-        // 验证表单没错误
-        if (!err) {
-          console.log('form values', values)
-
-          _this.confirmLoading = true
-          // 模拟后端请求 2000 毫秒延迟
-          new Promise((resolve) => {
-            setTimeout(() => resolve(), 2000)
-          }).then(() => {
-            // Do something
-            _this.$message.success('保存成功')
-            _this.$emit('ok')
-          }).catch(() => {
-            // Do something
-          }).finally(() => {
-            _this.confirmLoading = false
-            _this.close()
-          })
-        }
-      })
-    },
-    handleCancel () {
-      this.close()
-    },
-    onChangeCheck (permission) {
-      permission.indeterminate = !!permission.selected.length && (permission.selected.length < permission.actionsOptions.length)
-      permission.checkedAll = permission.selected.length === permission.actionsOptions.length
-    },
-    onChangeCheckAll (e, permission) {
-      Object.assign(permission, {
-        selected: e.target.checked ? permission.actionsOptions.map(obj => obj.value) : [],
-        indeterminate: false,
-        checkedAll: e.target.checked
-      })
-    },
-    loadPermissions () {
-      const that = this
-      getPermissions().then(res => {
-        const result = res.result
-        that.permissions = result.map(permission => {
-          const options = JSON.parse(permission.actionData) || []
-          permission.checkedAll = false
-          permission.selected = []
-          permission.indeterminate = false
-          permission.actionsOptions = options.map(option => {
-            return {
-              label: option.describe,
-              value: option.action
-            }
-          })
-          return permission
-        })
-      })
-    }
-
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/profile/advanced/Advanced.vue

@@ -1,373 +0,0 @@
-<template>
-  <page-header-wrapper
-    title="单号：234231029431"
-    :tab-list="tabList"
-    :tab-active-key="tabActiveKey"
-    @tabChange="handleTabChange"
-  >
-    <template v-slot:content>
-      <a-descriptions size="small" :column="isMobile ? 1 : 2">
-        <a-descriptions-item label="创建人">曲丽丽</a-descriptions-item>
-        <a-descriptions-item label="订购产品">XX 服务</a-descriptions-item>
-        <a-descriptions-item label="创建时间">2017-07-07</a-descriptions-item>
-        <a-descriptions-item label="关联单据">
-          <a href="">12421</a>
-        </a-descriptions-item>
-        <a-descriptions-item label="生效日期">2017-07-07 ~ 2017-08-08</a-descriptions-item>
-        <a-descriptions-item label="备注">请于两个工作日内确认</a-descriptions-item>
-      </a-descriptions>
-    </template>
-
-    <!-- actions -->
-    <template v-slot:extra>
-      <a-button-group style="margin-right: 4px;">
-        <a-button>操作</a-button>
-        <a-button>操作</a-button>
-        <a-button><a-icon type="ellipsis"/></a-button>
-      </a-button-group>
-      <a-button type="primary" >主操作</a-button>
-    </template>
-
-    <template v-slot:extraContent>
-      <a-row class="status-list">
-        <a-col :xs="12" :sm="12">
-          <div class="text">状态</div>
-          <div class="heading">待审批</div>
-        </a-col>
-        <a-col :xs="12" :sm="12">
-          <div class="text">订单金额</div>
-          <div class="heading">¥ 568.08</div>
-        </a-col>
-      </a-row>
-    </template>
-
-    <a-card :bordered="false" title="流程进度">
-      <a-steps :direction="isMobile && 'vertical' || 'horizontal'" :current="1" progressDot>
-        <a-step>
-          <template v-slot:title>
-            <span>创建项目</span>
-          </template>
-          <template v-slot:description>
-            <div class="antd-pro-pages-profile-advanced-style-stepDescription">
-              曲丽丽<a-icon type="dingding" style="margin-left: 8px;" />
-              <div>2016-12-12 12:32</div>
-            </div>
-          </template>
-        </a-step>
-        <a-step>
-          <template v-slot:title>
-            <span>部门初审</span>
-          </template>
-          <template v-slot:description>
-            <div class="antd-pro-pages-profile-advanced-style-stepDescription">
-              周毛毛<a-icon type="dingding" style="color: rgb(0, 160, 233); margin-left: 8px;" />
-              <div><a>催一下</a></div>
-            </div>
-          </template>
-        </a-step>
-        <a-step title="财务复核" />
-        <a-step title="完成" />
-      </a-steps>
-    </a-card>
-
-    <a-card style="margin-top: 24px" :bordered="false" title="用户信息">
-      <a-descriptions>
-        <a-descriptions-item label="用户姓名">付晓晓</a-descriptions-item>
-        <a-descriptions-item label="会员卡号">32943898021309809423</a-descriptions-item>
-        <a-descriptions-item label="身份证">3321944288191034921</a-descriptions-item>
-        <a-descriptions-item label="联系方式">18112345678</a-descriptions-item>
-        <a-descriptions-item label="联系地址">浙江省杭州市西湖区黄姑山路工专路交叉路口</a-descriptions-item>
-      </a-descriptions>
-      <a-descriptions title="信息组">
-        <a-descriptions-item label="某某数据">725</a-descriptions-item>
-        <a-descriptions-item label="该数据更新时间">2018-08-08</a-descriptions-item>
-        <a-descriptions-item ></a-descriptions-item>
-        <a-descriptions-item label="某某数据">725</a-descriptions-item>
-        <a-descriptions-item label="该数据更新时间">2018-08-08</a-descriptions-item>
-        <a-descriptions-item ></a-descriptions-item>
-      </a-descriptions>
-      <a-card type="inner" title="多层信息组">
-        <a-descriptions title="组名称" size="small">
-          <a-descriptions-item label="负责人">林东东</a-descriptions-item>
-          <a-descriptions-item label="角色码">1234567</a-descriptions-item>
-          <a-descriptions-item label="所属部门">XX公司-YY部</a-descriptions-item>
-          <a-descriptions-item label="过期时间">2018-08-08</a-descriptions-item>
-          <a-descriptions-item label="描述">这段描述很长很长很长很长很长很长很长很长很长很长很长很长很长很长...</a-descriptions-item>
-        </a-descriptions>
-        <a-divider style="margin: 16px 0" />
-        <a-descriptions title="组名称" size="small" :col="1">
-          <a-descriptions-item label="学名">	Citrullus lanatus (Thunb.) Matsum. et Nakai一年生蔓生藤本；茎、枝粗壮，具明显的棱。卷须较粗..</a-descriptions-item>
-        </a-descriptions>
-        <a-divider style="margin: 16px 0" />
-        <a-descriptions title="组名称" size="small" :col="2">
-          <a-descriptions-item label="负责人">付小小</a-descriptions-item>
-          <a-descriptions-item label="角色码">1234567</a-descriptions-item>
-        </a-descriptions>
-      </a-card>
-
-    </a-card>
-
-    <a-card style="margin-top: 24px" :bordered="false" title="用户近半年来电记录">
-      <div class="no-data"><a-icon type="frown-o"/>暂无数据</div>
-    </a-card>
-
-    <!-- 操作 -->
-    <a-card
-      style="margin-top: 24px"
-      :bordered="false"
-      :tabList="operationTabList"
-      :activeTabKey="operationActiveTabKey"
-      @tabChange="(key) => {this.operationActiveTabKey = key}"
-    >
-      <a-table
-        v-if="operationActiveTabKey === '1'"
-        :columns="operationColumns"
-        :dataSource="operation1"
-        :pagination="false"
-      >
-        <template
-          slot="status"
-          slot-scope="status">
-          <a-badge :status="status | statusTypeFilter" :text="status | statusFilter"/>
-        </template>
-      </a-table>
-      <a-table
-        v-if="operationActiveTabKey === '2'"
-        :columns="operationColumns"
-        :dataSource="operation2"
-        :pagination="false"
-      >
-        <template
-          slot="status"
-          slot-scope="status">
-          <a-badge :status="status | statusTypeFilter" :text="status | statusFilter"/>
-        </template>
-      </a-table>
-      <a-table
-        v-if="operationActiveTabKey === '3'"
-        :columns="operationColumns"
-        :dataSource="operation3"
-        :pagination="false"
-      >
-        <template
-          slot="status"
-          slot-scope="status">
-          <a-badge :status="status | statusTypeFilter" :text="status | statusFilter"/>
-        </template>
-      </a-table>
-    </a-card>
-
-  </page-header-wrapper>
-</template>
-
-<script>
-import { baseMixin } from '@/store/app-mixin'
-
-export default {
-  name: 'Advanced',
-  mixins: [baseMixin],
-  data () {
-    return {
-      tabList: [
-        { key: 'detail', tab: '详情' },
-        { key: 'rule', tab: '规则' }
-      ],
-      tabActiveKey: 'detail',
-
-      operationTabList: [
-        {
-          key: '1',
-          tab: '操作日志一'
-        },
-        {
-          key: '2',
-          tab: '操作日志二'
-        },
-        {
-          key: '3',
-          tab: '操作日志三'
-        }
-      ],
-      operationActiveTabKey: '1',
-
-      operationColumns: [
-        {
-          title: '操作类型',
-          dataIndex: 'type',
-          key: 'type'
-        },
-        {
-          title: '操作人',
-          dataIndex: 'name',
-          key: 'name'
-        },
-        {
-          title: '执行结果',
-          dataIndex: 'status',
-          key: 'status',
-          scopedSlots: { customRender: 'status' }
-        },
-        {
-          title: '操作时间',
-          dataIndex: 'updatedAt',
-          key: 'updatedAt'
-        },
-        {
-          title: '备注',
-          dataIndex: 'remark',
-          key: 'remark'
-        }
-      ],
-      operation1: [
-        {
-          key: 'op1',
-          type: '订购关系生效',
-          name: '曲丽丽',
-          status: 'agree',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '-'
-        },
-        {
-          key: 'op2',
-          type: '财务复审',
-          name: '付小小',
-          status: 'reject',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '不通过原因'
-        },
-        {
-          key: 'op3',
-          type: '部门初审',
-          name: '周毛毛',
-          status: 'agree',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '-'
-        },
-        {
-          key: 'op4',
-          type: '提交订单',
-          name: '林东东',
-          status: 'agree',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '很棒'
-        },
-        {
-          key: 'op5',
-          type: '创建订单',
-          name: '汗牙牙',
-          status: 'agree',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '-'
-        }
-      ],
-      operation2: [
-        {
-          key: 'op2',
-          type: '财务复审',
-          name: '付小小',
-          status: 'reject',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '不通过原因'
-        },
-        {
-          key: 'op3',
-          type: '部门初审',
-          name: '周毛毛',
-          status: 'agree',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '-'
-        },
-        {
-          key: 'op4',
-          type: '提交订单',
-          name: '林东东',
-          status: 'agree',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '很棒'
-        }
-      ],
-      operation3: [
-        {
-          key: 'op2',
-          type: '财务复审',
-          name: '付小小',
-          status: 'reject',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '不通过原因'
-        },
-        {
-          key: 'op3',
-          type: '部门初审',
-          name: '周毛毛',
-          status: 'agree',
-          updatedAt: '2017-10-03  19:23:12',
-          remark: '-'
-        }
-      ]
-    }
-  },
-  filters: {
-    statusFilter (status) {
-      const statusMap = {
-        'agree': '成功',
-        'reject': '驳回'
-      }
-      return statusMap[status]
-    },
-    statusTypeFilter (type) {
-      const statusTypeMap = {
-        'agree': 'success',
-        'reject': 'error'
-      }
-      return statusTypeMap[type]
-    }
-  },
-  methods: {
-    handleTabChange (key) {
-      console.log('')
-      this.tabActiveKey = key
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-
-  .detail-layout {
-    margin-left: 44px;
-  }
-  .text {
-    color: rgba(0, 0, 0, .45);
-  }
-
-  .heading {
-    color: rgba(0, 0, 0, .85);
-    font-size: 20px;
-  }
-
-  .no-data {
-    color: rgba(0, 0, 0, .25);
-    text-align: center;
-    line-height: 64px;
-    font-size: 16px;
-
-    i {
-      font-size: 24px;
-      margin-right: 16px;
-      position: relative;
-      top: 3px;
-    }
-  }
-
-  .mobile {
-    .detail-layout {
-      margin-left: unset;
-    }
-    .text {
-
-    }
-    .status-list {
-      text-align: left;
-    }
-  }
-</style>

src/views/profile/basic/index.vue

@@ -1,249 +0,0 @@
-<template>
-  <page-header-wrapper>
-    <a-card :bordered="false">
-      <a-descriptions title="退款申请">
-        <a-descriptions-item label="取货单号">1000000000</a-descriptions-item>
-        <a-descriptions-item label="状态">已取货</a-descriptions-item>
-        <a-descriptions-item label="销售单号">1234123421</a-descriptions-item>
-        <a-descriptions-item label="子订单">3214321432</a-descriptions-item>
-      </a-descriptions>
-      <a-divider style="margin-bottom: 32px"/>
-      <a-descriptions title="用户信息">
-        <a-descriptions-item label="用户姓名">付小小</a-descriptions-item>
-        <a-descriptions-item label="联系电话">18100000000</a-descriptions-item>
-        <a-descriptions-item label="常用快递">菜鸟仓储</a-descriptions-item>
-        <a-descriptions-item label="取货地址">浙江省杭州市西湖区万塘路18号</a-descriptions-item>
-        <a-descriptions-item label="备注">	无</a-descriptions-item>
-      </a-descriptions>
-      <a-divider style="margin-bottom: 32px"/>
-
-      <div class="title">退货商品</div>
-      <s-table
-        style="margin-bottom: 24px"
-        row-key="id"
-        :columns="goodsColumns"
-        :data="loadGoodsData">
-
-      </s-table>
-
-      <div class="title">退货进度</div>
-      <s-table
-        style="margin-bottom: 24px"
-        row-key="key"
-        :columns="scheduleColumns"
-        :data="loadScheduleData">
-
-        <template
-          slot="status"
-          slot-scope="status">
-          <a-badge :status="status" :text="status | statusFilter"/>
-        </template>
-
-      </s-table>
-    </a-card>
-  </page-header-wrapper>
-</template>
-
-<script>
-import { STable } from '@/components'
-
-export default {
-  components: {
-    STable
-  },
-  data () {
-    return {
-      goodsColumns: [
-        {
-          title: '商品编号',
-          dataIndex: 'id',
-          key: 'id'
-        },
-        {
-          title: '商品名称',
-          dataIndex: 'name',
-          key: 'name'
-        },
-        {
-          title: '商品条码',
-          dataIndex: 'barcode',
-          key: 'barcode'
-        },
-        {
-          title: '单价',
-          dataIndex: 'price',
-          key: 'price',
-          align: 'right'
-        },
-        {
-          title: '数量（件）',
-          dataIndex: 'num',
-          key: 'num',
-          align: 'right'
-        },
-        {
-          title: '金额',
-          dataIndex: 'amount',
-          key: 'amount',
-          align: 'right'
-        }
-      ],
-      // 加载数据方法 必须为 Promise 对象
-      loadGoodsData: () => {
-        return new Promise(resolve => {
-          resolve({
-            data: [
-              {
-                id: '1234561',
-                name: '矿泉水 550ml',
-                barcode: '12421432143214321',
-                price: '2.00',
-                num: '1',
-                amount: '2.00'
-              },
-              {
-                id: '1234562',
-                name: '凉茶 300ml',
-                barcode: '12421432143214322',
-                price: '3.00',
-                num: '2',
-                amount: '6.00'
-              },
-              {
-                id: '1234563',
-                name: '好吃的薯片',
-                barcode: '12421432143214323',
-                price: '7.00',
-                num: '4',
-                amount: '28.00'
-              },
-              {
-                id: '1234564',
-                name: '特别好吃的蛋卷',
-                barcode: '12421432143214324',
-                price: '8.50',
-                num: '3',
-                amount: '25.50'
-              }
-            ],
-            pageSize: 10,
-            pageNo: 1,
-            totalPage: 1,
-            totalCount: 10
-          })
-        }).then(res => {
-          return res
-        })
-      },
-
-      scheduleColumns: [
-        {
-          title: '时间',
-          dataIndex: 'time',
-          key: 'time'
-        },
-        {
-          title: '当前进度',
-          dataIndex: 'rate',
-          key: 'rate'
-        },
-        {
-          title: '状态',
-          dataIndex: 'status',
-          key: 'status',
-          scopedSlots: { customRender: 'status' }
-        },
-        {
-          title: '操作员ID',
-          dataIndex: 'operator',
-          key: 'operator'
-        },
-        {
-          title: '耗时',
-          dataIndex: 'cost',
-          key: 'cost'
-        }
-      ],
-      loadScheduleData: () => {
-        return new Promise(resolve => {
-          resolve({
-            data: [
-              {
-                key: '1',
-                time: '2017-10-01 14:10',
-                rate: '联系客户',
-                status: 'processing',
-                operator: '取货员 ID1234',
-                cost: '5mins'
-              },
-              {
-                key: '2',
-                time: '2017-10-01 14:05',
-                rate: '取货员出发',
-                status: 'success',
-                operator: '取货员 ID1234',
-                cost: '1h'
-              },
-              {
-                key: '3',
-                time: '2017-10-01 13:05',
-                rate: '取货员接单',
-                status: 'success',
-                operator: '取货员 ID1234',
-                cost: '5mins'
-              },
-              {
-                key: '4',
-                time: '2017-10-01 13:00',
-                rate: '申请审批通过',
-                status: 'success',
-                operator: '系统',
-                cost: '1h'
-              },
-              {
-                key: '5',
-                time: '2017-10-01 12:00',
-                rate: '发起退货申请',
-                status: 'success',
-                operator: '用户',
-                cost: '5mins'
-              }
-            ],
-            pageSize: 10,
-            pageNo: 1,
-            totalPage: 1,
-            totalCount: 10
-          })
-        }).then(res => {
-          return res
-        })
-      }
-    }
-  },
-  filters: {
-    statusFilter (status) {
-      const statusMap = {
-        'processing': '进行中',
-        'success': '完成',
-        'failed': '失败'
-      }
-      return statusMap[status]
-    }
-  },
-  computed: {
-    title () {
-      return this.$route.meta.title
-    }
-  }
-
-}
-</script>
-
-<style lang="less" scoped>
-  .title {
-    color: rgba(0,0,0,.85);
-    font-size: 16px;
-    font-weight: 500;
-    margin-bottom: 16px;
-  }
-</style>