up

src/api/fill/index.js

@@ -0,0 +1,49 @@
+import request from "@/utils/request";
+
+export function overview (params,isLoading=false) {
+  return request({
+    method: "get",
+    url: "/api/admin/statistic/year-overview",
+    params,
+    isLoading
+  })
+}
+
+export function personOverview (params,isLoading=false) {
+  return request({
+    method: "get",
+    url: "/api/admin/statistic/person-year-overview",
+    params,
+    isLoading
+  })
+}
+
+export function personDetail (params,isLoading=false) {
+  return request({
+    method: "get",
+    url: "/api/admin/statistic/person-year-detail",
+    params,
+    isLoading
+  })
+}
+
+export function getByCategory (params,isLoading=true) {
+  return request({
+    method: "get",
+    url: "/api/admin/statistic/get-by-category",
+    params,
+    isLoading
+  })
+}
+
+
+
+export function recordShow (params,isLoading=true) {
+  return request({
+    method: "get",
+    url: "/api/admin/statistic/record-show",
+    params,
+    isLoading
+  })
+}
+

src/router/index.js

@@ -74,7 +74,11 @@ export const constantRoutes = [{
       }
     }, ]
   },
-
+  {
+    path: '/fill/formindex',
+    component: () => import('@/views/fill/formindex.vue'),
+    hidden: true
+  },
   {
     path: "/h5",
     name: "h5",

src/views/fill/formindex.vue

@@ -0,0 +1,341 @@
+<template>
+  <div class="card">
+    <div style="padding: 15px">
+      <el-radio-group v-model="select.year">
+        <el-radio v-for="item in years" :label="item" border>{{ item }}</el-radio>
+      </el-radio-group>
+    </div>
+    <div class="info">
+      <p class="info__title">
+        {{ personInfo.title }}
+      </p>
+
+      <div class="info__status">
+        正常填报 <div class="cir1"></div> {{ personInfo.count_normal }}，迟报 <div class="cir2"></div> {{ personInfo.count_delayed }}，逾期未报 <div class="cir3"></div> {{ personInfo.count_missed }}
+      </div>
+    </div>
+    <xy-table
+      ref="xyTable"
+      height=""
+      :isHandlerKey="false"
+      :is-page="false"
+      :list="categories"
+      res-prop=""
+      :indent="20"
+      :row-key="(row) => row._index"
+      :table-item="table"
+      :auths="[]"
+    >
+    </xy-table>
+
+    <show ref="show"></show>
+  </div>
+</template>
+
+<script>
+import show from "@/views/fill/formshow.vue";
+import {personOverview,personDetail} from "@/api/fill/index"
+import {categoryYears} from "@/api/category"
+export default {
+  components: {
+    show
+  },
+  // inject: ['myInfo', 'statics'],
+  data() {
+    return {
+      personInfo:{
+        title:'',
+        count_normal:0,
+        count_delayed:0,
+        count_missed:0
+      },
+      select: {
+        year: this.$moment().format("YYYY"),
+        person_id:''
+      },
+      years: [],
+      categories: [],
+      table: [
+        {
+          type: "",
+          label: "",
+          prop: "index",
+          customFn: row => {
+            return row._type === 'type' ? row._text : row._index;
+          }
+        },
+        {
+          prop: "title",
+          label: "清单类型名称",
+          minWidth: 300,
+          renderHeader: col => {
+            return (
+              <div>{ this.title ? this.title.substring(0, this.title.length - 2) + '清单' : '清单类型名称' }</div>
+            )
+          },
+          align: "left",
+          customFn: (row) => {
+            return row._type === "type" ? (
+              <span>
+                <i
+                  style="padding: 0 8px;color: rgb(239, 216, 117);"
+                  class="el-icon-folder-opened"
+                ></i>
+                <span>{row.title}</span>
+              </span>
+            ) : (
+              <span>
+                <i style="padding: 0 8px;" class="el-icon-document"></i>
+                <span>{row.title}</span>
+              </span>
+            );
+          },
+        },
+        {
+          fixed: "right",
+          prop: "records_count",
+          label: "填报要求",
+          width: 240,
+          customFn: row => {
+            return(<div>
+              {
+                row.rules.map(item => (<div>{item.start_at} ~ {item.end_at}不少于{item.quantity}条</div>))
+              }
+            </div>)
+          }
+        },
+        {
+          fixed: "right",
+          prop: "records_count",
+          label: "填报情况",
+          showOverflowTooltip: false,
+          width: 80,
+          customFn: (row) => {
+            return row._is_end ? (
+              <div>
+                <Button type="primary" size="small" ghost on={{
+                  ['click']:_ => {
+                    this.openShow(row)
+                  }
+                }}>
+                  查看
+                  <Icon type="ios-search"></Icon>
+                </Button>
+              </div>
+            ) : '';
+          },
+        },
+        {
+          fixed: "right",
+          label: "系统预警",
+          width: 116,
+          customFn: row => {
+            let color = ['#377e22', '#f2a93c', '#ea3423']
+            let nums = [
+              row.rules.reduce((pre, cur) => (pre + (cur.record_count?.count_normal ?? 0)),0),
+              row.rules.reduce((pre, cur) => (pre + (cur.record_count?.count_delayed ?? 0)),0),
+              row.rules.reduce((pre, cur) => (pre + (cur.record_count?.count_missed ?? 0)),0)
+            ]
+            return row._is_end ? (
+              <div style="display: flex;">
+                {
+                  Array.from({ length: 3 },_ => undefined).map((i, index) => (
+                    <div style="display: flex;align-items: center;">
+                      <div style={{
+                        'color': '#fff',
+                        'background': color[index],
+                        'padding': '10px',
+                        'border-radius': '100%'
+                      }}></div>
+                      <span style="padding: 4px;">{ nums[index] }</span>
+                    </div>
+                  ))
+                }
+              </div>
+            ) : ''
+          }
+        },
+      ],
+    };
+  },
+  methods: {
+
+    toChineseNum(number) {
+      const chineseNum = [
+        "零",
+        "一",
+        "二",
+        "三",
+        "四",
+        "五",
+        "六",
+        "七",
+        "八",
+        "九",
+      ];
+      const chineseUnit = ["", "十", "百", "千", "万", "亿"];
+      let numStr = number.toString();
+      let len = numStr.length;
+      let str = "";
+      for (let i = 0; i < len; i++) {
+        str += chineseNum[parseInt(numStr[i])] + chineseUnit[len - 1 - i];
+      }
+      str = str.replace(/零[十百千]/g, "零");
+      str = str.replace(/零+/g, "零");
+      str = str.replace(/^零+/, "");
+      str = str.replace(/零+$/, "");
+      if (str[str.length - 1] === "零") {
+        str = str.slice(0, -1);
+      }
+      return str;
+    },
+
+    formatList(data = [], pid) {
+      data.forEach((item, index) => {
+        if (item.hasOwnProperty('categories_tree')) {
+          item._id = item.id
+          delete item.id;
+          item._disabled = true
+          item._type = 'type'
+          item.children = item.categories_tree
+          item._text = this.toChineseNum(index + 1)
+        } else {
+          item._type = 'doc'
+          item._index = pid ? `${pid}-${index+1}` : (index + 1)
+          // item._index = pid ? (index+1) : (index + 1)
+        }
+        if (item.children instanceof Array && item.children.length > 0) {
+          this.formatList(item.children, item._index ? item._index : false)
+        } else {
+          item._is_end = 1
+        }
+      })
+    },
+
+
+// 获取年份
+    async getYears () {
+      const res = await categoryYears();
+      this.select.year = res.selected_year;
+      this.years = res.years;
+    },
+    async getPerson(){
+      const res = await personOverview({
+        year:this.select.year,
+        person_id:this.select.id
+      })
+      this.personInfo = res
+      let title = `${res.person?.department?.name ?? ''}-${res.person?.name ?? ''}-${res.person?.category_type?.title ?? ''}-${this.select.year}年填报总览`
+      this.personInfo.title = title
+    },
+// 获取类型
+    async getPersonDetail(){
+      const res = await personDetail({
+        year:this.select.year,
+        person_id:this.select.id
+      })
+      this.formatList(res);
+      this.categories = res;
+    },
+    openShow(row){
+
+      this.$refs['show'].setId(row.id)
+      this.$refs['show'].setPersonId(this.select.id)
+      this.$refs['show'].show()
+    }
+
+  },
+  watch: {
+  },
+  created() {
+    console.log(this.$route.query.id)
+    this.select.id = this.$route.query.id
+    this.getYears();
+    this.getPerson()
+    this.getPersonDetail()
+    // this.getCategories();
+
+  },
+};
+</script>
+
+<style lang="scss">
+.el-cascader-node__label {
+  max-width: 300px;
+}
+</style>
+<style scoped lang="scss">
+.card {
+  height: 100%;
+  background-color: #fff;
+  margin: 40px;
+}
+.info {
+  border-top: 1px solid #EBEEF5;
+  background: #faf0e9;
+
+  padding: 10px 15px;
+  &__title {
+    font-size: 22px;
+    font-weight: 600;
+
+    padding-bottom: 8px;
+  }
+  &__status {
+    $color: #377e22,#f2a93c,#ea3423;
+    display: flex;
+    align-items: center;
+    font-size: 12px;
+
+    @mixin cir {
+      padding: 8px;
+      border-radius: 100%;
+
+      margin: 0 6px;
+    }
+    @for $i from 1 through length($color) {
+      .cir#{$i} {
+        @include cir;
+        background: nth($color, $i);
+      }
+    }
+  }
+}
+::v-deep .table-tree {
+  height: 100%;
+  background: #f0f2f8;
+}
+::v-deep .el-radio__input.is-checked + .el-radio__label {
+  color: #c4312b;
+}
+
+::v-deep .el-radio__input.is-checked .el-radio__inner {
+  background-color: #c4312b;
+  border-color: #c4312b;
+}
+::v-deep .el-radio__inner {
+  width: 18px;
+  height: 18px;
+}
+::v-deep .el-radio__input.is-checked .el-radio__inner:after {
+  content: "";
+  width: 12px;
+  height: 6px;
+  margin-top: -1px;
+  border: 2px solid white;
+  border-top: transparent;
+  border-right: transparent;
+  text-align: center;
+  display: block;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  vertical-align: middle;
+  transform: translate(-50%, -50%) rotate(-45deg);
+  border-radius: 0px;
+  background: none;
+}
+::v-deep .el-tabs__nav-wrap::after {
+  background-color: #ebeef5;
+}
+</style>

