报表模块

src/components/customerOrg/customerOrgTree.vue

@@ -1,8 +1,9 @@
 <template>
-  <el-tree    
+  <el-tree
     :data="customerOrg.customerOrgTree"
     :props="customerOrg.treeprops"
-    @node-click="treeclick"/>
+    @node-click="treeclick"
+  />
 </template>
 <script>
 import { mapState, mapMutations } from "vuex";
@@ -15,7 +16,7 @@ export default {
   },
   //<el-tree :data="$store.state.customerOrg.customerOrgTree" :props="$store.state.customerOrg.treeprops" @node-click="treeclick"></el-tree>
   computed: {
-    ...mapState(["customerOrg","window"]),
+    ...mapState(["customerOrg", "window"]),
   },
   //创建组件后
   created() {},
@@ -28,7 +29,7 @@ export default {
 
   methods: {
     ...mapMutations(["setData"]),
-    
+
     //获取体检单位列表树信息
     getCustomerOrgTree() {
       //let customerOrgTree = []
@@ -107,9 +108,7 @@ export default {
       this.getContactPersonList(data.id);
     },
   },
- 
 };
 </script>
 <style scoped>
-
 </style>

src/router/index.js

@@ -343,9 +343,19 @@ const routes = [
       },
       {
         path: "/tollcollector",
-        name: "总检医生工作量",
+        name: "收费员",
         component: () => import("../views/workload/tollcollector.vue"),
       },
+      {
+        path: "/individualfeedetails",
+        name: "个人收费明细",
+        component: () => import("../views/workload/individualfeedetails.vue"),
+      },
+      {
+        path: "/membershipcard",
+        name: "会员卡分类统计",
+        component: () => import("../views/workload/membershipcard.vue"),
+      },
     ],
   },
 ];

src/views/Home.vue

@@ -281,7 +281,7 @@
             </el-dropdown>
           </div>
           <!--  -->
-           <!-- 收费 -->
+          <!-- 收费 -->
           <div class="physicalexamination" style="margin-left: 15px">
             <el-dropdown @command="handleCommand">
               <span class="el-dropdown-link"> 收费 </span>
@@ -289,8 +289,12 @@
                 <el-dropdown-item command="tollcollector"
                   >收费员报表</el-dropdown-item
                 >
-             
-             
+                <el-dropdown-item command="individualfeedetails"
+                  >个人收费明细</el-dropdown-item
+                >
+                <el-dropdown-item command="membershipcard"
+                  >会员卡分类</el-dropdown-item
+                >
               </el-dropdown-menu>
             </el-dropdown>
           </div>

src/views/doctorCheck/positiveresults.vue

@@ -1,13 +1,17 @@
 <template>
-  <div class="box">
-    <el-card>
+  <div class="box" :style="CustomerOrgRightStyle">
+    <el-card class="cards">
       <el-row>
-        <el-form ref="form" :model="form" label-width="80px">
-          <el-col :span="6">
+        <el-form ref="form" :model="form" label-width="120px">
+          <el-col :span="4">
             <el-form-item label="单位">
-              <el-select v-model="form.unitgrouping" placeholder="请选择">
+              <el-select
+                v-model="form.unit"
+                placeholder="请选择"
+                @focus="unitchang"
+              >
                 <el-option
-                  v-for="item in customerorgdata"
+                  v-for="item in customerorgdatas"
                   :key="item.id"
                   :label="item.displayName"
                   :value="item.id"
@@ -16,88 +20,251 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6" style="line-height: 30px">
-            <el-radio-group v-model="form.radio">
-              <el-radio :label="3">疾病</el-radio>
-              <el-radio :label="6">综述</el-radio>
-              <el-radio :label="9">综述建议</el-radio>
-              <el-radio :label="12">综述建议疾病</el-radio>
-            </el-radio-group>
-          </el-col>
           <el-col :span="6">
