From e4e1be720ccd1d864cf820ef116fe05167aca4fa Mon Sep 17 00:00:00 2001
From: lin <sbla5888@163.com>
Date: Sat, 23 Mar 2024 14:09:13 +0800
Subject: [PATCH] 维修基金筛选

---
 src/views/propertySupervision/components/todo.vue |  744 ++++++++++++++++++++++++++++++--------------------------
 1 files changed, 395 insertions(+), 349 deletions(-)

diff --git a/src/views/propertySupervision/components/todo.vue b/src/views/propertySupervision/components/todo.vue
index 5ce4198..e042765 100644
--- a/src/views/propertySupervision/components/todo.vue
+++ b/src/views/propertySupervision/components/todo.vue
@@ -1,268 +1,314 @@
 <template>
-    <div>
-        <avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form"
-            @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange"
-            @current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
-            <template slot-scope="{row, size, index}" slot="menu">
-                <el-button type="text" :size="size" icon="el-icon-s-check" v-if="permission.work_todo_handle"
-                    @click.stop="handleWork(row)">处理
-                </el-button>
-                <el-button type="text" :size="size" icon="el-icon-info" v-if="permission.work_todo_detail"
-                    @click.stop="handleDetail(row)">详情
-                </el-button>
-                <el-button type="text" :size="size" icon="el-icon-search" v-if="permission.work_todo_follow"
-                    @click.stop="handleImage(row, index)">流程图
-                </el-button>
-            </template>
+  <div>
+    <avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form"
+      @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange"
+      @current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
+      <template slot-scope="{row, size, index}" slot="menu">
+        <el-button type="text" :size="size" icon="el-icon-s-check" v-if="permission.work_todo_handle"
+          @click.stop="handleWork(row)">处理
+        </el-button>
+        <el-button type="text" :size="size" icon="el-icon-info" v-if="permission.work_todo_detail"
+          @click.stop="handleDetail(row)">详情
+        </el-button>
+        <el-button type="text" :size="size" icon="el-icon-search" v-if="permission.work_todo_follow"
+          @click.stop="handleImage(row, index)">流程图
+        </el-button>
+      </template>
 
-            <template slot-scope="{row, size}" slot="processDefinitionVersion">
-                <el-tag :size="size">v{{ row.processDefinitionVersion }}</el-tag>
-            </template>
-            <template slot-scope="{row, size}" slot="linkPhone">
-                <el-button :size="size" type="text" @click="showStringDispose(row, 'linkPhoneflag')"
-                    v-text="textDispose(row, 'linkPhoneflag', 'linkPhone')">
-                </el-button>
-            </template>
-        </avue-crud>
-        <flow-design is-dialog :is-display.sync="flowBox" :process-instance-id="processInstanceId"></flow-design>
-    </div>
+      <template slot-scope="{row, size}" slot="processDefinitionVersion">
+        <el-tag :size="size">v{{ row.processDefinitionVersion }}</el-tag>
+      </template>
+      <template slot-scope="{row, size}" slot="linkPhone">
+        <el-button :size="size" type="text" @click="showStringDispose(row, 'linkPhoneflag')"
+          v-text="textDispose(row, 'linkPhoneflag', 'linkPhone')">
+        </el-button>
+      </template>
+    </avue-crud>
+    <flow-design is-dialog :is-display.sync="flowBox" :process-instance-id="processInstanceId"></flow-design>
+  </div>
 </template>
-  
+
 <script>
-import {
+  import {
     mapGetters
-} from "vuex"
-import {
+  } from "vuex"
+  import {
     todoList
-} from "@/api/work/work"
-import {
+  } from "@/api/work/work"
+  import {
     flowCategory,
     flowRoute
-} from "@/util/flow"
+  } from "@/util/flow"
 
