ludc
2023-10-31 608ba76865266795b4b43bc7d9c8ab68ac0bb83d
Source/UBCS-WEB/src/views/integration/applicationForm.vue
@@ -1,11 +1,11 @@
<template>
    <basic-container>
        <avue-crud :table-loading="loading" :data="data" :option="option" :search.sync="searchParam" :page.sync="page"
        <avue-crud :table-loading="loading" :data="data" :option="option" :search.sync="searchParam" :page.sync="page" :permission="permissionList"
            ref="crud" @refresh-change="getDataList" @search-change="handleSearch" @search-reset="handleReset"
            @size-change="handleSizePage" @current-change="handleCurrentPage" @on-load="getDataList"
            @selection-change="selectionChange" @row-click="handleRowClick">
            <template slot="menuLeft">
                <el-button icon="el-icon-document" size="small" type="primary" @click="handleStatus">集团申请状态
                <el-button icon="el-icon-document" size="small" type="primary" @click="handleStatus" v-if="permissionList.status">集团申请状态
                </el-button>
            </template>
        </avue-crud>
@@ -15,6 +15,7 @@
<script>
import { getList, queryApplyStat } from '@/api/integration/application.js'
import { dateFormat } from '@/util/date.js'
import {mapGetters} from 'vuex'
export default {
    data() {
        return {
@@ -27,77 +28,92 @@
            },
            searchParam: {},
            stateParam: {},
            option: {
                height: "auto",
                index: true,
                border: true,
                addBtn: false,
                columnBtn: false,
                searchMenuSpan: 8,
                highlightCurrentRow: true,
                menu: false,
                selection: true,
                column: [
                    {
                        label: '申请单号',
                        prop: 'id',
                        width: 300,
                        fixed: true,
                        search: true,
                    }, {
                        label: '集团码',
                        width: 200,
                        prop: 'groupCode',
                        search: true,
                    }, {
                        label: '操作类型',
                        width: 200,
                        prop: 'operationType',
                        type: 'select',
                        search: true,
                        dicData: [{
                            label: '申请',
                            value: 1
                        }, {
                            label: '更改',
                            value: 2
                        }]
                    }, {
                        label: '申请单数据信息',
                        width: 300,
                        prop: 'description'
                    },
                    {
                        label: '创建时间',
                        width: 200,
                        prop: 'createTime',
                        type: 'datetime',
                        search: true,
                    },
                    {
                        label: '更改时间',
                        width: 200,
                        prop: 'lastModifyTime',
                        type: 'datetime',
                        search: true,
                    }, {
                        label: '返回标识',
                        width: 100,
                        prop: 'code'
                    },
                    {
                        label: '返回信息',
                        width: 300,
                        prop: 'content'
                    },
                    {
                        label: '消息信息',
                        width: 300,
                        prop: 'msg'
                    }
                ]
            }
        }
    },
    computed:{
      ...mapGetters(["permission"]),
      permissionList(){
        return{
          searchBtn:this.vaildData(this.permission.applicationForm.applicationForm_search,false),
          emptyBtn:this.vaildData(this.permission.applicationForm.applicationForm_search,false),
          status:this.vaildData(this.permission.applicationForm.applicationForm_status,false)
        }
      },
      option(){
        return{
            height: "auto",
            tip:false,
            index: true,
            border: true,
            addBtn: false,
            columnBtn: false,
            searchBtn:this.permissionList.searchBtn,
            emptyBtn:this.permissionList.emptyBtn,
            searchMenuSpan: 8,
            highlightCurrentRow: true,
            menu: false,
            selection: true,
            column: [
              {
                label: '申请单号',
                prop: 'id',
                width: 300,
                fixed: true,
                search: true,
              }, {
                label: '集团码',
                width: 200,
                prop: 'groupCode',
                search: true,
              }, {
                label: '操作类型',
                width: 200,
                prop: 'operationType',
                type: 'select',
                search: true,
                dicData: [{
                  label: '申请',
                  value: '1'
                }, {
                  label: '更改',
                  value: '2'
                }]
              }, {
                label: '申请单数据信息',
                width: 300,
                prop: 'description'
              },
              {
                label: '创建时间',
                width: 200,
                prop: 'createTime',
                type: 'datetime',
                search: true,
              },
              {
                label: '更改时间',
                width: 200,
                prop: 'lastModifyTime',
                type: 'datetime',
                search: true,
              }, {
                label: '返回标识',
                width: 100,
                prop: 'code'
              },
              {
                label: '返回信息',
                width: 300,
                prop: 'content'
              },
              {
                label: '消息信息',
                width: 300,
                prop: 'msg'
              }
            ]
        }
      }
    },
    methods: {
        async handleStatus() {
@@ -108,10 +124,10 @@
                    message: "请至少选择一条数据!"
                })
            } else {
                console.log(this.stateParam)
                // console.log(this.stateParam)
                const response = await queryApplyStat(this.stateParam)
                if (response.status === 200) {
                    console.log(response)
                    // console.log(response)
                }
            }
        },
@@ -119,15 +135,15 @@
            this.loading = true
            const { pageSize, currentPage, total } = this.page
            let param = { size: pageSize, current: currentPage }
            console.log(this.searchParam)
            // console.log(this.searchParam)
            this.searchParam = Object.keys(this.searchParam)
                .filter((key) => this.searchParam[key] !== null && this.searchParam[key] !== undefined && this.searchParam[key] !== "")
                .reduce((acc, key) => ({ ...acc, [key]: this.searchParam[key] }), {});
            console.log(this.searchParam)
            // console.log(this.searchParam)
            const response = await getList({ ...param, ...this.searchParam })
            if (response.status === 200) {
                this.loading = false
                console.log(response)
                // console.log(response)
                const data = response.data.data
                this.data = data.records
                this.page.total = data.total
@@ -144,7 +160,7 @@
            this.getDataList()
        },
        handleSearch(form, done) {
            console.log(form)
            // console.log(form)
            const { id, groupCode, operationType } = form
            let dataTime = { id, groupCode, operationType }
            if (form.hasOwnProperty('createTime')) {
@@ -159,17 +175,39 @@
            done()
        },
        selectionChange(list) {
            console.log(list)
            // console.log(list)
            let newData = list.map(item => {
                const { dataOid } = item
                return dataOid
            })
            this.stateParam = { oids: newData.toString() }
            console.log(newData)
            // console.log(newData)
        },
        handleRowClick(row) {
            this.$refs.crud.toggleRowSelection(row, true)
        },
    }
}
</script>
</script>
<style lang="scss" scoped>
//固定列高度
/deep/ .el-table__fixed {
  height: calc(100vh - 345px)!important;
}
// 滚动条样式修改
// 滚动条的宽度
/deep/ .el-table__body-wrapper::-webkit-scrollbar {
  height: 15px; // 纵向滚动条 必写
  background: white;
  border: white;
  width: 10px;
}
// 滚动条的滑块
/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
  background-color: #ececec;
  border-radius: 20px;
  border: #ececec;
}
</style>