-            <el-form-item label="疾病来源">
-              <el-select v-model="form.diseasesource" placeholder="请选择">
+            <el-form-item style="margin-left: -80px">
+              <el-radio-group v-model="radio">
+                <el-radio :label="3">疾病</el-radio>
+                <el-radio :label="6">综述</el-radio>
+                <el-radio :label="9">综述建议</el-radio>
+                <el-radio :label="12">综述建议疾病</el-radio>
+              </el-radio-group>
+              <!-- <el-select v-model="form.diagnosis" placeholder="请选择">
                 <el-option
-                  v-for="item in diseasesourcedata"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value"
+                  v-for="item in diagnosisdata"
+                  :key="item.id"
+                  :label="item.displayName"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select> -->
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="疾病来源" style="margin-left: -50px">
+              <el-select v-model="form.diagnosis" placeholder="请选择">
+                <el-option
+                  v-for="item in diagnosisdata"
+                  :key="item.id"
+                  :label="item.displayName"
+                  :value="item.id"
                 >
                 </el-option>
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="3">
-            <el-button type="primary">主要按钮</el-button>
+            <el-button type="primary" style="margin-left: 10px">查询</el-button>
           </el-col>
         </el-form>
       </el-row>
-      <!-- tabl标题 -->
-      <h3 class="tabtitle">人员体检结果清单</h3>
       <!-- tab区域 -->
+      <h3 class="tabtitle">人员体检结果清单</h3>
       <el-table :data="tableData" style="width: 100%">
-        <el-table-column prop="fileno" label="档案号" width="">
+        <el-table-column prop="disease" label="档案号" width="180">
+        </el-table-column>
+        <el-table-column
+          prop="numberofpeople"
+          label="姓名"
+          width="180"
+        ></el-table-column>
+        <el-table-column prop="numberofpeople" label="性别" width="180">
+        </el-table-column>
+        <el-table-column prop="shareintotal" label="年龄" width="180">
+        </el-table-column>
+        <el-table-column prop="shareintotal" label="体检结果">
         </el-table-column>
-        <el-table-column prop="sex" label="性别" width=""> </el-table-column>
-        <el-table-column prop="fullname" label="姓名"> </el-table-column>
-        <el-table-column prop="age" label="年龄"> </el-table-column>
       </el-table>
       <!--  -->
+      <!-- 单位显示隐藏 -->
+      <div class="showbox">
+        <el-popover
+          placement="bottom"
+          width="600"
+          trigger="manual"
+          content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。"
+          v-model="visible"
+        >
+          <div>
+            <span>单位查找</span>
+            <el-select
+              v-model="form.unit"
+              placeholder="请选择"
+              style="margin-left: 10px"
+            >
+              <el-option
+                v-for="item in customerorgdata"
+                :key="item.id"
+                :label="item.displayName"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </div>
+          <!-- 标题 -->
+          <div class="biaoti">
+            双击单位下的体检次数或部门可增加查询条件双击列表中的行可删除查询条件
+          </div>
+          <div class="boxflex">
+            <div class="leftbox">
+              <el-tree :data="customerorgdata" :props="defaultProps"></el-tree>
+            </div>
+            <div class="rigtbox">
+              <el-table :data="tableData" style="width: 100%">
+                <el-table-column prop="numberofpeople" label="单位">
+                </el-table-column>
+                <el-table-column prop="numberofpeople" label="次数">
+                </el-table-column>
+                <el-table-column prop="shareintotal" label="日期">
+                </el-table-column>
+              </el-table>
+              <div style="margin-top: 10px">登记日期方式</div>
+              <el-radio-group v-model="radio">
+                <el-radio :label="3">登记日期</el-radio>
+                <el-radio :label="6">体检日期</el-radio>
+                <el-radio :label="9">总检日期</el-radio>
+              </el-radio-group>
+              <div style="margin-top: 10px">单位选择方式</div>
+              <el-radio-group v-model="radio">
+                <el-radio :label="3">选择单位</el-radio>
+                <el-radio :label="6">不选单位</el-radio>
+              </el-radio-group>
+              <!--  -->
+              <div>
+                <el-button style="margin-left: 100%" @click="close"
+                  >关闭</el-button
+                >
+              </div>
+            </div>
+          </div>
+        </el-popover>
+      </div>
+
+      <!--  -->
     </el-card>
   </div>
 </template>
 <script>
 import { getapi, postapi } from "@/api/api";