src/views/fill/formshow.vue

@@ -0,0 +1,120 @@
+<template>
+  <div>
+    <el-dialog title="填报" width="860px" :visible.sync="visible">
+
+      <xy-table style="width: 820px"
+                stripe
+                ref="xyTable"
+                :req-opt="select"
+                :is-first-req="false"
+                :height="500"
+                :list="list"
+                :table-item="table">
+      </xy-table>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getByCategory, recordShow } from "@/api/fill/index";
+export default {
+  data() {
+    return {
+      auth: [],
+      visible: false,
+      list:[],
+      select:{
+        category_id: "",
+        person_id:''
+      },
+
+      table: [
+        {
+          prop: "title",
+          label: "标题",
+          fixed: "left",
+          width: 180
+        },
+        {
+          prop: "created_at",
+          label: "填报日期",
+          width: 160
+        },
+        {
+          prop: "content",
+          label: "内容",
+          align: "left",
+          minWidth: 200
+        },
+        {
+          prop: "operate",
+          label: "操作",
+          align: "left",
+          width: 140,
+          customFn: row => {
+            const _this = this
+            return (
+              <div>
+                <Button type="primary"
+                size="small"
+                on={{
+                  ['click']:_ => {
+                    this.showInfo(row.id)
+                  }
+                }}>查看</Button>
+              </div>
+            )
+          }
+        }
+      ]
+    }
+  },
+  methods: {
+
+    getList(){
+      getByCategory({
+        person_id:this.select.person_id,
+        category_id:this.select.category_id
+      }).then(res=>{
+        this.list = res.data
+      })
+    },
+    show () {
+      this.visible = true;
+    },
+    hide () {
+      this.visible = false;
+    },
+    setId (id) {
+      this.select.category_id = id;
+    },
+    setPersonId (id) {
+      this.select.person_id = id;
+    },
+    getData () {
+      this.$refs['xyTable'].getTableData()
+    },
+    showInfo(id){
+
+    },
+
+  },
+  computed: {},
+  watch: {
+    visible (newVal) {
+      if (newVal) {
+        this.$nextTick(_ => {
+          this.getList()
+        })
+      } else {
+
+      }
+    }
+  },
+  created() {
+  }
+}
+</script>
+
+<style scoped lang="scss">
+</style>

