事务管理页面

src/router/views/index.js

@@ -312,6 +312,21 @@ export default [{
       }
     ]
   },
+  // 主营项目详情页
+  {
+    path: '/mainItems_detailsPage',
+    component: Layout,
+    hidden: true,
+    children: [
+      {
+        path: '/mainItems_detailsPage',
+        meta: {
+          i18n: 'mainItems_detailsPage'
+        },
+        component: () => import( /* webpackChunkName: "views" */ '@/views/workManagement/main-items/detailsPage')
+      }
+    ]
+  },
     {
         path: '/work/process/leave',
         component: Layout,
@@ -341,4 +356,5 @@ export default [{
             component: () =>
                 import( /* webpackChunkName: "views" */ '@/views/work/process/leave/detail')
         }]
-    }]
+    },
+]

src/views/workManagement/main-items/configuration/mainList.json

@@ -0,0 +1,253 @@
+{
+  "headerAlign": "center",
+  "align": "center",
+  "border": true,
+  "index": true,
+  "lazy": true,
+  "tip": false,
+  "simplePage": true,
+  "searchShow": false,
+  "searchMenuSpan": 6,
+  "selection": false,
+  "addBtn": false,
+  "viewBtn": true,
+  "editBtn": true,
+  "delBtn": true,
+  "menuWidth": 220,
+  "column": [
+    {
+      "label": "行号",
+      "prop": "prop1",
+      "index": 1,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入行号",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "服务项目",
+      "prop": "prop2",
+      "index": 2,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入服务项目",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "收费建议",
+      "prop": "prop3",
+      "index": 3,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入收费建议",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "计价单位",
+      "prop": "prop4",
+      "index": 4,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入计价单位",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "数量",
+      "prop": "prop5",
+      "index": 5,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入数量",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "报价",
+      "prop": "prop6",
+      "index": 6,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入报价",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "合计金额",
+      "prop": "prop7",
+      "index": 7,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入合计金额",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "频率",
+      "prop": "prop8",
+      "index": 8,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入频率",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "提醒日",
+      "prop": "prop9",
+      "index": 9,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入提醒日",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "备注",
+      "prop": "prop10",
+      "index": 10,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入备注",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "任务部门",
+      "prop": "prop11",
+      "index": 11,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入任务部门",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "承做人",
+      "prop": "prop12",
+      "index": 12,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入承做人",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "需求开始日期",
+      "prop": "prop13",
+      "index": 13,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入需求开始日期",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "需求完成日期",
+      "prop": "prop14",
+      "index": 14,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入需求完成日期",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "录入人",
+      "prop": "prop15",
+      "index": 14,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入录入人",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "录入时间",
+      "prop": "prop16",
+      "index": 14,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入录入时间",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "最新修改人",
+      "prop": "prop17",
+      "index": 14,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入最新修改人",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "最新修改时间",
+      "prop": "prop17",
+      "index": 14,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": "请输入最新修改时间",
+          "trigger": "blur"
+        }
+      ]
+    }
+  ]
+}

src/views/workManagement/main-items/detailsPage.vue