-export default {
-    data () {
-        return {
-            typeStatus: 1,
-            form: {},
-            selectionId: '',
-            selectionList: [],
-            query: {},
-            loading: true,
-            page: {
-                pageSize: 10,
-                currentPage: 1,
-                total: 0
-            },
-            processInstanceId: '',
-            flowBox: false,
-            workBox: false,
-            option: {
-                labelWidth: 120,
-                searchLabelWidth: 96,
-                searchShow: true,
-                searchMenuSpan: 3,
-                menuWidth: 210,
+  export default {
+    data() {
+      return {
+        datetime: "",
+        typeStatus: 1,
+        form: {},
+        selectionId: '',
+        selectionList: [],
+        query: {},
+        loading: true,
+        page: {
+          pageSize: 10,
+          currentPage: 1,
+          total: 0
+        },
+        processInstanceId: '',
+        flowBox: false,
+        workBox: false,
+        option: {
+          labelWidth: 120,
+          searchLabelWidth: 96,
+          searchShow: true,
+          searchMenuSpan: 3,
+          menuWidth: 210,
 
-                height: 'auto',
-                calcHeight: 30,
-                tip: false,
-                simplePage: true,
-                border: true,
-                index: true,
-                // selection: true,
-                editBtn: false,
-                addBtn: false,
-                viewBtn: false,
-                delBtn: false,
-                columnBtn: false,
-                dialogWidth: 900,
-                dialogClickModal: false,
-                header: false,
-                column: [{
-                    label: "流程分类",
-                    type: "select",
-                    row: true,
-                    dicUrl: "/api/blade-system/dict/dictionary?code=flow",
-                    props: {
-                        label: "dictValue",
-                        value: "dictKey"
-                    },
-                    dataType: "number",
-                    slot: true,
-                    prop: "category",
-                    // search: true,
-                    hide: true,
-                    width: 100,
-                },
-                {
-                    width: 100,
-                    label: '申请类型',
-                    prop: 'categoryName',
-                    // search: true,
-                },
-                {
-                    width: 220,
-                    overHidden: true,
-                    label: "小区",
-                    prop: "districtId",
-                    // search: true,
-                    type: 'tree',
-                    dicUrl: `/api/blade-district/district/getDistrictTree`,
-                    props: {
-                        label: "name",
-                        value: "id"
-                    },
-                    defaultExpandedKeys: ["361102003"],
-                    searchSpan: 5,
-                    span: 12,
-                },
-                {
-                    width: 110,
-                    label: '联系人',
-                    prop: 'linkman',
-                    // search: true,
-                },
-                {
-                    width: 120,
-                    label: '联系电话',
-                    prop: 'linkPhone',
-                    // search: true,
-                    slot: true
-                },
-                {
-                    label: '项目名称',
-                    prop: 'name',
-                    // search: true,
-                },
-                {
-                    label: '当前步骤',
-                    prop: 'taskName',
-                },
-                // {
-                //   label: '流程版本',
-                //   prop: 'processDefinitionVersion',
-                //   // slot: true,
-                //   width: 80,
-                // },
-                {
-                    width: 144,
-                    label: '申请时间',
-                    prop: 'createTime',
-                },
-                ]
+          height: 'auto',
+          calcHeight: 30,
+          tip: false,
+          simplePage: true,
+          border: true,
+          index: true,
+          // selection: true,
+          editBtn: false,
+          addBtn: false,
+          viewBtn: false,
+          delBtn: false,
+          columnBtn: false,
+          dialogWidth: 900,
+          dialogClickModal: false,
+          header: false,
+          column: [{
+              label: "流程分类",
+              type: "select",
+              row: true,
+              dicUrl: "/api/blade-system/dict/dictionary?code=flow",
+              props: {
+                label: "dictValue",
+                value: "dictKey"
+              },
+              dataType: "number",
+              slot: true,
+              prop: "category",
+              // search: true,
+              hide: true,
+              width: 100,
             },
-            data: []
-        }
+            {
+              width: 100,
+              label: '申请类型',
+              prop: 'categoryName',
+              // search: true,
+            },
+            {
+              width: 220,
+              overHidden: true,
+              label: "小区",
+              prop: "districtId",
+              // search: true,
+              type: 'tree',
+              dicUrl: `/api/blade-district/district/getDistrictTree`,
+              props: {
+                label: "name",
+                value: "id"
+              },
+              defaultExpandedKeys: ["361102003"],
+              searchSpan: 5,
+              span: 12,
+            },
+            {
+              width: 110,
+              label: '小区名称',
+              prop: 'districtName',
+              search: true,
+              hide: true,
+            },
+            // {
+            //   label: '项目名称',
+            //   prop: 'name',
+            //   search: true,
+            // },
+            {
+              label: "申请时间",
+              prop: "dateTime",
+              type: "datetimerange",
+              defaultTime: ['00:00:00', '23:59:59'],
+              format: 'yyyy-MM-dd HH:mm:ss',
+              valueFormat: 'yyyy-MM-dd HH:mm:ss',
+              startPlaceholder: '开始范围自定义',
+              endPlaceholder: '结束范围自定义',
+              searchSpan: 5,
+              searchRange: true,
+              hide: true,
+              addDisplay: false,
+              editDisplay: false,
+              viewDisplay: false,
+              search: true,
+              rules: [{
+                required: true,
+                message: "请选择申请时间",
+                trigger: "blur",
+              }, ],
+            },
+
+            {
+              width: 110,
+              label: '联系人',
+              prop: 'linkman',
+              // search: true,
+            },
+            {
+              width: 120,
+              label: '联系电话',
+              prop: 'linkPhone',
+              // search: true,
+              slot: true
+            },
+            {
+              label: '项目名称',
+              prop: 'name',
+              // search: true,
+            },
+            {
+              label: '当前步骤',
+              prop: 'taskName',
+            },
+            // {
+            //   label: '流程版本',
+            //   prop: 'processDefinitionVersion',
+            //   // slot: true,
+            //   width: 80,
+            // },
+            {
+              width: 144,
+              label: '申请时间',
+              prop: 'createTime',
+            },
+          ]
+        },
+        data: []
+      }
     },
     computed: {
-        ...mapGetters(["permission", "flowRoutes"]),
-        ids () {
-            let ids = []
-            this.selectionList.forEach(ele => {
-                ids.push(ele.id)
-            })
-            return ids.join(",")
-        },
+      ...mapGetters(["permission", "flowRoutes"]),
+      ids() {
+        let ids = []
+        this.selectionList.forEach(ele => {
+          ids.push(ele.id)
+        })
+        return ids.join(",")
+      },
 
-        textDispose () {
-            return (row, flag, type) => {
-                if (row[flag] || row[type] == null) {
-                    return row[type]
-                } else {
-                    if (type == 'principalIdCard') {
-                        return row[type].replace(/^(.{6})(?:\d+)(.{4})$/, "$1******$2")
-                    } else {
-                        return row[type].replace(/^(.{3})(?:\d+)(.{4})$/, "$1****$2")
-                    }
-                }
+      textDispose() {
+        return (row, flag, type) => {
+          if (row[flag] || row[type] == null) {
+            return row[type]
+          } else {
+            if (type == 'principalIdCard') {
+              return row[type].replace(/^(.{6})(?:\d+)(.{4})$/, "$1******$2")
+            } else {
+              return row[type].replace(/^(.{3})(?:\d+)(.{4})$/, "$1****$2")
             }
+          }
         }
+      }
     },
     methods: {
 
-        changeType (type) {
-            this.typeStatus = type
-            this.page.currentPage = 1
-            // this.onLoad(this.page)
-        },
-        showStringDispose (row, type) {
-            row[type] = !row[type]
-        },
+      changeType(type) {
+        this.typeStatus = type
+        this.page.currentPage = 1
+        // this.onLoad(this.page)
+      },
+      showStringDispose(row, type) {
+        row[type] = !row[type]
+      },
 
-        searchReset () {
-            this.query = {}
-            this.onLoad(this.page)
-        },
-        searchChange (params, done) {
-            this.query = params
-            this.page.currentPage = 1
-            this.onLoad(this.page, params)
-            done()
-        },
-        selectionChange (list) {
-            this.selectionList = list
-        },
-        selectionClear () {
-            this.selectionList = []
-            this.$refs.crud.toggleSelection()
-        },
-        handleWork (row) {
-            this.$router.push({
-                path: `/propertySupervision/process/${flowRoute(this.flowRoutes, row.category)}/handle/${row.taskId}/${row.processInstanceId}/${row.businessId}`
-            })
-        },
-        handleDetail (row) {
-            this.$router.push({
-                path: `/propertySupervision/process/${flowRoute(this.flowRoutes, row.category)}/detail/${row.processInstanceId}/${row.businessId}`
-            })
-        },
-        handleImage (row) {
-            this.processInstanceId = row.processInstanceId
-            this.flowBox = true
-        },
-        currentChange (currentPage) {
-            this.page.currentPage = currentPage
-        },
-        sizeChange (pageSize) {
-            this.page.pageSize = pageSize
-        },
-        refreshChange () {
-            this.onLoad(this.page, this.query)
-        },
-        onLoad (page, params = {}) {
-            const query = {
-                ...this.query,
-                category: (params.category) ? flowCategory(params.category) : null
-            }
-            this.loading = true
-            todoList(page.currentPage, page.pageSize, Object.assign(params, query)).then(res => {
-                const data = {
-                    ...res.data.data,
-                    records: res.data.data.records.map(item => {
-                        return {
-                            ...item,
-                            'linkPhoneflag': false
-                        }
-                    })
-                }
-                this.page.total = data.total
-                this.data = data.records
-                this.loading = false
-                this.selectionClear()
-            })
+      searchReset() {
+        this.query = {}
+        this.onLoad(this.page)
+      },
+      searchChange(params, done) {
+        this.query = params
+        this.page.currentPage = 1
+        this.onLoad(this.page, params)
+        done()
+      },
+      selectionChange(list) {
+        this.selectionList = list
+      },
+      selectionClear() {
+        this.selectionList = []
+        this.$refs.crud.toggleSelection()
+      },
+      handleWork(row) {
+        this.$router.push({
+          path: `/propertySupervision/process/${flowRoute(this.flowRoutes, row.category)}/handle/${row.taskId}/${row.processInstanceId}/${row.businessId}`
+        })
+      },
+      handleDetail(row) {
+        this.$router.push({
+          path: `/propertySupervision/process/${flowRoute(this.flowRoutes, row.category)}/detail/${row.processInstanceId}/${row.businessId}`
+        })
+      },
+      handleImage(row) {
+        this.processInstanceId = row.processInstanceId
+        this.flowBox = true
+      },
+      currentChange(currentPage) {
+        this.page.currentPage = currentPage
+      },
+      sizeChange(pageSize) {
+        this.page.pageSize = pageSize
+      },
+      refreshChange() {
+        this.onLoad(this.page, this.query)
+      },
+      onLoad(page, params = {}) {
+        let query = {
+          ...this.query,
+          category: (params.category) ? flowCategory(params.category) : null
         }
-    }
-}
-</script>
-  
-  
-<style lang="scss" scoped>
-.avue-upload__icon {
-    line-height: 6;
-}
+        const {
+          dateTime
+        } = query
 
-.tab-list {
+        if (dateTime) {
+          query = {
+            startTimes: dateTime[0],
+            endTimes: dateTime[1],
+          }
+        }
+        this.loading = true
+        todoList(page.currentPage, page.pageSize, Object.assign(params, query)).then(res => {
+          const data = {
+            ...res.data.data,
+            records: res.data.data.records.map(item => {
+              return {
+                ...item,
+                'linkPhoneflag': false
+              }
+            })
+          }
+          this.page.total = data.total
+          this.data = data.records
+          this.loading = false
+          this.selectionClear()
+        })
+      }
+    }
+  }
+</script>
+
+
+<style lang="scss" scoped>
+  .avue-upload__icon {
+    line-height: 6;
+  }
+
+  .tab-list {
     display: flex;
     margin-right: 6px;
     border: 1px solid #dcdfe6;
@@ -272,55 +318,55 @@
     width: 121px;
 
     &>div {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        width: 60px;
-        cursor: pointer;
-        font-size: 12px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 60px;
+      cursor: pointer;
+      font-size: 12px;
     }
 
     &>div:nth-child(2) {
-        border-left: 1px solid #dcdfe6;
-        // border-right: 1px solid #dcdfe6;
+      border-left: 1px solid #dcdfe6;
+      // border-right: 1px solid #dcdfe6;
     }
 
     .choose {
-        color: #FFF;
-        background-color: #409dfe;
+      color: #FFF;
+      background-color: #409dfe;
     }
-}
+  }
 
-:deep(.avue-crud__left) {
+  :deep(.avue-crud__left) {
     display: flex;
     align-items: center;
-}
+  }
 
-:deep(.el-drawer__header) {
+  :deep(.el-drawer__header) {
     margin-bottom: 10px;
-}
+  }
 
-:deep(.el-radio__input.is-disabled+span.el-radio__label) {
+  :deep(.el-radio__input.is-disabled+span.el-radio__label) {
     color: #000;
-}
+  }
 
-:deep(.el-radio__input.is-checked+.el-radio__label) {
+  :deep(.el-radio__input.is-checked+.el-radio__label) {
     color: #409EFF !important;
-}
+  }
 
-:deep(.el-radio__input.is-checked .el-radio__inner::after) {
+  :deep(.el-radio__input.is-checked .el-radio__inner::after) {
     background-color: #FFF;
-}
+  }
 
-:deep(.el-radio__input.is-checked .el-radio__inner) {
+  :deep(.el-radio__input.is-checked .el-radio__inner) {
     background-color: #409EFF;
-}
+  }
 
-:deep(.el-radio) {
+  :deep(.el-radio) {
     margin-right: 20px;
-}
+  }
 
-.title {
+  .title {
     margin: 10px;
     height: 40px;
     background-color: #eee;
@@ -328,119 +374,119 @@
     align-items: center;
 
     .icon {
-        width: 4px;
-        height: 18px;
-        background-color: #409dfe;
-        margin: 0 10px;
-        color: transparent;
+      width: 4px;
+      height: 18px;
+      background-color: #409dfe;
+      margin: 0 10px;
+      color: transparent;
     }
-}
+  }
 
-.basic-info {
+  .basic-info {
     padding: 0 20px;
     font-size: 14px;
 
     .info-item {
+      display: flex;
+      padding: 10px;
+
+      .info-name {
+        width: 100px;
         display: flex;
-        padding: 10px;
+        align-items: center;
+      }
 
-        .info-name {
-            width: 100px;
-            display: flex;
-            align-items: center;
-        }
-
-        .info-value {
-            display: flex;
-            align-items: center;
-        }
+      .info-value {
+        display: flex;
+        align-items: center;
+      }
     }
-}
+  }
 
-.question-list {
+  .question-list {
     padding: 0 20px;
     font-size: 14px;
 
     .question-type {
-        height: 60px;
-        display: flex;
-        align-items: center;
-        cursor: pointer;
-        justify-content: space-between;
-        padding-right: 20px;
+      height: 60px;
+      display: flex;
+      align-items: center;
+      cursor: pointer;
+      justify-content: space-between;
+      padding-right: 20px;
 
-        .type-name {}
+      .type-name {}
 
-        .icon-box {}
+      .icon-box {}
     }
 
     .question-item {
-        margin-bottom: 20px;
-        padding: 10px;
-        background: #f5f7fa;
-        border-radius: 8px;
+      margin-bottom: 20px;
+      padding: 10px;
+      background: #f5f7fa;
+      border-radius: 8px;
 
-        &>div {
-            margin: 14px 0;
+      &>div {
+        margin: 14px 0;
+      }
+
+      .question-name {
+        display: flex;
+
+        .key {
+          width: 80%;
+          padding-right: 20px;
+          word-break: break-all;
         }
 
-        .question-name {
-            display: flex;
+        .value {
+          width: 20%;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
+      }
 
-            .key {
-                width: 80%;
-                padding-right: 20px;
-                word-break: break-all;
-            }
+      .yh-pic-box {
+        display: flex;
+        height: 100px;
 
-            .value {
-                width: 20%;
-                display: flex;
-                align-items: center;
-                justify-content: center;
-            }
+        .yh-pic-name {
+          width: 100px;
+          display: flex;
+          align-items: center;
+          justify-content: left;
         }
 
-        .yh-pic-box {
-            display: flex;
-            height: 100px;
+        .yh-pic-list {
+          width: 0;
+          flex: 1;
+          display: flex;
+        }
+      }
 
-            .yh-pic-name {
-                width: 100px;
-                display: flex;
-                align-items: center;
-                justify-content: left;
-            }
+      .yh-remark {
+        display: flex;
 
-            .yh-pic-list {
-                width: 0;
-                flex: 1;
-                display: flex;
-            }
+        .yh-remark-name {
+          width: 100px;
+          display: flex;
+          align-items: center;
+          justify-content: left;
         }
 
-        .yh-remark {
-            display: flex;
-
-            .yh-remark-name {
-                width: 100px;
-                display: flex;
-                align-items: center;
-                justify-content: left;
-            }
-
-            .yh-remark-value {
-                word-break: break-all;
-            }
+        .yh-remark-value {
+          word-break: break-all;
         }
+      }
     }
 
     .remark-box {
-        padding: 10px;
-        background-color: #f5f7fa;
-        border-radius: 8px;
-        min-height: 40px;
-        margin-bottom: 20px;
+      padding: 10px;
+      background-color: #f5f7fa;
+      border-radius: 8px;
+      min-height: 40px;
+      margin-bottom: 20px;
     }
-}
+  }
 </style>
\ No newline at end of file

--
Gitblit v1.9.3