src/views/fill/index.vue

@@ -35,7 +35,7 @@
           <el-table-column align='center' fixed="right" label="操作" width="100" header-align="center">
             <template slot-scope="scope">
               <div  style="display: flex;">
-                <Button size="small" type="primary" @click="">查看</Button>
+                <Button size="small" type="primary" @click="$router.push(`/fill/formindex?id=${scope.row.id}`)">查看</Button>
               </div>
 
             </template>

src/views/fill/view.vue

@@ -14,23 +14,23 @@
     </div>
     <div class="content">
       <div>
-        <div>5</div>
+        <div>{{viewlist.count_category_type?viewlist.count_category_type:0}}</div>
         <div>清单类型</div>
       </div>
       <div>
-        <div>5</div>
+        <div>{{viewlist.count_category?viewlist.count_category:0}}</div>
         <div>填报清单项</div>
       </div>
       <div>
-        <div>5</div>
+        <div>{{viewlist.count_person?viewlist.count_person:0}}</div>
         <div>“一把手”和领导班子</div>
       </div>
       <div>
-        <div>5</div>
+        <div>{{viewlist.count_record?viewlist.count_record:0}}</div>
         <div>条填报记录</div>
       </div>
       <div>
-        <div>5</div>
+        <div>{{viewlist.count_record_missed?viewlist.count_record_missed:0}}</div>
         <div>超期未报</div>
       </div>
     </div>
