新增页面

src/api/project/project.js

@@ -1,7 +1,7 @@
 import request from '@/utils/request'
 
 const projectApi = {
-//   add: 'sys/menu/add',
+  add: 'project/add',
 //   get: 'sys/menu/get',
 //   update: 'sys/menu/update',
 //   del: 'sys/menu/delete',
@@ -9,13 +9,13 @@ const projectApi = {
   list: 'project/pageList'
 }
 
-// export function menuAdd (params) {
+export function projectAdd (params) {
-//   return request({
+  return request({
-//     url: menuApi.add,
+    url: projectApi.add,
-//     method: 'post',
+    method: 'post',
-//     data: params
+    data: params
-//   })
+  })
-// }
+}
 // export function menuGet (params) {
 //   return request({
 //     url: menuApi.get,
@@ -38,6 +38,7 @@ const projectApi = {
 //   })
 // }
 export function getProjectList (params) {
+  console.log("------------{}",params)
   return request({
     url: projectApi.list,
     method: 'get',

src/config/router.config.js

@@ -74,15 +74,21 @@ export const asyncRouterMap = [
       // 项目管理
       {
         path: '/project',
-        redirect: '/project/projectList',
+        redirect: '/project/list',
         component: RouteView,
         meta: { title: '项目管理', icon: bxAnaalyse, permission: ['from'] },
         children: [
           {
-            path: '/project/projectList',
+            path: '/project/list',
             name: 'projectList',
             component: () => import('@/views/project/ProjectList'),
-            meta: { title: '自主项目', keepAlive: true, permission: ['form'] }
+            meta: { title: '自主项目', keepAlive: true, permission: ['form'] },
+          },
+          {
+            path: '/project/add',
+            name: 'ProjectForm',
+            component: () => import('@/views/project/ProjectForm'),
+            meta: { title: '新增项目', keepAlive: true, permission: ['form'] }
           },
           {
             path: '/form/step-form',

src/views/project/ProjectForm.vue

@@ -0,0 +1,38 @@
+<template>
+  <div>
+      <h1>hello word</h1>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
+//例如：import 《组件名称》 from '《组件路径》'
+
+export default {
+  //import引入的组件需要注入到对象中才能使用
+  name: 'projectForm',
+  components: {},
+  props: {},
+  data() {
+    //这里存放数据
+    return {}
+  },
+  //计算属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {},
+  created() {}, //生命周期 - 创建完成（可以访问当前this实例）
+  mounted() {}, //生命周期 - 挂载完成（可以访问DOM元素）
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+}
+</script>
+<style scoped>
+</style>

src/views/project/ProjectList.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <a-space direction="vertical" style="width: 100%;">
+    <a-space direction="vertical" style="width: 100%">
       <a-space direction="horizontal">
         项目名:
         <a-input v-model="queryParam.projectName" style="width: 100%" />
@@ -12,9 +12,9 @@
           <a-select-option value="1">未发布</a-select-option>
         </a-select>
         开始时间:
-        <a-date-picker v-model="queryParam.stateDate" style="width: 100%" placeholder="请输入开始时间" />
+        <a-date-picker v-model="queryParam.startDate" style="width: 100%" placeholder="请输入开始时间" valueFormat="YYYY-MM-DD HH:mm:ss"/>
         结束时间:
-        <a-date-picker v-model="queryParam.endDate" style="width: 100%" placeholder="请输入结束时间" />
+        <a-date-picker v-model="queryParam.endDate" style="width: 100%" placeholder="请输入结束时间" valueFormat="YYYY-MM-DD HH:mm:ss"/>
         培训方式:
         <a-select v-model="queryParam.trainWay" placeholder="请选择" default-value="null" style="width: 120px">
           <a-select-option value="null">全部</a-select-option>
@@ -29,40 +29,35 @@
       </a-space>
 
       <a-space direction="horizontal">
-        <a-button type="primary" icon="plus" @click="handleEdit()">新建</a-button>
+        <a-button type="primary" icon="plus" @click="handledCreate()">新建</a-button>
         <a-button type="primary" icon="minus" @click="handleEdit()">删除</a-button>
       </a-space>
 
-      <s-table ref="table" size="default" rowKey="key" :columns="columns" :data="loadData" :rowSelection="options.rowSelection">
+      <s-table
+        ref="table"
+        size="default"
+        rowKey="key"
+        :columns="columns"
+        :data="loadData"
+        :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 href="javascript:;" @click="handleEdit(record)">修改</a>
+            <a-divider type="vertical" />
+            <a-popconfirm title="是否删除?" @confirm="() => handleDelete(record)">
+              <a href="javascript:;">删除</a>
+            </a-popconfirm>
+            <a-divider type="vertical" />
+            <a href="javascript:;" @click="handleDetail(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-space>
-
   </div>
 </template>
 
@@ -70,102 +65,91 @@
 import moment from 'moment'
 import { STable } from '@/components'
 import { getProjectList } from '@/api/project/project'
+import ProjectForm from '@/views/project/ProjectForm'
+import router from '@/router/index.js'
 
 export default {
-  name: 'TableList',
+  name: 'ProjectList',
+  props: { },
   components: {
     STable,
+    ProjectForm,
+    router
   },
   data() {
     return {
-      mdl: {},
-      // 高级搜索 展开/关闭
-      advanced: false,
       // 查询参数
       queryParam: {},
       // 表头
       columns: [
-        {
+        { title: '序号', width: 60, scopedSlots: { customRender: 'serial' } },
-          title: '序号',
+        { title: '项目名称', dataIndex: 'projectName', key: 'projectName' },
-          width: 60,
-          scopedSlots: { customRender: 'serial' },
-        },
-        {
-          title: '项目名称',
-          dataIndex: 'projectName',
-          key: 'projectName'
-        },
         {
           title: '时间',
-          dataIndex: 'description',
+          dataIndex: 'startDate',
-        },
+          customRender: (text, record, index) => {
-        {
+            return record.startDate + ' - ' + record.endDate
-          title: '人数',
+          },
-          dataIndex: 'callNo',
-          // sorter: true,
-          needTotal: true,
-          // customRender: (text) => text + ' 次',
-        },
-        {
-          title: '项目类型',
-          dataIndex: 'description',
         },
+        { title: '人数', dataIndex: 'personNum', customRender: (text) => text + '人' },
+        { title: '项目类型', dataIndex: 'projectType' },
         {
           title: '项目状态',
-          dataIndex: 'description',
+          dataIndex: 'status',
+          customRender: (text, record, index) => {
+            //项目状态 1-未发布 2-未开始 3-进行中  4-已完成  5-已中止
+            if (text == 1) {
+              return '未发布'
+            }
+            if (text == 2) {
+              return '未开始'
+            }
+            if (text == 3) {
+              return '进行中'
+            }
+            if (text == 4) {
+              return '已完成'
+            }
+            if (text == 5) {
+              return '已中止'
+            }
+          },
         },
-        {
+        { title: '创建人员', dataIndex: 'createBy' },
-          title: '创建人员',
+        { title: '创建时间', dataIndex: 'createDate' },
-          dataIndex: 'projectStatus',
-        },
-        {
-          title: '创建时间',
-          dataIndex: 'updatedAt',
-          sorter: true,
-        },
-        // {
-        //   title: '操作',
-        //   dataIndex: 'action',
-        //   width: '150px',
-        //   scopedSlots: { customRender: 'action' },
-        // },
         {
           title: '操作',
           key: 'operation',
-          width: 100,
+          width: 200,
           align: 'center',
-          scopedSlots: { customRender: 'action' }
+          scopedSlots: { customRender: 'action' },
-        }
+        },
       ],
 
       // 加载数据方法 必须为 Promise 对象
-      loadData: parameter => {
+      loadData: (parameter) => {
-        return getProjectList(Object.assign(parameter, this.queryParam)).then(res => { return res; })
+        return getProjectList(Object.assign(parameter, this.queryParam)).then((res) => {
+          return res
+        })
       },
+
       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: {
+    // 增
+    handledCreate() {
+      return this.$router.push(
+        // {name: 'ProjectForm'}
+        {path: 'project/project/add',}
+      )
+      // router.push()
+    },
+
     tableOption() {
       if (!this.optionAlertShow) {
         this.options = {
@@ -190,11 +174,6 @@ export default {
       }
     },
 
-    handleEdit(record) {
-      this.$emit('onEdit', record)
-    },
-    handleOk() { },
-
     onSelectChange(selectedRowKeys, selectedRows) {
       this.selectedRowKeys = selectedRowKeys
       this.selectedRows = selectedRows