马宇豪
2025-01-10 03f0e2a3220106ec2a9dd8f53d3ef5ab824c3ae7
src/views/specialCheck/components/wholesaleForm.vue
@@ -2,14 +2,18 @@
    <div class="table">
        <div class="filter-container">
            <div class="table-tit">
                <h2>2023年上半年烟花爆竹生产经营安全检查(批发)</h2>
                <h2 v-show="enterpriseType == 1">{{taskName}}(批发)</h2>
                <h2 v-show="enterpriseType == 2">{{taskName}}(零售)</h2>
                <span>(检查一家反馈一家,没有检查出隐患问题的也要登记反馈)</span>
            </div>
            <div class="control-bar">
                <div>
                    批发企业共计<span>17</span>家,其中:已自查<span>15</span>家,未自查<span class="undone">2</span>家;本级已经抽查<span>5</span>家,未检查<span class="undone">12</span>家,完成率<span>100%</span>。
                <div v-show="enterpriseType == 1">
                    批发企业共计<span class="point-data" @click="resetSearch()">{{enterpriseCount}}</span>家,其中:已自查<span class="point-data" @click="toSelfEnterprise(1)">{{ selfCheckEnterpriseCount }}</span>家,未自查<span @click="toSelfEnterprise(0)" class="undone point-data">{{ noSelfCheckEnterpriseCount }}</span>家;本级已经抽查<span class="point-data" @click="toLevelEnterprise(1)">{{ thislevelAlreadyCheckCount }}</span>家,未检查<span @click="toLevelEnterprise(0)" class="undone point-data">{{ thislevelNoCheckCount }}</span>家,检查覆盖要求<span class="undone">{{ thislevelCompletionRateRequire }}{{thislevelCompletionRateRequireUnit ==1?'家':'%'}}</span>,完成率<span>{{ thislevelCompletionRate == null?'--':thislevelCompletionRate + '%' }}</span>。
                </div>
                <el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-search" @click="showFilter = !showFilter">{{showFilter?'关闭查询':'自定义查询'}}</el-button>
                <div v-show="enterpriseType == 2">
                    零售企业共计<span class="point-data" @click="resetSearch()">{{enterpriseCount}}</span>家,其中:已自查<span class="point-data" @click="toSelfEnterprise(1)">{{ selfCheckEnterpriseCount }}</span>家,未自查<span @click="toSelfEnterprise(0)" class="undone point-data">{{ noSelfCheckEnterpriseCount }}</span>家;本级已经抽查<span class="point-data" @click="toLevelEnterprise(1)">{{ thislevelAlreadyCheckCount }}</span>家,未检查<span @click="toLevelEnterprise(0)" class="undone point-data">{{ thislevelNoCheckCount }}</span>家,检查覆盖要求<span class="undone">{{ thislevelCompletionRateRequire }}{{thislevelCompletionRateRequireUnit ==1?'家':'%'}}</span>,完成率<span>{{ thislevelCompletionRate == null?'--':thislevelCompletionRate + '%' }}</span>。
                </div>
                <el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-search" @click="openSearch()">{{showFilter?'关闭查询':'自定义查询'}}</el-button>
            </div>
            <transition name="el-zoom-in-top">
                <el-row v-show="showFilter" :gutter="20">
@@ -22,21 +26,21 @@
                        <el-cascader
                            :options="options"
                            v-model="selectedOptions"
                            :props="{ checkStrictly: true,expandTrigger: 'hover'}"
                            :props="{ checkStrictly: true,expandTrigger: 'hover',value: 'label'}"
                            separator="-"
                            @change="locationChange">
                        </el-cascader>
                    </el-col>
                    <el-col :span="6">
                        <span>自查是否有隐患:</span>
                        <el-radio-group v-model="search.isRisky">
                        <el-radio-group v-model="search.isRisky" @input="changeRadio()">
                            <el-radio :label="1">是</el-radio>
                            <el-radio :label="2">否</el-radio>
                            <el-radio :label="0">否</el-radio>
                        </el-radio-group>
                    </el-col>
                    <el-col :span="4">
                        <el-button  style="margin-right: 10px;" type="primary">查询</el-button>
                        <el-button class="resetBtn"  type="primary" plain>重置</el-button>
                        <el-button style="margin-right: 10px;" type="primary" @click="searchData()">查询</el-button>
                        <el-button class="resetBtn" plain @click="resetSearch()">重置</el-button>
                    </el-col>
                </el-row>
            </transition>
