vue-insagent-pc/src/views/FinancialManagement/ReconciliationSystem/ReceivablePayableCollection/SettlementSource.vue

<template>
  <div>
    <div class="p-2">
      <el-form :inline="true" :model="pageRequest" size="small" label-width="120px">
        <el-row>
          <el-col :span="6">
            <el-form-item label="车牌号：">
              <el-input v-model="pageRequest.licenseno" placeholder="请输入车牌号" class="widths" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="险种">
              <el-input v-model="pageRequest.insuranceType" placeholder="请输入车牌号" class="widths" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="保险公司">
              <el-select v-model="pageRequest.insuranceId" filterable class="widths" clearable>
                <el-option v-for="val in companyList" :key="val.id" :label="val.name" :value="val.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="6">
            <el-form-item label="交强保单号：">
              <el-input v-model="pageRequest.jqPolicyId" placeholder="请输入交强保单号" class="widths" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="商业保单号：">
              <el-input v-model="pageRequest.syPolicyId" placeholder="请输入商业保单号" class="widths" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="非车保单号：">
              <el-input v-model="pageRequest.nonCarPolicyId" placeholder="请输入非车保单号" class="widths" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="6">
            <el-form-item label="渠道：">
              <el-input v-model="pageRequest.channel" placeholder="请输入渠道" class="widths" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="渠道等级：">
              <el-input v-model="pageRequest.channelClassification" placeholder="请输入渠道等级" class="widths"
                clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="被保险人：">
              <el-input v-model="pageRequest.insuredName" placeholder="请输入被保险人" class="widths" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="结算时间：">
              <el-date-picker v-model="agencySettlementTime" type="daterange" @change="agencySettlementTimeChange"
                start-placeholder="开始日期" end-placeholder="结束日期" class="widths" value-format="yyyy-MM-dd"
                style="width: 220px" clearable>
              </el-date-picker>
            </el-form-item>
          </el-col>

          <el-col :span="6">
            <el-form-item label="签单日期">
              <el-date-picker v-model="signDateTime" type="daterange" @change="signDateChange" start-placeholder="开始日期"
                end-placeholder="结束日期" class="widths" value-format="yyyy-MM-dd" style="width: 220px" clearable>
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="flex j-end" style="margin-right: 100px">
        <el-button type="danger" size="small" @click="templateDownload" style="margin-right: 20px">下载模板</el-button>
        <el-button type="primary" size="small" @click="Search" style="margin-right: 20px">查询</el-button>
        <el-upload class="upload-demo" :auto-upload="false" :on-change="writeOffUpload" action="###"
          :show-file-list="false">
          <el-button size="small" type="primary">数据导入</el-button>
        </el-upload>
      </div>
    </div>
    <el-main ref="elMain" style="padding: 0px">
      <kt-common-table :SerialShow="false" :operationWidth="150" :showOperation="true" permsDelete="sys:user:delete"
        :showBatchDelete="true" :showBatchSettled="true" :showBatchPrint="true" permsButton1="sys:user:edit"
        permsButton2="sys:user:edit" permsButton3="sys:user:edit" :data="pageResult" :columns="columns"
        @findPage="findPage" keyName="id" settledName="批量修改" @handleSettled="handleTableSettled"
        @handlePrint="handlePrint" @handleDelete="handleDelete" button1Name="修改" button1Background="#E6A23C"
        @handleButton1="sourceUpdate" button1Icon="">
      </kt-common-table>
    </el-main>
    <el-dialog title="信息修改" :visible.sync="dialogFormVisible" v-dialogDrag :close-on-click-modal="false" width="60%">
      <el-form :model="updateform" :inline="true" label-width="130px" size="small">
        <el-form-item label="渠道：">
          <el-input v-model="updateform.channel" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="车牌号：">
          <el-input v-model="updateform.licenseno" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="被保险人：">
          <el-input v-model="updateform.insuredName" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="险种：">
          <el-input v-model="updateform.insuranceType" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="业务归属：">
          <el-input v-model="updateform.businessOwner" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="交强保费：">
          <el-input v-model="updateform.jqPremiumTax" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="商业保费：">
          <el-input v-model="updateform.syPremiumTax" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="非车保费：">
          <el-input v-model="updateform.nonCarPremiumTax" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="交强应收比例：">
          <el-input v-model="updateform.compulsoryExportRatio" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="商业应收比例：">
          <el-input v-model="updateform.commercialExportRatio" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="非车应收比例：">
          <el-input v-model="updateform.nonVehicleExportRatio" autocomplete="off" class="widths"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="dialogFormVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="updateSubmit">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog title="批量修改" :visible.sync="dialogUpdateVisible" v-dialogDrag :close-on-click-modal="false" width="60%">
      <el-form :model="batchSizeForm" :inline="true" label-width="130px" size="small">
        <el-form-item label="业务归属：">
          <el-input v-model="batchSizeForm.businessOwner" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="交强出口比例：">
          <el-input v-model="batchSizeForm.compulsoryExportRatio" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="商业出口比例：">
          <el-input v-model="batchSizeForm.commercialExportRatio" autocomplete="off" class="widths"></el-input>
        </el-form-item>
        <el-form-item label="非车出口比例：">
          <el-input v-model="batchSizeForm.nonVehicleExportRatio" autocomplete="off" class="widths"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="dialogUpdateVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="BulkUpdate">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import KtCommonTable from "@/views/Core/KtCommonTable.vue"; //表格组件