+import { mapState } from "vuex";
 export default {
   data() {
     return {
+      radio: "",
+      defaultProps: {
+        label: "displayName",
+        children: "treeChildren",
+      },
+      visible: false,
       form: {
-        unitgrouping: "",
-        radio: "9",
-        diseasesource: "",
+        unit: "",
+        diagnosis: "",
       },
-      tableData: [{ fileno: "档案", sex: "未知", fullname: "张三", age: "20" }],
-      customerorgdata: [], //单位需要的数组
-      diseasesourcedata: [
+      CustomerOrgTreeStyle: "",
+      CustomerOrgRightStyle: "",
+      customerorgdatas: [],
+      tableData: [
         {
-          value: "1",
-          label: "综述",
+          disease: "是,否",
+          numberofpeople: "20",
+          shareintotal: "30",
         },
-        {
-          value: "2",
-          label: "建议",
-        },
-        {
-          value: "3",
-          label: "疾病列表",
-        },
-      ], //疾病来源
+      ],
+      customerorgdata: [],
+      diagnosisdata: [],
     };
   },
+  computed: {
+    ...mapState(["window", "dict", "patientRegister", "customerOrg"]),
+  },
+  created() {
+    // this.resize();
+  },
   mounted() {
     this.obtainingunits();
+    this.getdiagnosis();
   },
   methods: {
+    resize() {
+      //console.log(this.window.pageHeight,this.window.pageWidth)
+      let headerHeight = Number(150);
+
+      this.CustomerOrgTreeStyle =
+        "overflow: scroll;border: 1px solid;width:200px; height:" +
+        (this.window.pageHeight - headerHeight) +
+        "px;";
+      this.CustomerOrgRightStyle =
+        "margin-left: 10px;width:" +
+        (this.window.pageWidth - 200 - 60) +
+        "px; height:" +
+        (this.window.pageHeight - headerHeight) +
+        "px;";
+
+      if (this.window.pageHeight < 600) {
+        this.CustomerOrgTreeStyle =
+          "overflow: scroll;border: 1px solid;width:200px; height:" +
+          (600 - headerHeight) +
+          "px;";
+      }
+    },
+    close() {
+      this.visible = false;
+    },
+    // /api/app/customer-org/by-code-all
+    unitchang() {
+      console.log("1");
+      this.visible = true;
+      console.log(this.visible);
+      getapi("/api/app/customer-org/by-code-all").then((res) => {
+        this.customerorgdata = res.data;
+      });
+    },
     //获取单位
     obtainingunits() {
       getapi("/api/app/customer-org/by-code-all").then((res) => {
         this.customerorgdata = res.data;
       });
     },
+    //获取诊断
+    getdiagnosis() {
+      postapi("/api/app/diagnosis/getlistinfilter").then((res) => {
+        this.diagnosisdata = res.data.items;
+        console.log(res);
+      });
+    },
   },
 };
 </script>
