<template>
  <basic-container>
    <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" :permission="permissionList"
               :before-open="beforeOpen" v-model="form" ref="crud" @row-update="rowUpdate" @row-save="rowSave" @row-del="rowDel"
               @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange"
               @current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
      <template slot="menuLeft">
      </template>

      <template slot="menuLeft">
        <el-button type="primary" size="small" icon="el-icon-plus"
                   @click="showAdd">新增
        </el-button>
      </template>

      <!-- 操作菜单 -->
      <template slot-scope="{row}" slot="menu">
        <el-button type="text" size="small" icon="el-icon-view" plain class="none-border"
                   @click.stop="handleView(row)">查看
        </el-button>
        <el-button v-if="row.registerStatus === 100 || row.registerStatus === 400 || row.registerStatus === 99" type="text" size="small" icon="el-icon-edit" plain class="none-border"
                   @click.stop="handleEdit(row)">编辑
        </el-button>
        <el-button v-if="row.registerStatus === 101" type="text" size="small" icon="el-icon-edit" plain class="none-border"
                   @click.stop="handleSign(row)">签署协议
        </el-button>
        <el-button v-if="row.registerStatus != null && row.registerStatus !== 100" type="text" size="small" icon="el-icon-view" plain class="none-border"
                   @click.stop="handleRegisterRequestView(row.id)">进件记录
        </el-button>
      </template>
      <template slot="registerStatus" slot-scope="{row}">
        <el-tag plain type="warning" size="small" v-if="row.registerStatus === 100">资料完善中</el-tag>
        <el-tag plain type="primary" size="small" v-if="row.registerStatus === 98">送审中</el-tag>
        <el-tag plain type="warning" size="small" v-if="row.registerStatus === 101">协议待签署</el-tag>
        <el-tag plain type="warning" size="small" v-if="row.registerStatus === 102">审核中</el-tag>
        <el-tag plain type="success" size="small" v-if="row.registerStatus === 200">审核成功</el-tag>
        <el-tag plain type="danger" size="small" v-if="row.registerStatus === 400">审核失败</el-tag>
        <el-tag plain type="danger" size="small" v-if="row.registerStatus === 99">送审失败</el-tag>
      </template>
    </avue-crud>

    <platformbussinessinfoAdd v-show="addVisible" @submit="submit" :form1="data1" :form2="data2" :form3="data3" :form4="data4" :curEvent="currentEvent" ref="platformAddDialog" @closeDialog="closeDialog"></platformbussinessinfoAdd>
    <bussinessinfo-detail v-show="detailVisible" :form1="detailData" ref="detailDialog"></bussinessinfo-detail>
    <el-dialog title="平台商户进件申请记录" :append-to-body="true" :visible.sync="registerRequestVisible" top="1vh" @close="closeRequestDialog" :close-on-click-modal="false">
      <bussiness-register-request :bussiness-info-id="bussinessInfoId" v-if="registerRequestVisible"></bussiness-register-request>
    </el-dialog>
  </basic-container>
</template>