import KtButton from "@/views/Core/KtButton";
import CommonUtil from "@/utils/comutil.js";
export default {
  components: {
    KtCommonTable,
    KtButton,
  },
  data() {
    return {
      signDateTime: [],
      agencySettlementTime: [],
      pageRequest: {
        //查询的默认条件
        pageNum: 1,
        pageSize: 20,
        licenseno: "",
        insuranceType: "",
        insuranceId: "",
        signDate: "",
        jqPolicyId: "",
        syPolicyId: "",
        nonCarPolicyId: "",
        channel: "",
        channelClassification: "",
        insuredName: "",
        agencySettlementTime: "",
      },
      // 右侧列表查询数据Start
      dialogFormVisible: false,
      dialogUpdateVisible: false,
      pageResult: [],
      updateform: {
        channel: "",
        licenseno: "",
        insuredName: "",
        insuranceType: "",
        businessOwner: "",
        jqPremiumTax: "",
        syPremiumTax: "",
        nonCarPremiumTax: "",
        compulsoryExportRatio: "",
        commercialExportRatio: "",
        nonVehicleExportRatio: "",
      },
      batchSizeForm: {
        businessOwner: "",
        compulsoryExportRatio: "",
        commercialExportRatio: "",
        nonVehicleExportRatio: "",
      },
      batchSizeList: [],
      columns: [
        //数据列
        { prop: "id", label: " 编号", minWidth: 160 },
        { prop: "operationsTeam", label: "运营小组", minWidth: 100 },
        { prop: "channelClassification", label: "渠道分级", minWidth: 100 },
        { prop: "channel", label: "渠道", minWidth: 120 },
        { prop: "employeeId", label: "工号", minWidth: 160 },
        { prop: "signDate", label: "签单日期", minWidth: 160 },
        { prop: "licenseno", label: "车牌号", minWidth: 160 },
        { prop: "insuredName", label: "被保险人", minWidth: 100 },
        { prop: "insuranceCompany", label: "保险公司", minWidth: 120 },
        { prop: "insuranceType", label: "险种", minWidth: 120 },
        { prop: "businessOwner", label: "业务归属", minWidth: 120 },
        {
          prop: "jqPolicyId",
          label: "交强保单号",
          minWidth: 180,
        },
        { prop: "syPolicyId", label: "商业保单号", minWidth: 180 },
        { prop: "nonCarPolicyId", label: "非车保单号", minWidth: 180 },
        { prop: "jqPremiumTax", label: "交强保费", minWidth: 140 },
        { prop: "vehicleTax", label: "车船税", minWidth: 140 },
        { prop: "syPremiumTax", label: "商业保费", minWidth: 140 },
        { prop: "nonCarPremiumTax", label: "非车保费", minWidth: 140 },
        { prop: "compulsoryExportRatio", label: "交强出口比例", minWidth: 140 },
        { prop: "commercialExportRatio", label: "商业出口比例", minWidth: 140 },
        { prop: "nonVehicleExportRatio", label: "非车出口比例", minWidth: 140 },
        { prop: "subsidyRatio", label: "补贴比例", minWidth: 140 },
        { prop: "subsidyAmount", label: "补贴金额", minWidth: 140 },
        { prop: "settlementAmount", label: "结算金额", minWidth: 140 },
        { prop: "agencySettlementTime", label: "代理结算时间", minWidth: 160 },
      ],
      companyList: [],
    };
  },
  created() {
    this.companyInt();
  },
  mounted() { },
  methods: {
    //模板下载
    templateDownload() {
      this.$api.task.settlementTemplate().then((res) => {
        if (res.code == '200') {
          let url = process.env.BASE_URL + res.data;
          let a = document.createElement("a");
          a.href = url;
          a.click();
          window.URL.revokeObjectURL(url);
        } else {
          this.$message({
            type: 'error',
            message: res.msg,
          });
        }
      });
    },
    signDateChange(e) {
      if (e == null) {
        this.pageRequest.signDate = "";
      } else {
        this.pageRequest.signDate = e.toString();
      }
    },
    agencySettlementTimeChange(e) {
      if (e == null) {
        this.pageRequest.agencySettlementTime = "";
      } else {
        this.pageRequest.agencySettlementTime = e.toString();
      }
    },
    //保险公司查询
    companyInt() {
      this.$api.letter.gainTopList().then((res) => {
        this.companyList = res.data;
      });
    },
    //附件上传
    writeOffUpload(file) {
      var file = file.raw;
      const params = new FormData(); // 声明formData数据类型
      params.append("multipartFile", file);
      params.append("type", "settle");
      this.$api.letter.uploadFile(params).then((res) => {
        if (res.code == "200") {
          let url = process.env.BASE_URL + res.data.url;
          this.$api.task.settlementExcel(url).then((res) => {
            if (res.code == "200") {
              this.$message({
                type: "success",
                message: res.msg,
              });
              this.findPage();
              this.isVisibleexecuteMethod();
            } else {
              this.$message({
                type: "error",
                message: res.msg,
              });
            }
          });
        }
      });
    },
    //是否匹配
    isVisibleexecuteMethod() {
      this.$api.task.isVisibledataMatching().then((res) => {
        if (res.data) {
          this.$alert(res.msg, "匹配提示", {
            confirmButtonText: "关闭",
            callback: (action) => { },
          });
        } else {
        }
      });
    },
    handleTableSettled(ids) {
      this.batchSizeList = ids;
      Object.keys(this.batchSizeForm).forEach((key) => {
        this.batchSizeForm[key] = "";
      });
      this.dialogUpdateVisible = true;
    },
    handleDelete(ids) {
      this.$confirm("此操作将永久删除, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$api.task.SettlementDeletes(ids).then((res) => {
            if (res.code == "200") {
              this.$message({
                type: "success",
                message: "删除成功!",
              });
              this.findPage();
            } else {
              this.$message({
                type: "error",
                message: res.msg,
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    BulkUpdate() {
      let params = {
        ids: this.batchSizeList,
        businessOwner: this.batchSizeForm.businessOwner,
        compulsoryExportRatio: this.batchSizeForm.compulsoryExportRatio,
        commercialExportRatio: this.batchSizeForm.commercialExportRatio,
        nonVehicleExportRatio: this.batchSizeForm.nonVehicleExportRatio,
      };
      this.$api.task.SettlementUpdates(params).then((res) => {
        if (res.code == "200") {
          this.$message({
            type: "success",
            message: "修改成功!",
          });
          this.dialogUpdateVisible = false;
          this.findPage();
        } else {
          this.$message({
            type: "error",
            message: res.msg,
          });
        }
      });
    },
    sourceUpdate({ row, column }) {
      this.dialogFormVisible = true;
      this.updateform = row;
    },
    Search() {
      this.findPage();
    },
    updateSubmit() {
      this.$api.task.settlementUpdate(this.updateform).then((res) => {
        if (res.code == "200") {
          this.$message({
            type: "success",
            message: res.msg,
          });
          this.dialogFormVisible = false;
          this.findPage();
        } else {
          this.$message({
            type: "error",
            message: res.msg,
          });
        }
      });
    },

    handlePrint() {
      this.$api.task.SettlementExport(this.pageRequest).then((res) => {
        let url = process.env.BASE_URL + res.msg;
        // 4.创建url之后可以模拟对此文件对象的一系列操作，例如：预览、下载
        let a = document.createElement("a");
        a.href = url;
        a.download = "结算来源表.xlsx";
        a.click();
        // 5.释放这个临时的对象url
        window.URL.revokeObjectURL(url);
      });
    },
    //联级选择器触发事件
    handleChange(val) {
      if (val.length !== 0) {
        this.pageRequest.deptId = val.at(-1);
      } else {
        this.pageRequest.deptId = "";
      }
    },
    //-- formatter begin--
    agreetypeFormatter(row, column) {
      //协议类型
      let agreetype = row.agreetype;
      return CommonUtil.getDataName({
        dataList: this.agreementtypeoptions,
        value: "value",
        label: "label",
        data: agreetype,
      });
    },
    inscompanyFormatter(row, column) {
      //协议类型
      let inscompany = row.inscompany;
      return CommonUtil.getDataName({
        dataList: this.global.insCompanyList,
        value: "code",
        label: "name",
        data: inscompany,
      });
    },
    timeFormatter(row, column) {
      let time = this.transformTime(row.createTime);
      return time;
    },
    totalmoenyFormatter(row, column) {
      //协议类型
      let inscompany = row.inscompany;
      return (row.feeamount + row.disamount).toFixed(2);
    },
    //点击查询按钮
    //--数据字典 begin --
    getDictItems: function (typeName) {
      let that = this;
      that.$api.dict
        .findByLableName(typeName)
        .then(function (res) {
          that[typeName + "options"] = res.data; // 把获取到的数据赋给this.data
        })
        .catch(function (error) {
          that[typeName + "options"] = [];
        });
    },
    //--数据字典 end --
    // 右侧列表的方法Start
    findPage(data) {
      // 获取分页数据
      let that = this;
      if (data && data.pageRequest) {
        this.pageRequest.pageNum = data.pageRequest.pageNum;
        this.pageRequest.pageSize = data.pageRequest.pageSize;
      }
      that.$api.task
        .settlementExcelpage(that.pageRequest)
        .then((res) => {
          that.pageResult = res.data;
        })
        .then(data != null ? data.callback : "");
    },
  },
};
</script>
<style lang="scss" scoped>
.widths {
  width: 220px;
}
</style>