@@ -0,0 +1,355 @@
+<template>
+  <basic-container>
+    <el-form :model="form" ref="form" label-width="130px">
+      <el-row>
+        <el-col v-for="(item, index) in basicData.column" :span="item.span?item.span:6" :key="index">
+          <el-form-item :label="item.label" :prop="item.prop" :rules="item.rules">
+            <el-date-picker v-if="item.type === 'datetime'" style="width: 100%;" v-model="form[item.prop]" size="small" type="datetime" placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss"/>
+            <el-select v-else-if="item.type === 'select'" style="width: 100%" size="small" placeholder="请选择" clearable filterable></el-select>
+            <el-input type="age" v-else v-model="form[item.prop]" size="small" autocomplete="off" placeholder="请输入"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col>
+          <el-form-item>
+            <el-button type="primary" style="float: right" @click="onSubmit">生成账单</el-button>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <avue-crud
+      ref="crud"
+      :data="data"
+      :option="optionTable"
+      :page.sync="page"
+      :table-loading="loading"
+      @row-del="rowDel"
+      @row-update="rowUpdate"
+      @row-save="rowSave"
+      @size-change="sizeChange"
+      @current-change="currentChange"
+      @search-change="searchChange"
+      @refresh-change="refreshChange"
+      @cell-dblclick="cellDblclick"
+      @on-load="getList"
+      @saveColumn="saveColumn"
+    >
+      <template slot="menuLeft">
+        <el-button type="primary"
+                   size="small"
+                   icon="el-icon-upload2"
+                   plain
+                   @click="handleDelete">新增明细
+        </el-button>
+        <el-button type="primary"
+                   size="small"
+                   icon="el-icon-upload2"
+                   plain
+                   @click="handleDelete">导 出
+        </el-button>
+        <el-button type="primary"
+                   size="small"
+                   icon="el-icon-upload2"
+                   plain
+                   @click="handleDelete">打 印
+        </el-button>
+        <el-button type="primary"
+                   size="small"
+                   icon="el-icon-upload2"
+                   plain
+                   @click="handleDelete">新 增
+        </el-button>
+        <el-button type="primary"
+                   size="small"
+                   icon="el-icon-upload2"
+                   plain
+                   @click="handleDelete">请 核
+        </el-button>
+      </template>
+    </avue-crud>
+  </basic-container>
+</template>
+
+<script>
+  import option from "./configuration/mainList.json";
+  export default {
+    data() {
+      return {
+        loading: false,
+        form:{},
+        data: [],
+        optionTable: option,
+        //顶部from数据
+        basicData: {
+          column: [
+            {
+              label: '系统编号',
+              prop: 'prop1',
+              rules: [
+                {
+                  required: false,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }, {
+              label: '制单日期',
+              prop: 'prop2',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }, {
+              label: '制单人',
+              prop: 'prop3',
+              data: [],
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }, {
+              label: '项目代码',
+              prop: 'prop3',
+              data: [],
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }, {
+              label: '项目名称',
+              prop: 'prop4',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }, {
+              label: '客户名称',
+              prop: 'prop5',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }, {
+              label: '责任人',
+              prop: 'prop6',
+              data: [],
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }, {
+              label: '电话',
+              prop: 'prop7',
+              data: [],
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }, {
+              label: '承揽人',
+              prop: 'prop8',
+              data: [],
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }, {
+              label: '合同金额',
+              prop: 'prop8',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            },
+            {
+              label: '预收金额',
+              prop: 'prop9',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            },
+            {
+              label: '未收金额',
+              prop: 'prop10',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            },
+            {
+              label: '开始日期',
+              prop: 'prop11',
+              type:'datetime',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            },
+            {
+              label: '结束日期',
+              prop: 'prop12',
+              type:'datetime',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            },
+            {
+              label: '收款方式',
+              prop: 'prop13',
+              type:'select',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            },
+            {
+              label: '备注',
+              prop: 'prop8',
+              rules: [
+                {
+                  required: true,
+                  message: ' ',
+                  trigger: 'blur'
+                }
+              ]
+            }
+          ],
+        },
+        page: {
+          currentPage: 1,
+          total: 0,
+          pageSize: 10
+        }
+      };
+    },
+    methods: {
+      //删除列表后面的删除按钮触发触发(row, index, done)
+      rowDel(row, index, done) {
+        this.$confirm("确定将选择数据删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(() => {
+          this.$message({
+            type: "success",
+            message: "操作成功!"
+          });
+          // 数据回调进行刷新
+          done(row);
+        });
+      },
+      //修改时的修改按钮点击触发
+      rowUpdate(row, index, done, loading) {
+        setTimeout(() => {
+          this.$message.success("修改成功");
+          loading();
+          done();
+        }, 1000);
+      },
+      //新增修改时保存触发
+      rowSave(row, done, loading) {
+        setTimeout(() => {
+          this.$message.success("保存成功");
+          loading();
+          done();
+        }, 1000);
+      },
+      getList() {
+        this.loading = true;
+        setTimeout(() => {
+          this.loading = false;
+          this.data = [
+            {
+              prop1: "食品许可",
+              prop2: "500",
+              prop3: "次",
+              prop4: "1",
+              prop5: "1500",
+              prop6: "1500",
+              prop7: "年",
+              prop8: "202202-1-1",
+              prop9: "效率高",
+              prop10: "商务部",
+              prop11: "老周",
+              prop12: "2021-1-1",
+              prop13: "2021-1-1",
+              prop14: "LOL",
+              prop15: "2021-1-1",
+              prop16: "LOL",
+              prop17: "2021-1-1"
+            }
+          ];
+          this.page.total = 1;
+        }, 1000);
+      },
+      searchChange(params, done) {
+        this.getList(this.page, params);
+        done();
+      },
+      sizeChange(val) {
+        this.page.pageSize = val;
+        this.getList();
+      },
+      currentChange(val) {
+        this.page.currentPage = val;
+        this.getList();
+      },
+      refreshChange() {
+        this.page.currentPage = 1;
+        this.getList();
+      },
+      cellDblclick(row, column, cell, event) {
+        console.log(row, column, cell, event);
+        this.$refs.crud.rowEdit(row);
+      },
+      saveColumn(row, column) {
+        console.log(row, column);
+      },
+    }
+  };
+</script>
+
+<style></style>

src/views/workManagement/main-items/detais.vue

@@ -1,14 +0,0 @@
-<template>
-  <basic-container> </basic-container>
-</template>
-
-<script>
-export default {
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>
-
-<style></style>

src/views/workManagement/main-items/list.vue

@@ -14,8 +14,22 @@
       @on-load="getList"
       @saveColumn="saveColumn"
     >
-    <template slot="menu">
-      <el-button icon="el-icon-check" :size="size" type="text">详 情</el-button>
+      <template slot="menuLeft">
+        <el-button type="primary"
+                   size="small"
+                   icon="el-icon-upload2"
+                   plain
+                   @click="handleDelete">导 出
+        </el-button>
+        <el-button type="primary"
+                   size="small"
+                   icon="el-icon-upload2"
+                   plain
+                   @click="handleDelete">新 单
+        </el-button>
+      </template>
+    <template slot-scope="scope" slot="menu">
+      <el-button icon="el-icon-check"  size="small" type="text" @click.stop="beforeOpenPage(scope.row,scope.index)">详 情</el-button>
     </template>
     </avue-crud>
   </basic-container>
@@ -28,11 +42,12 @@ export default {
       loading: false,
       data: [],
       optionTable: {
+        addBtn:false,
         align: "center",
         menuAlign: "center",
         height: window.innerHeight - 345,
         searchMenuSpan: 12,
-        menuWidth: "140",
+        menuWidth: "220",
         index: true,
         column: [
           {
@@ -222,6 +237,13 @@ export default {
     },
     saveColumn(row, column) {
       console.log(row, column);
+    },
+    //打开详情页
+    beforeOpenPage(row,index){
+      this.$router.push({
+        path: "/mainItems_detailsPage",
+        query: {id: JSON.stringify(row.prop1)},
+      });
     }
   }
 };

src/views/workManagement/service-items/project.vue

@@ -30,8 +30,16 @@
           @row-update="rowUpdate"
           @cell-dblclick="cellDblclick"
           @on-load="getList"
-          @saveColumn="saveColumn"
-        ></avue-crud>
+          @saveColumn="saveColumn">
+          <template slot="menuLeft">
+            <el-button type="primary"
+                       size="small"
+                       icon="el-icon-upload2"
+                       plain
+                       @click="handleDelete">导 出
+            </el-button>
+          </template>
+        </avue-crud>
       </basic-container>
     </el-col>
   </el-row>

src/views/workManagement/task/index.vue

@@ -75,8 +75,6 @@
           cancelButtonText: "取消",
           type: "warning"
         }).then(() => {
-          return deleteDetails(row.id);
-        }).then(() => {
           this.$message({
             type: "success",
             message: "操作成功!"
@@ -87,26 +85,19 @@
       },
       //修改时的修改按钮点击触发
       rowUpdate(row, index, done, loading) {
-        typeSave(row).then(() => {
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-          // 数据回调进行刷新
-          done(row);
-        }, error => {
-          window.console.log(error);
+        setTimeout(() => {
+          this.$message.success("修改成功");
           loading();
-        });
+          done();
+        }, 1000);
       },
       //新增修改时保存触发
       rowSave(row, done, loading) {
-        typeSave(row).then(res => {
-          done()
-        }, error => {
-          window.console.log(error);
+        setTimeout(() => {
+          this.$message.success("保存成功");
           loading();
-        })
+          done();
+        }, 1000);
       },
       //查询全部
       initData(){