<script>
  import platformbussinessinfoAdd from "../bussinessmng/comps/platform-bussinessinfo-add.vue"
  import bussinessinfoDetail from "../bussinessmng/comps/bussinessinfo-detail.vue"
  import bussinessRegisterRequest from "../bussinessmng/bussinessregisterrequest.vue"
  import {
    getList,
    getDetail,
    add,
    update,
    remove,
    agreeSign
  } from "@/api/bussinessmng/bussinessinfo";
  import {add as merchantRegister} from "@/api/bussinessmng/bussinessregisterrequest";
  import {getByTypeAndBussinessInfoId} from "@/api/bussinessmng/bussinesscontactinfo";
  import {
    mapGetters
  } from "vuex";

  export default {
    components: {
      bussinessinfoDetail,bussinessRegisterRequest,platformbussinessinfoAdd
    },
    data() {
      return {
        bussinessInfoId: null,
        currentEvent: "add",
        data1: {
          id:'',
          signType: '',
          licenceNo: '',
          openAccountLicenceNo: '',
          signName: '',
          shortName: '',
          province: '',
          city: '',
          district: '',
          address: '',
          licenceUrl: '',
          handLicenceUrl: '',
          openAccountLicenceUrl: '',
          bussinessRole:''
        },
        data2: {
          id: '',
          bussinessInfoId: '',
          legalName: "",
          legalLicenceType: '',
          legalLicenceNo: '',
          legalLicenceFrontUrl: '',
          legalLicenceBackUrl: ''
        },
        data3: {
          bussinessInfoId: '',
          contactName: '',
          contactLicenceNo: '',
          contactMobile: '',
          contactEmail: '',
          servicePhone: ''
        },
        data4:{
          paymentScene: null,
          agreementPhotoUrl: null,
          systemScreenshotUrl: null,
          specialPermitProcessUrl: null,
        },
        //详情
        detailData:{},
        detailVisible: false,
        addVisible: false,
        registerRequestVisible: false,
        form: {},
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        selectionList: [],
        option: {
          height: 'auto',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          viewBtn: false,
          editBtn: false,
          addBtn: false,
          delBtn: false,
          selection: true,
          dialogClickModal: false,
          labelWidth: 150,
          column: [
            {
              label: "采购商",
              prop: "bussinessId",
              type: "select",
              filterable: true,
              dicUrl: "/api/cyzh-guosen/bussiness/listBussiness?size=500",
              props:{
                label: "name",
                value: "id"
              },
              addDisplay: false,
              editDisplay: false,
              viewDisplay: true
            },
            {
              label: "商户签约类型",
              prop: "signType",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=business_sign_type",
              props: {
                label: "dictValue",
                value: "dictKey"
              },
            },
            {
              label: "商户证件编号",
              prop: "licenceNo",
              placeholder: "统一社会信用代码证编号、事业单位法人证书编号、社会团体证书编号等，与商户签约类型匹配",
              hide:true,
              rules: [{
                required: true,
                message: "请输入商户证件编号,",
                trigger: "blur"
              }]
            },
            {
              label: "商户证件照片",
              prop: "licenceUrl",
              type: "upload",
              hide:true,
              listType: "picture-img",
              action: '/api/putObject',
              propsHttp: {
                url: 'data'
              },
              rules: [{
                required: true,
                message: "请上传商户证件照片",
                trigger: "blur"
              }],
            },
            {
              label: "商户签约名称",
              prop: "signName",
              labelWidth: 110,
              searchLabelWidth: 110,
              search:true,
              placeholder: "与商户证件主体名称一致",
              rules: [{
                required: true,
                message: "请输入商户签约名称",
                trigger: "blur"
              }]
            },
            {
              label: "商户简称",
              prop: "shortName",
              rules: [{
                required: true,
                message: "请输入商户简称",
                trigger: "blur"
              }]
            },
            {
              label: "商户实际经营地所在省",
              prop: "province",
              placeholder: "要求按照商户实际经营地址选择对应的省编号",
              hide:true,
              rules: [{
                required: true,
                message: "请输入商户实际经营地所在省",
                trigger: "blur"
              }]
            },
            {
              label: "商户实际经营地所在市",
              prop: "city",
              placeholder: "要求按照商户实际经营地址选择对应的市编号",
              hide:true,
              rules: [{
                required: true,
                message: "请输入商户实际经营地所在市",
                trigger: "blur"
              }]
            },
            {
              label: "商户实际经营地所在区",
              prop: "district",
              placeholder: "要求按照商户实际经营地址选择对应的区编号",
              hide:true,
              rules: [{
                required: true,
                message: "请输入商户实际经营地所在区",
                trigger: "blur"
              }]
            },
            {
              label: "经营地址",
              prop: "address",
              placeholder: "经营地址不需要再次上送省市区",
              rules: [{
                required: true,
                message: "请输入经营地址",
                trigger: "blur"
              }]
            },
            {
              label: "开户许可证编号",
              prop: "openAccountLicenceNo",
              placeholder: "如无开户许可证编号，可传基本存款账户编号",
              hide:true,
              rules: [{
                required: true,
                message: "请输入开户许可证编号",
                trigger: "blur"
              }]
            },
            {
              label: "开户许可证照片",
              prop: "openAccountLicenceUrl",
              placeholder: "如无开户许可证，请上传基本存款账户信息表照片",
              hide:true,
              listType: "picture-img",
              action: '/api/putObject',
              propsHttp: {
                url: 'data'
              },
              rules: [{
                required: true,
                message: "请上传开户许可证照片",
                trigger: "blur"
              }]
            },
            {
              label: "手持营业执照在经营场所的照片",
              prop: "handLicenceUrl",
              hide:true,
              listType: "picture-img",
              action: '/api/putObject',
              propsHttp: {
                url: 'data'
              },
              rules: [{
                required: true,
                message: "请上传手持营业执照在经营场所的照片",
                trigger: "blur"
              }]
            },
            {
              label: "进件状态",
              prop: "registerStatus",
              type: "select",
              search: true,
              slot: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=merchant_register_status",
              display: false,
              props:{
                label: "dictValue",
                value: "dictKey"
              },
            },
            {
              label: "审核意见",
              prop: "auditOpinion",
            },
          ]
        },
        data: []
      };
    },
    computed: {
      ...mapGetters(["permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.platformbussinessinfo_add, false),
          viewBtn: this.vaildData(this.permission.platformbussinessinfo_view, false),
          delBtn: this.vaildData(this.permission.platformbussinessinfo_delete, false),
          editBtn: this.vaildData(this.permission.platformbussinessinfo_edit, false),
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      }
    },
    methods: {
      handleRegisterRequestView(bussinessInfoId){
        this.bussinessInfoId = bussinessInfoId;
        this.registerRequestVisible = true;
      },
      handleView(item){
        let that = this;
        getDetail(item.id).then(res=>{
          that.detailData = res.data.data
          that.$refs.detailDialog.open()
        })
      },
      showAdd(){
        if (!this.$isEmpty(this.data1.id)) {
          this.resetData()
        }
        this.currentEvent = "add";
        this.$refs.platformAddDialog.open()
      },
      //编辑
      handleEdit(item) {
        this.currentEvent = "edit";
        let that = this;
        this.data1= {
          id:item.id,
          bussinessId: item.bussinessId,
          signType: item.signType,
          licenceNo: item.licenceNo,
          openAccountLicenceNo: item.openAccountLicenceNo,
          signName: item.signName,
          shortName: item.shortName,
          province: item.province,
          registerStatus: item.registerStatus,
          city: item.city,
          district: item.district,
          address: item.address,
          licenceUrl: item.licenceUrl,
          handLicenceUrl: item.handLicenceUrl,
          openAccountLicenceUrl: item.openAccountLicenceUrl,
        }
        getByTypeAndBussinessInfoId(10, item.id).then(res =>{
          that.data2 = res.data.data;
        }),
        getByTypeAndBussinessInfoId(11, item.id).then(res => {
          that.data3= res.data.data;
        })
        that.$refs.platformAddDialog.open()
      },
      handleSign(){
        agreeSign().then(res =>{
          window.open(res.data.data, '_blank');
        });
      },
      closeDialog(){
        this.onLoad(this.page);
        this.resetData();
      },
      closeRequestDialog(){
        this.registerRequestVisible = false;
      },
      resetData(){
        this.data1= {

        }
        this.data2= {

        }
        this.data3= {

        }
      },
      submit(item) {
        merchantRegister(item).then(() => {
          this.$message({
            type: "success",
            message: "操作成功!"
          });
        });
        this.$message({
          type: "success",
          message: "操作成功，请等待结果"
        });
        this.onLoad(this.page);
        this.$refs.platformAddDialog.close();
        this.resetData();
      },
      rowSave(row, done, loading) {
        add(row).then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          done();
        }, error => {
          loading();
          window.console.log(error);
        });
      },
      rowUpdate(row, index, done, loading) {
        update(row).then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          done();
        }, error => {
          loading();
          console.log(error);
        });
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
                .then(() => {
                  return remove(row.id);
                })
                .then(() => {
                  this.onLoad(this.page);
                  this.$message({
                    type: "success",
                    message: "操作成功!"
                  });
                });
      },
      handleDelete() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
                .then(() => {
                  return remove(this.ids);
                })
                .then(() => {
                  this.onLoad(this.page);
                  this.$message({
                    type: "success",
                    message: "操作成功!"
                  });
                  this.$refs.crud.toggleSelection();
                });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDetail(this.form.id).then(res => {
            this.form = res.data.data;
          });
        }
        done();
      },
      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();
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      onLoad(page, params = {}) {
        this.loading = true;
        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.loading = false;
          this.selectionClear();
        });
      }
    }
  };
</script>

<style>
</style>