@@ -53,51 +57,37 @@
            >
                <el-table-column type="index" label="序号" align="center" width="80"/>
                <el-table-column label="单位名称" prop="owner" align="center" width="180">
                <el-table-column label="单位名称" prop="enterpriseName" align="center" width="180"></el-table-column>
                <el-table-column label="联系电话" prop="enterpriseOfficephone" align="center"></el-table-column>
                <el-table-column label="填报时库存数量/箱" prop="stockNum" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.owner }}</span>
                        <span>{{ scope.row.stockNum == null ? '--' : scope.row.stockNum }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="联系电话" prop="phone" align="center">
                <el-table-column label="是否查出隐患" prop="hiddendangerStatus" align="center">
                    <template slot-scope="scope">
                        <span>{{scope.row.phone}}</span>
                        <span>{{ scope.row.hiddendangerStatus == 1 ? '是' : '否' }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="库存数量/万箱" prop="stock" align="center">
                <el-table-column label="自查填报时间" prop="selfcheckReportTime" width="130" align="center" sortable></el-table-column>
                <el-table-column label="填报状态" prop="selfcheckStatus" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.stock }}</span>
                        <span>{{ scope.row.selfcheckStatus == 1 ? '已填报' : '未填报' }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="是否查出隐患" prop="isRisk" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.isRisk == 0 ? '否' : '是' }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="自查填报时间" prop="selfCheckTime" width="130" align="center" sortable>
                    <template slot-scope="scope">
                        <span>{{ scope.row.selfCheckTime }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="填报状态" prop="fillStatus" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.fillStatus == 0 ? '未填报' : '已填报' }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="详情" align="center" class-name="small-padding fixed-width">
                <el-table-column label="自查详情" align="center" class-name="small-padding fixed-width">
                    <template slot-scope="scope">
                        <el-button type="text" @click="viewDetails(scope.row)">查看</el-button>
                    </template>
                </el-table-column>
                <el-table-column label="反馈状态" prop="feedback" align="center">
                <el-table-column label="反馈状态" prop="thislevelCheckStatus" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.feedback == 0 ? '未反馈' : '已反馈' }}</span>
                        <span>{{ scope.row.thislevelCheckStatus == 1 ? '已反馈' : '未反馈' }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="执法抽查" align="center" class-name="small-padding fixed-width">
                <el-table-column v-if="unitType!=0" fixed="right" :label="unitType==1?'执法抽查':'执法检查'" align="center" class-name="small-padding fixed-width">
                    <template slot-scope="scope">
                        <el-button type="text" @click="toFeedback(scope.row)">情况反馈</el-button>
                        <el-button  type="text" @click="toFeedback(scope.row)">情况反馈</el-button>
                    </template>
                </el-table-column>
            </el-table>
@@ -106,74 +96,74 @@
            <el-pagination
                v-show="recordTotal>0"
                :current-page="currentPage"
                :page-sizes="[10, 20, 30, 50]"
                :page-sizes="[10, 15]"
                :page-size="pageSize"
                :total="recordTotal"
                layout="total, sizes, prev, pager, next, jumper"
                background
                style="float:right;margin:3px"
                style="float:right;margin:20px 0 0"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
            />
        </div>
        <report-details ref="report"></report-details>
        <check-details ref="report"></check-details>
        <feedback-details ref="feedback"></feedback-details>
    </div>
</template>
<script>
import {mapGetters} from "vuex";
import Cookies from "_js-cookie@2.2.0@js-cookie";
import {paramList} from "../../../api/contract";
import {computePageCount} from "../../../utils";
import {parseError} from "../../../utils/messageDialog";
import ReportDetails from "./reportDetails";
import checkDetails from "../../selfCheck/components/checkDetails"
import feedbackDetails from "./feedbackDetails";
import { regionData } from 'element-china-area-data'
import { getCheckUnitType, getEnterpriseCompleteInfoList, getSpecialCheckTask } from "@/api/specialCheck"
export default {
name: "wholesaleForm",
    components: {ReportDetails,feedbackDetails},
    components: {checkDetails,feedbackDetails},
    data(){
        return{
            recordTotal: 0,
            pageSize: 10,
            pageTotal: 0,
            currentPage: 1,
            unitType: null,
            taskId: null,
            taskName: '',
            enterpriseType: null,
            selfcheckStatus: null,
            thislevelCheckStatus: null,
            listLoading: false,
            showFilter: false,
            search:{
                name: '',
                location: '',
                isRisky: ''
                name: null,
                province: null,
                city: null,
                area: null,
                isRisky: null
            },
            tableKey: 0,
            options: regionData,
            selectedOptions: [],
            checkData: [
                {
                    owner: '单位一',
                    phone: '88888888',
                    stock: 266,
                    isRisk: 0,
                    selfCheckTime: '2022-10-27 15:16:00',
                    fillStatus: 1,
                    feedback: 0,
                },
                {
                    owner: '单位二',
                    phone: '66666666',
                    stock: 288,
                    isRisk: 1,
                    selfCheckTime: '2022-10-27 15:16:00',
                    fillStatus: 0,
                    feedback: 1,
                }
            ]
            enterpriseCount: null,
            selfCheckEnterpriseCount: null,
            noSelfCheckEnterpriseCount: null,
            thislevelAlreadyCheckCount: null,
            thislevelCompletionRateRequire: null,
            thislevelCompletionRateRequireUnit: null,
            thislevelNoCheckCount: null,
            thislevelCompletionRate: null,
            checkData: []
        }
    },
    created() {
        // this.getDataList();
        const t = this
        t.getCheckUnitType()
        t.getCheckTask()
    },
    computed: {
        ...mapGetters([
@@ -182,63 +172,142 @@
        ])
    },
    methods:{
        // getDataList() {
            // const t = this;
            // const params = {};
            // params['pageIndex'] = t.currentPage;
            // params['pageSize'] = t.pageSize;
            // params['sort'] = t.sort;
            // params['order'] = t.order;
            // const userName = Cookies.get('userName');
            // const name = Cookies.get('name');
            // params['operator'] = name + '(' + userName + ')';
            // for (const i in t.queryForm) {
            //     if (t.queryForm[i] != undefined && t.queryForm[i].toString() != '') {
            //         params[i] = t.queryForm[i]
            //     }
            // }
            // t.listLoading = true
            // paramList(params).then(response => {
            //     const res = response.data;
            //     if (res.code === "200") {
            //         const result = res.result;
            //         t.recordTotal = result.totalCount;
            //         t.pageSize = result.pageSize;
            //         t.pageTotal = computePageCount(result.totalCount, result.pageSize);
            //         t.currentPage = result.pageIndex;
            //         t.checkData = result.result
            //     } else {
            //         parseError({error: res.message, vm: t})
            //     }
            //     t.listLoading = false
            // }).catch(error => {
            //     t.listLoading = false
            //     parseError({error: error, vm: t})
            // })
        // },
        async getCheckUnitType(){
            const t = this
            let res = await getCheckUnitType()
            if(res.data.code === "200"){
                t.unitType = res.data.result.checkUnitType
            }else{
                t.$message({
                    type:'warning',
                    message:res.data.message
                })
            }
        },
        async getCheckTask(){
            const t = this
            t.listLoading = true
            const res = await getSpecialCheckTask()
            if(res.data.code === "200"){
                t.taskId = res.data.result.specialCheckTaskSimplifyInfos[0].id
                t.taskName = res.data.result.specialCheckTaskSimplifyInfos[0].taskName
                t.enterpriseType = 1
                t.getEnterpriseCompleteInfoList()
            }else{
                t.$message({
                    type:'warning',
                    message:res.data.message
                })
            }
            t.listLoading = false
        },
        async getEnterpriseCompleteInfoList(){
            const t = this
            t.listLoading = true
            if(t.search.name == ''){t.search.name = null}
            let data = {pageIndex: t.currentPage,pageSize: t.pageSize,taskId: t.taskId,enterpriseType: t.enterpriseType,selfcheckStatus:t.selfcheckStatus,thislevelCheckStatus: t.thislevelCheckStatus,enterpriseName: t.search.name, enterpriseProvince: t.search.province, enterpriseCity: t.search.city, enterpriseArea: t.search.area, hiddendangerStatus: t.search.isRisky}
            let res = await getEnterpriseCompleteInfoList(data)
            if(res.data.code === "200"){
                t.enterpriseCount = res.data.result.enterpriseCount
                t.selfCheckEnterpriseCount = res.data.result.selfCheckEnterpriseCount
                t.noSelfCheckEnterpriseCount = res.data.result.noSelfCheckEnterpriseCount
                t.thislevelAlreadyCheckCount = res.data.result.thislevelAlreadyCheckCount
                t.thislevelNoCheckCount = res.data.result.thislevelNoCheckCount
                t.thislevelCompletionRateRequire = res.data.result.thislevelCompletionRateRequire
                t.thislevelCompletionRateRequireUnit = res.data.result.thislevelCompletionRateRequireUnit
                t.thislevelCompletionRate = res.data.result.thislevelCompletionRate
                t.checkData = res.data.result.iPage.records
                t.recordTotal = res.data.result.iPage.total
            }else{
                t.$message({
                    type:'warning',
                    message:res.data.message
                })
            }
            t.listLoading = false
        },
        openSearch(){
            const t = this
            t.showFilter = !t.showFilter
            if(t.showFilter == false){
                t.resetSearch()
            }
        },
        handleSizeChange: function (val) {
            this.pageSize = val
            this.currentPage = 1
            // this.getDataList()
            this.getEnterpriseCompleteInfoList()
        },
        handleCurrentChange: function (val) {
            this.currentPage = val
            // this.getDataList()
            this.getEnterpriseCompleteInfoList()
        },
        locationChange(value) {
            console.log(value)
            const t = this
            t.selfcheckStatus = null
            t.thislevelCheckStatus = null
            t.search.province = value[0]
            t.search.city = value[1] ? value[1] : null
            t.search.area = value[2] ? value[2] : null
            t.getEnterpriseCompleteInfoList()
        },
        viewDetails(row){
            console.log(row)
        changeRadio(){
            const t = this
            t.selfcheckStatus = null
            t.thislevelCheckStatus = null
            t.getEnterpriseCompleteInfoList()
        },
        searchData(){
            this.getEnterpriseCompleteInfoList()
        },
        resetSearch(){
            const t = this
            t.selfcheckStatus = null
            t.thislevelCheckStatus = null
            t.search = {
                name: null,
                province: null,
                city: null,
                area: null,
                isRisky: null
            }
            t.selectedOptions = []
            t.getEnterpriseCompleteInfoList()
        },
        toSelfEnterprise(value){
            const t = this
            t.thislevelCheckStatus = null
            t.selfcheckStatus = value
            t.getEnterpriseCompleteInfoList()
        },
        toLevelEnterprise(value){
            const t = this
            t.thislevelCheckStatus = value
            t.selfcheckStatus = null
            t.getEnterpriseCompleteInfoList()
        },
        viewDetails(row){
            const t = this
            t.$refs.report.id = row.id
            t.$refs.report.getEnterpriseInfo()
            t.$refs.report.enterpriseType = t.enterpriseType
            t.$refs.report.dialogVisible = true
        },
        toFeedback(row){
            console.log(row)
            const t = this
            t.$refs.feedback.corpInfo = row
            t.$refs.feedback.id = row.id
            t.$refs.feedback.feedbackForm.id = row.id
            t.$refs.feedback.getSpotCheckReportInfo()
            t.$refs.feedback.unitType = t.unitType
            t.$refs.feedback.enterpriseType = t.enterpriseType
            t.$refs.feedback.getSpotCheckReportInfo()
            t.$refs.feedback.dialogVisible = true
        }
    }
@@ -279,6 +348,14 @@
                    .undone{
                        color: #ff0000;
                    }
                    .point-data{
                        cursor: pointer;
                        &:hover{
                            text-decoration: underline;
                        }
                    }
                }
                .filter-item{
                    margin-bottom: 0;
@@ -298,8 +375,7 @@
                        width: 100%;
                    }
                    .resetBtn{
                        color: #034EA2;
                        background-color: #ecf5ff;
                        color: #fff;
                    }
                }
            }