@@ -38,6 +38,7 @@
 </template>
 
 <script>
+  import {overview} from "@/api/fill/index"
   export default{
     data(){
       return{
@@ -48,10 +49,17 @@
       }
     },
     created(){
-
+      this.getOverview()
     },
     methods:{
-      changeYear(e){}
+      changeYear(e){},
+      getOverview(){
+        overview({
+          year:this.select.year
+        }).then(res=>{
+          this.viewlist = res
+        })
+      }
     },
   }
 </script>

src/views/person/component/create.vue

@@ -1,5 +1,6 @@
 <script>
 import { listCommondepartment } from "@/api/common";
+import { index as typeIndex } from "@/api/categoryType";
 import { save, show, store, index, destroy } from "@/api/person";
 import { CreateDialog } from "@/utils/createDialog"
 import { deepCopy } from "@/utils";
@@ -24,11 +25,12 @@ export default {
           field: "department_id",
           edit_input: "radio",
           form_show: true,
-          _params: []
+          _params: [],
+
         },
         {
-          name: "人员类型",
-          field: "person_type",
+          name: "清单类型",
+          field: "category_type_id",
           edit_input: "radio",
           form_show: true,
           _params: []
@@ -39,12 +41,12 @@ export default {
           edit_input: 'text',
           form_show: true
         },
-        // {
-        //   name: '职位',
-        //   field: 'position',
-        //   edit_input: 'text',
-        //   form_show: true
-        // },
+        {
+          name: '职位',
+          field: 'position',
+          edit_input: 'text',
+          form_show: true
+        },
         // {
         //   name: '是否在职',
         //   field: 'is_active',
@@ -104,9 +106,9 @@ export default {
         // position: [
         //   { required: true,message: "请填写职位" }
         // ],
-        // is_active: [
-        //   { required: true,message: "请选择是否在职" }
-        // ],
+        category_type_id: [
+          { required: true,message: "请选择清单类型" }
+        ],
         department_id: [
           { required: true,message: "请选择部门" }
         ],
@@ -288,8 +290,14 @@ export default {
   },
   created() {
     listCommondepartment().then(res => {
+      res.data.map(item=>{
+        item.name=item.name+"("+item.abbr+")"
+      })
       this.formInfo.find(i => i.field === 'department_id')._params = res.data
     })
+    typeIndex({ page: 1,page_size: 999 }).then(res => {
+      this.formInfo.find(i => i.field === 'category_type_id')._params = res.data
+    })
   }
 };
 </script>

src/views/person/person.vue

@@ -102,7 +102,7 @@ export default {
           width: 120
         },
         {
-          prop: "person.name",
+          prop: "category_type.title",
           label: "清单类型",
           width: 120
         },
@@ -123,9 +123,12 @@ export default {
           customFn: (row) => {
             return ( <el-switch
               v-model={row.status}
+              // disabled
+              // readonly
               on = {
                 {
                   ['change']: (e) => {
+                    console.log("asd")
 
                   }
                 }

src/views/system/department.vue

@@ -54,6 +54,9 @@
         <el-form-item label="部门名称" prop="name">
           <el-input v-model="form.name" autocomplete="off"></el-input>
         </el-form-item>
+        <el-form-item label="部门简称" prop="abbr">
+          <el-input v-model="form.abbr" autocomplete="off"></el-input>
+        </el-form-item>
         <el-form-item label="部门负责人" prop="manager">
           <el-autocomplete class="inline-input" v-model="form.manager" :fetch-suggestions="querySearch"
             placeholder="请输入部门负责人" :trigger-on-focus="false" @select="handleSelectManager"></el-autocomplete>
@@ -100,6 +103,7 @@
         formLabelWidth: "120px",
         form: {
           name: "",
+          abbr:'',
           id: "",
           pid: "0",
           manager_id: "",
@@ -115,6 +119,11 @@
             required: true,
             message: '请输入部门名称',
             trigger: 'blur'
+          }],
+          abbr: [{
+            required: true,
+            message: '请输入部门简称',
+            trigger: 'blur'
           }]
         },
         tableHeight: 0,