-<style scoped>
+<style  scoped>
+.rigtbox {
+  margin-left: 10px;
+}
+.leftbox {
+  width: 30%;
+  border: 1px solid #ccc;
+}
+.boxflex {
+  display: flex;
+}
+.biaoti {
+  margin-top: 10px;
+}
+/* .el-select-dropdown__empty::v-deep {
+  display: none;
+} */
+.el-popover .el-popper .el-popover--plain {
+  width: 600px;
+}
+.showbox {
+  width: 600px;
+  height: 300px;
+  /* border: 1px solid #ccc; */
+  position: absolute;
+  left: 8.5%;
+  top: 140px;
+}
+.cards {
+  height: 800px;
+}
 .tabtitle {
   text-align: center;
   margin-top: 20px;

src/views/fee-settings/diseaseStatistics.vue

@@ -1,13 +1,17 @@
 <template>
-  <div class="box">
-    <el-card>
+  <div class="box" :style="CustomerOrgRightStyle">
+    <el-card class="cards">
       <el-row>
         <el-form ref="form" :model="form" label-width="120px">
-          <el-col :span="6">
+          <el-col :span="4">
             <el-form-item label="单位">
-              <el-select v-model="form.unit" placeholder="请选择">
+              <el-select
+                v-model="form.unit"
+                placeholder="请选择"
+                @focus="unitchang"
+              >
                 <el-option
-                  v-for="item in customerorgdata"
+                  v-for="item in customerorgdatas"
                   :key="item.id"
                   :label="item.displayName"
                   :value="item.id"
@@ -16,8 +20,8 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
-            <el-form-item label="诊断">
+          <el-col :span="4">
+            <el-form-item label="诊断" style="margin-left:-50px">
               <el-select v-model="form.diagnosis" placeholder="请选择">
                 <el-option
                   v-for="item in diagnosisdata"
@@ -29,8 +33,8 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
-            <el-form-item label="疾病来源">
+          <el-col :span="4">
+            <el-form-item label="疾病来源" style="margin-left:-50px">
               <el-select v-model="form.diagnosis" placeholder="请选择">
                 <el-option
                   v-for="item in diagnosisdata"
@@ -43,7 +47,7 @@
             </el-form-item>
           </el-col>
           <el-col :span="3">
-            <el-button type="primary">查询</el-button>
+            <el-button type="primary" style="margin-left: 10px">查询</el-button>
           </el-col>
         </el-form>
       </el-row>
@@ -58,18 +62,93 @@
         </el-table-column>
       </el-table>
       <!--  -->
+      <!-- 单位显示隐藏 -->
+      <div class="showbox">
+        <el-popover
+          placement="bottom"
+          width="600"
+          trigger="manual"
+          content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。"
+          v-model="visible"
+        >
+          <div>
+            <span>单位查找</span>
+            <el-select
+              v-model="form.unit"
+              placeholder="请选择"
+              style="margin-left: 10px"
+            >
+              <el-option
+                v-for="item in customerorgdata"
+                :key="item.id"
+                :label="item.displayName"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </div>
+          <!-- 标题 -->
+          <div class="biaoti">
+            双击单位下的体检次数或部门可增加查询条件双击列表中的行可删除查询条件
+          </div>
+          <div class="boxflex">
+            <div class="leftbox">
+              <el-tree :data="customerorgdata" :props="defaultProps"></el-tree>
+            </div>
+            <div class="rigtbox">
+              <el-table :data="tableData" style="width: 100%">
+                <el-table-column prop="numberofpeople" label="单位">
+                </el-table-column>
+                <el-table-column prop="numberofpeople" label="次数">
+                </el-table-column>
+                <el-table-column prop="shareintotal" label="日期">
+                </el-table-column>
+              </el-table>
+              <div style="margin-top: 10px">登记日期方式</div>
+              <el-radio-group v-model="radio">
+                <el-radio :label="3">登记日期</el-radio>
+                <el-radio :label="6">体检日期</el-radio>
+                <el-radio :label="9">总检日期</el-radio>
+              </el-radio-group>
+              <div style="margin-top: 10px">单位选择方式</div>
+              <el-radio-group v-model="radio">
+                <el-radio :label="3">选择单位</el-radio>
+                <el-radio :label="6">不选单位</el-radio>
+              </el-radio-group>
+              <!--  -->
+              <div>
+                <el-button style="margin-left: 100%" @click="close"
+                  >关闭</el-button
+                >
+              </div>
+            </div>
+          </div>
+        </el-popover>
+      </div>
+
+      <!--  -->
     </el-card>
   </div>
 </template>
 <script>
 import { getapi, postapi } from "@/api/api";
+import { mapState } from "vuex";
 export default {
   data() {
     return {
+      radio: "",
+      defaultProps: {
+        label: "displayName",
+        children: "treeChildren",
+      },
+      visible: false,
       form: {
         unit: "",
         diagnosis: "",
       },
+      CustomerOrgTreeStyle: "",
+      CustomerOrgRightStyle: "",
+      customerorgdatas: [],
       tableData: [
         {
           disease: "是,否",
@@ -81,11 +160,51 @@ export default {
       diagnosisdata: [],
     };
   },
+  computed: {
+    ...mapState(["window", "dict", "patientRegister", "customerOrg"]),
+  },
+  created() {
+    // this.resize();
+  },
   mounted() {
     this.obtainingunits();
     this.getdiagnosis();
   },
   methods: {
+    resize() {
+      //console.log(this.window.pageHeight,this.window.pageWidth)
+      let headerHeight = Number(150);
+
+      this.CustomerOrgTreeStyle =
+        "overflow: scroll;border: 1px solid;width:200px; height:" +
+        (this.window.pageHeight - headerHeight) +
+        "px;";
+      this.CustomerOrgRightStyle =
+        "margin-left: 10px;width:" +
+        (this.window.pageWidth - 200 - 60) +
+        "px; height:" +
+        (this.window.pageHeight - headerHeight) +
+        "px;";
+
+      if (this.window.pageHeight < 600) {
+        this.CustomerOrgTreeStyle =
+          "overflow: scroll;border: 1px solid;width:200px; height:" +
+          (600 - headerHeight) +
+          "px;";
+      }
+    },
+    close() {
+      this.visible = false;
+    },
+    // /api/app/customer-org/by-code-all
+    unitchang() {
+      console.log("1");
+      this.visible = true;
+      console.log(this.visible);
+      getapi("/api/app/customer-org/by-code-all").then((res) => {
+        this.customerorgdata = res.data;
+      });
+    },
     //获取单位
     obtainingunits() {
       getapi("/api/app/customer-org/by-code-all").then((res) => {
@@ -102,7 +221,37 @@ export default {
   },
 };
 </script>
-<style scoped>
+<style  scoped>
+.rigtbox {
+  margin-left: 10px;
+}
+.leftbox {
+  width: 30%;
+  border: 1px solid #ccc;
+}
+.boxflex {
+  display: flex;
+}
+.biaoti {
+  margin-top: 10px;
+}
+/* .el-select-dropdown__empty::v-deep {
+  display: none;
+} */
+.el-popover .el-popper .el-popover--plain {
+  width: 600px;
+}
+.showbox {
+  width: 600px;
+  height: 300px;
+  /* border: 1px solid #ccc; */
+  position: absolute;
+  left: 8.5%;
+  top: 140px;
+}
+.cards {
+  height: 800px;
+}
 .tabtitle {
   text-align: center;
   margin-top: 20px;

src/views/workload/doctorstaionworkload.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="box">
-    <el-card>
+    <el-card class="boxcard">
       <el-form :model="form">
         <el-row>
-          <el-col :span="6">
-            <el-form-item label="登记员">
+          <el-col :span="4">
+            <el-form-item label="总检医生" label-width="80px">
               <el-select v-model="form.username" placeholder="请选择">
                 <el-option
                   v-for="item in registrardata"
@@ -17,7 +17,7 @@
             </el-form-item>
           </el-col>
           <el-col :span="6">
-            <el-form-item label="登记日期">
+            <el-form-item label="登记日期" label-width="80px">
               <el-date-picker
                 v-model="form.registrationdate"
                 type="daterange"
@@ -37,12 +37,9 @@
       </el-form>
       <div>
         <!-- 时间 <span style="margin-left: 20px">xxx</span>
-
         至
         <span style="margin-left: 20px">xxx</span> -->
         <el-table :data="tableData" style="width: 100%">
-          <el-table-column prop="time" label="时间" width="180">
-          </el-table-column>
           <el-table-column prop="chiefexaminer" label="总检医生" width="180">
           </el-table-column>
           <el-table-column prop="numberofpeople" label="人数" width="180">
@@ -50,6 +47,9 @@
           <el-table-column prop="generalinspection" label="占总检总人数">
           </el-table-column>
         </el-table>
+        <div class="subtotalquantity">
+          <span>小计</span>
+        </div>
       </div>
     </el-card>
   </div>
@@ -77,7 +77,7 @@ export default {
         },
         {
           value: "2",
-          label: "测试",
+          label: "全部",
         },
       ],
     };
@@ -87,6 +87,13 @@ export default {
 };
 </script>
 <style scoped>
+.subtotalquantity{
+  margin-top: 10px;
+  text-align: center;
+}
+.boxcard {
+  height: 800px;
+}
 .tabtile {
   text-align: center;
   margin-top: 20px;

src/views/workload/individualfeedetails.vue

@@ -0,0 +1,148 @@
+<template>
+  <div class="box">
+    <el-card>
+      <el-form :model="form">
+        <el-row>
+          <el-col :span="4">
+            <el-form-item label="收费员" label-width="80px">
+              <el-select v-model="form.username" placeholder="请选择">
+                <el-option
+                  v-for="item in registrardata"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="档案号" label-width="80px">
+              <el-input v-model="form.username" style="width: 70%"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="7">
+            <el-form-item label="登记日期" label-width="80px">
+              <el-date-picker
+                v-model="form.registrationdate"
+                type="daterange"
+                range-separator="--"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="报表格式" label-width="80px">
+              <el-select v-model="form.reportform" placeholder="请选择">
+                <el-option
+                  v-for="item in reportform"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="3">
+            <el-button type="primary">查询</el-button>
+          </el-col>
+        </el-row>
+        <!-- d登记标题 -->
+        <h3 class="tabtile">收费员支付方式统计报表</h3>
+      </el-form>
+      <div>
+        <el-table :data="tableData" style="width: 100%">
+          <el-table-column prop="fileno" label="档案号" width="180">
+          </el-table-column>
+          <el-table-column
+            prop="physicalexamination"
+            label="体检次数"
+            width="180"
+          >
+          </el-table-column>
+          <el-table-column prop="surmame" label="姓名" width="180">
+          </el-table-column>
+          <el-table-column prop="gender" label="性别" width="180">
+          </el-table-column>
+          <el-table-column prop="age" label="年龄"> </el-table-column>
+          <el-table-column prop="asbitem" label="组合项目"> </el-table-column>
+          <el-table-column prop="price" label="标准价格"> </el-table-column>
+          <el-table-column prop="paidinprice" label="实收价格">
+          </el-table-column>
+          <el-table-column prop="paidinprice" label="折扣"> </el-table-column>
+          <el-table-column prop="bookkeeper" label="记账人"> </el-table-column>
+          <el-table-column prop="postingdate" label="记账日期">
+          </el-table-column>
+        </el-table>
+        <!-- 登记员<span style="margin-left: 20px">xxx</span>
+        人数
+        <span style="margin-left: 20px">xxx</span>
+        站登记总人数百分比
+        <span style="margin-left: 20px">xxx</span> -->
+      </div>
+    </el-card>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      tableData: [
+        {
+          fileno: "85415858",
+          physicalexamination: "52",
+          surmame: "张三",
+          gender: "未知",
+          age: "20",
+          asbitem: "体重",
+          price: "50",
+          paidinprice: "30",
+          discount: "5.5",
+          bookkeeper: "测试",
+          postingdate: "2023-8-3",
+        },
+      ],
+      form: {
+        username: "",
+        registrationdate: "",
+        reportform: "",
+      },
+      reportform: [
+        {
+          value: "1",
+          label: "支付方式",
+        },
+        {
+          value: "2",
+          label: "发票项目",
+        },
+        {
+          value: "3",
+          label: "组合项目",
+        },
+      ],
+      registrardata: [
+        {
+          value: "1",
+          label: "张三",
+        },
+        {
+          value: "2",
+          label: "测试",
+        },
+      ],
+    };
+  },
+  mounted() {},
+  methods: {},
+};
+</script>
+<style scoped>
+.tabtile {
+  text-align: center;
+  margin-top: 20px;
+}
+</style>

src/views/workload/membershipcard.vue

@@ -0,0 +1,127 @@
+<template>
+  <div class="box">
+    <el-card>
+      <el-form :model="form">
+        <el-row>
+          <el-col :span="4">
+            <el-form-item label="登记员">
+              <el-select v-model="form.username" placeholder="请选择">
+                <el-option
+                  v-for="item in registrardata"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="7">
+            <el-form-item label="记账时间">
+              <el-date-picker
+                v-model="form.registrationdate"
+                type="daterange"
+                range-separator="--"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="报表格式">
+              <el-select v-model="form.reportform" placeholder="请选择">
+                <el-option
+                  v-for="item in reportform"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="3">
+            <el-button type="primary">查询</el-button>
+          </el-col>
+        </el-row>
+        <!-- d登记标题 -->
+        <h3 class="tabtile">会员卡分类登记</h3>
+      </el-form>
+      <div>
+        <el-table :data="tableData" style="width: 100%">
+          <el-table-column prop="cardtype" label="卡类型" width="180">
+          </el-table-column>
+          <el-table-column prop="salesamount" label="销售金额" width="180">
+          </el-table-column>
+          <el-table-column
+            prop="consumptionamount"
+            label="消费金额"
+            width="180"
+          >
+          </el-table-column>
+          <el-table-column prop="shareofsales" label="占销售百分比" width="180">
+          </el-table-column>
+        </el-table>
+        <!-- 登记员<span style="margin-left: 20px">xxx</span>
+        人数
+        <span style="margin-left: 20px">xxx</span>
+        站登记总人数百分比
+        <span style="margin-left: 20px">xxx</span> -->
+      </div>
+    </el-card>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      tableData: [
+        {
+          cardtype: "会员卡",
+          salesamount: "100",
+          consumptionamount: "60",
+          shareofsales: "30%",
+        },
+      ],
+      form: {
+        username: "",
+        registrationdate: "",
+        reportform: "",
+      },
+      reportform: [
+        {
+          value: "1",
+          label: "支付方式",
+        },
+        {
+          value: "2",
+          label: "发票项目",
+        },
+        {
+          value: "3",
+          label: "组合项目",
+        },
+      ],
+      registrardata: [
+        {
+          value: "1",
+          label: "张三",
+        },
+        {
+          value: "2",
+          label: "测试",
+        },
+      ],
+    };
+  },
+  mounted() {},
+  methods: {},
+};
+</script>
+<style scoped>
+.tabtile {
+  text-align: center;
+  margin-top: 20px;
+}
+</style>

src/views/workload/registrar.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="box">
-    <el-card>
+    <el-card class="boxcard">
       <el-form :model="form">
         <el-row>
-          <el-col :span="6">
+          <el-col :span="4">
             <el-form-item label="登记员">
               <el-select v-model="form.username" placeholder="请选择">
                 <el-option
@@ -89,6 +89,9 @@ export default {
 };
 </script>
 <style scoped>
+.boxcard{
+  height: 800px;
+}
 .tabtile {
   text-align: center;
   margin-top: 20px;

src/views/workload/tollcollector.vue

@@ -3,7 +3,7 @@
     <el-card>
       <el-form :model="form">
         <el-row>
-          <el-col :span="6">
+          <el-col :span="4">
             <el-form-item label="登记员">
               <el-select v-model="form.username" placeholder="请选择">
                 <el-option
@@ -16,7 +16,7 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+          <el-col :span="7">
             <el-form-item label="登记日期">
               <el-date-picker
                 v-model="form.registrationdate"