<template>
    <div class="app-container">
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
            <el-form-item label="案件编号" prop="caseNum">
                <el-input v-model="queryParams.caseNum" placeholder="请输入案件编号" clearable @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="案件状态" prop="caseStatus">
                <el-select v-model="queryParams.caseStatus" placeholder="请选择案件状态" clearable
                    @keyup.enter.native="handleQuery">
                    <el-option v-for="dict in dict.type.case_status" :key="dict.value" :label="dict.label"
                        :value="dict.value"></el-option>
                </el-select>
            </el-form-item>
            <!-- <el-form-item label="开庭日期" prop="hearDate">
                <el-date-picker v-model="queryParams.hearDate" type="daterange" range-separator="至" start-placeholder="开始日期"
                    end-placeholder="结束日期">
                </el-date-picker>
            </el-form-item> -->
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>
        <el-table v-loading="loading" :data="dataList" style="width: 100%">
            <el-table-column label="序号" type="index" align="center">
                <template slot-scope="scope">
                    <span>{{
                        (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
                    }}</span>
                </template>
            </el-table-column>
            <el-table-column label="案件编号" align="center" prop="caseNum" :show-overflow-tooltip="true" />
            <el-table-column label="案件标的" align="center" prop="caseSubjectAmount" />
            <el-table-column label="开庭日期" align="center" prop="hearDate" :show-overflow-tooltip="true" />
            <!-- 缴费人 -->
            <!-- <el-table-column label="案件状态" align="center" prop="caseStatusName" /> -->
            <el-table-column label="案件状态" align="center" prop="caseStatusName">
              <template slot-scope="scope">
                <el-tag type="success">{{ scope.row.caseStatusName }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                <template slot-scope="scope">
                    <el-button size="mini" type="text" icon="el-icon-reading" v-if="scope.row.filearbitraUrl && scope.row.filearbitraUrl !== ''" @click="showModel(scope.row, 0)">查看裁决书</el-button>
                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 11 && checkPermi(['awardManagement:list:check'])" @click="showModel(scope.row, 1)"
                    >核查</el-button>
                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 12 && checkPermi(['awardManagement:list:confirmaward'])" @click="showModel(scope.row, 2)"
                    >确认裁决书</el-button>
                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 13 && checkPermi(['awardManagement:list:sign'])" @click="showModel(scope.row, 3)"
                    >签名</el-button>
                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 14 && checkPermi(['awardManagement:list:signprint'])" @click="showaffixModel(scope.row, 4)"
                    >用印申请</el-button>
                        <!-- v-if="scope.row.caseStatus > 15" -->
                    <el-button size="mini" type="text" icon="el-icon-truck" v-if="scope.row.caseStatus > 15 && checkPermi(['delivery:list:detail'])" @click="showDeliveryModel(scope.row, 4)">快递信息</el-button>
                        <!-- v-if="scope.row.caseStatus == 15"   送达裁决书 -->
                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 15 && checkPermi(['awardManagement:list:sendaward'])" @click="showMailaward(scope.row)"
                    >送达裁决书</el-button>
                    <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 16 && checkPermi(['awardManagement:list:file'])" @click="showCasefilingModel(scope.row, 6)"
                    >案件归档</el-button>
                </template>
            </el-table-column>
        </el-table>
        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
            @pagination="getList(queryParams)" />
        <!-- 弹窗 -->
        <paymentdetailsDialog :openDialog="openDialog" :detailform="detailform" :title="title" :flag="flag"
            @cancelpaymentdetails="cancelpaymentdetails" @updataList="updataList"></paymentdetailsDialog>
        <!-- 送达裁决书页面 -->
        <mailawardDialog 
        :openMailawardDialog="openMailawardDialog" 
        @closeMailaward="closeMailaward"
        @updataList="updataList"
        :mailawardata="mailawardata"
        ></mailawardDialog>
        <!-- 快递信息页面 -->
        <expressDeliveryDialog
        :showDelivery="showDelivery"
        :deliveryDataArr="deliveryDataArr"
        @closeDeliveryModel="closeDeliveryModel"
        :flagLoading="flagLoading"
        ></expressDeliveryDialog>
    </div>
</template>
  
<script>
import {
    caseApplicationList,
    caseApplicationDetail,
    adjudicationLogistics,
    adjudicationCaseFile,
    adjudicationStamp,
    selectSignUrl,
    selectSealUrl
} from "@/api/awardManagement/awardManagement";
import paymentdetailsDialog from "./components/paymentdetailsDialog.vue";
import mailawardDialog from './components/MailawardDialog.vue';
import expressDeliveryDialog from './components/expressDeliveryDialog.vue';

export default {
    name: "paymentList",
    dicts: ["case_status"],
    components: { paymentdetailsDialog, mailawardDialog, expressDeliveryDialog },
    data() {
        return {
            queryParams: {
                pageNum: 1,
                pageSize: 10,
            },
            // 遮罩层
            loading: false,
            // 总条数
            total: 0,
            // 表格数据
            list: [],

            // 弹出层标题
            title: "",
            payTitle: "",
            // 是否显示弹出层
            open: false,
            openPay: false,
            // 弹出层内容
            form: {},
            // 校验表单
            rules: {},
            dataList: [],
            detailform: {}, //缴费详情数据
            openDialog: false, //缴费详情数据弹框
            flag: null,
            openMailawardDialog: false,  //送达裁决书页面
            mailawardata: {},   //裁决书送达界面数据
            showDelivery: false, //快递信息弹框
            deliveryDataArr: [],//快递信息数据
            flagLoading: true,
        };
    },
    created() {
        // 裁决书列表不显示 生成裁决书
        // this.queryParams.caseStatusList = [10, 11, 12, 13, 14, 15, 16]
        this.queryParams.caseStatusList = [11, 12, 13, 14, 15, 16]
        this.getList(this.queryParams);
    },
    methods: {
        updataList() {
            this.getList(this.queryParams);
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList(this.queryParams);
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.handleQuery();
        },
        // 查询列表数据
        getList(parms) {
            this.loading = true;
            caseApplicationList(parms).then((response) => {
                this.dataList = response.rows;
                this.total = response.total;
                this.loading = false;
            });
        },
        // model框显示
        showModel(row, type) {

            switch (type) {
                case 0:
                    let url = row.filearbitraUrl;
                    window.open(url)
                    break;
                case 1:
                    this.getDetail({ id: row.id });
                    this.openDialog = true;
                    this.title = "核验裁决书";
                    this.flag = 1;
                    break;
                case 2:
                    this.getDetail({ id: row.id });
                    this.openDialog = true;
                    this.title = "审核裁决书";
                    this.flag = 2;
                    break;
                case 3:
                    // this.title = "裁决书签名";
                    // this.flag = 3;
                    selectSignUrl({ id: row.id }).then(res => {
                        let url = res.data.signUrl;
                        window.open(url)
                    })
                    break;
                default:
                    break;
            }
        },
        // 关闭弹窗
        cancelpaymentdetails() {
            this.openDialog = false;
        },
        // 用印申请
        showaffixModel(row) {
            this.$modal.confirm('是否进行用印申请？')
                .then(function () {
                    // return adjudicationStamp({ id: row.id });
                    selectSealUrl({ id: row.id }).then(res => {
                        let url = res.data.sealUrl;
                        window.open(url)
                    })
                })
                // .then(() => {
                //     this.getList(this.queryParams);
                //     this.$modal.msgSuccess("用印成功！");
                // })
                .catch(function () {
                });
        },
        // 快递信息弹框
        showDeliveryModel(row) {
            console.log(row, '快递');
            this.showDelivery = true
            this.getadjudicationLogistics({ id: row.id })
        },
        closeDeliveryModel() {
            this.showDelivery = false
        },
        // 查询物流信息
        getadjudicationLogistics(val) {
            this.flagLoading = true;
            adjudicationLogistics(val).then((res) => {
                this.deliveryDataArr = res.data
                this.flagLoading = false
            })
        },
        // 案件归档
        showCasefilingModel(row) {
            this.$modal.confirm('是否确认立即进行案件扫描？').then(
                function () {
                    return adjudicationCaseFile({ id: row.id })
                }
            ).then(() => {
                this.getList(this.queryParams);
                this.$modal.msgSuccess("归档成功！");
            }).catch(function () { })
        },
        // 送达裁决书弹框
        showMailaward(row) {
            this.mailawardata = row;
            this.openMailawardDialog = true
        },
        // 关闭送达裁决书弹框
        closeMailaward(row) {
            this.openMailawardDialog = false
        },
        /** 查询详情 */
        getDetail(parms) {
            caseApplicationDetail(parms).then((res) => {
                this.detailform = res.data;
            });
        },
    },
};
</script>
  
<style lang="scss" scoped></style>