<template>
  <div
    style="background-color: #fafafa; position: relative; margin-top: -10px"
    v-loading="loading"
  >
    <div
      flex="main:justify"
      style="height: 45px; margin-right: 5px; line-height: 45px"
    >
      <div style="margin: 7px 0 0 24px">
        <div v-if="queryId">
          <el-button
            type="primary"
            :class="getIcon(leftButton)"
            class="iconfont"
            size="small"
          >
            <span> {{ leftButton.contractBillState }} </span>
          </el-button>
          <el-button
            type="primary"
            size="small"
            :class="getIcon(leftButton)"
            class="iconfont"
          >
            <span> {{ leftButton.invBillState }}</span>
          </el-button>
        </div>
      </div>
      <div class="rightButton">
        <el-button
          type="primary"
          size="small"
          @click="newlyIncreased"
          style="padding: 9px 10px"
        >
          <i class="el-icon-plus mr"></i>新增</el-button
        >
        <el-button
          type="primary"
          size="small"
          @click="duplicate"
          style="padding: 9px 10px"
        >
          <i class="el-icon-document-copy mr"></i>复制</el-button
        >
        <el-button
          type="primary"
          size="small"
          @click="revise"
          style="padding: 9px 10px"
          v-if="showButton == '1'"
        >
          <i class="el-icon-edit mr"></i>修改</el-button
        >
        <el-button
          type="danger"
          size="small"
          @click="cutOut"
          style="padding: 9px 10px"
          v-if="showButton == '1'"
        >
          <i class="el-icon-delete mr"></i>删除
        </el-button>
        <el-button
          type="primary"
          size="small"
          @click="submitTo"
          style="padding: 9px 10px"
          v-if="showButton == '1'"
        >
          <i class="el-icon-position mr"></i>提交
        </el-button>
        <el-button
          type="primary"
          size="small"
          @click="process"
          style="padding: 9px 10px"
          v-if="showButton == '2'"
        >
          <i class="el-icon-coordinate mr"></i>审核</el-button
        >
        <el-button
          type="primary"
          size="small"
          @click="change"
          style="padding: 9px 10px"
          v-if="showButton == '3'"
        >
          <i class="el-icon-plus mr"></i>变更</el-button
        >
        <!-- <el-button type="primary" size="small" @click="change" style="padding: 9px 10px">变更</el-button> -->
        <el-button
          type="primary"
          size="small"
          @click="stamp"
          style="padding: 9px 10px"
          v-if="showButton == '3'"
          >打印</el-button
        >
        <el-button
          type="primary"
          size="small"
          @click="firstPage"
          style="padding: 9px 10px"
        >
          <i class="mr"></i>首条</el-button
        >
        <el-button
          type="primary"
          size="small"
          icon="el-icon-arrow-left"
          style="margin-right: 10px"
          @click="previousPage"
        ></el-button>
        {{ currentPage }} / {{ pageCount }}
        <el-button
          type="primary"
          size="small"
          icon="el-icon-arrow-right"
          @click="nextPage"
        ></el-button>
        <el-button type="primary" size="small" @click="Last">末条</el-button>
      </div>
    </div>
    <div style="display: flex; margin: 10px 0; height: 100%">
      <div style="overflow-y: auto; width: 100%">
        <el-collapse
          v-model="activeNames"
          @change="handleChange(activeNames, 1)"
          class="box"
        >
          <el-collapse-item name="1" style="margin: 0 10px">
            <template slot="title">
              <div class="title_box" flex="cross:center main:justify">
                <span class="title">基本信息</span>
                <span class="operate">{{ arr1 == -1 ? "展开" : "收起" }}</span>
              </div>
            </template>
            <look-form
              ref="customForm1"
              :formRow="topFormRow"
              :spanNumber="spanNumber"
              :ruleForm="topRuleForm"
              @clickToView="clickToView"
              style="padding: 10px 0"
            >
            </look-form>
          </el-collapse-item>
          <el-collapse-item name="2" style="margin: 0 10px">
            <template slot="title">
              <div class="title_box" flex="cross:center main:justify">
                <span class="title">关联合同</span>
                <span class="operate">{{ arr2 == -1 ? "展开" : "收起" }}</span>
              </div>
            </template>
            <look-form
              ref="customForm2"
              :formRow="relatedContract"
              :spanNumber="spanNumber"
              :ruleForm="topRuleForm"
              @clickToView="clickToView"
              style="padding: 10px 0"
            >
            </look-form>
          </el-collapse-item>
          <el-collapse-item name="3" style="margin: 0 10px">
            <template slot="title">
              <div class="title_box" flex="cross:center main:justify">
                <span class="title">保证金、质保金</span>
                <span class="operate">{{ arr2 == -1 ? "展开" : "收起" }}</span>
              </div>
            </template>
            <look-form
              ref="customForm2"
              :formRow="secondFormRow"
              :spanNumber="spanNumber"
              :ruleForm="topRuleForm"
              style="padding: 10px 0"
            >
            </look-form>
          </el-collapse-item>
          <el-collapse-item name="4" style="margin: 0 10px">
            <template slot="title">
              <div class="title_box" flex="cross:center main:justify">
                <span class="title"
                  >合同明细({{ detailedTableData.length }})</span
                >
                <span class="operate">{{ arr3 == -1 ? "展开" : "收起" }}</span>
              </div>
            </template>
            <div class="agreement" style="padding: 0 10px">
              <div
                v-if="detailedTableData.length == '0'"
                style="text-align: center"
              >
                暂无明细
              </div>
              <base-table
                v-else
                ref="customtable"
                :border="true"
                :showIndex="true"
                :tabLoading.sync="tabLoading"
                :tableData="detailedTableData"
                align="center"
                :tableColumn="contractDetails"
                class="table"
                :showsummary="true"
                :SummariesIndex="[7, 8, 9, 11, 12, 13]"
              >
              </base-table>
            </div>
          </el-collapse-item>
          <el-collapse-item name="5" style="margin: 0 10px">
            <template slot="title">
              <div class="title_box" flex="cross:center main:justify">
                <span class="title">合同阶段({{ stageTableData.length }})</span>
                <span class="operate">{{ arr4 == -1 ? "展开" : "收起" }}</span>
              </div>
            </template>
            <div style="padding: 0 10px">
              <div
                v-if="stageTableData.length == '0'"
                style="text-align: center"
              >
                暂无明细
              </div>
              <base-table
                v-else
                ref="customtable"
                :border="true"
                :showIndex="true"
                :tabLoading.sync="tabLoading"
                :tableData="stageTableData"
                align="center"
                :tableColumn="contractPhase"
                class="table"
                :showsummary="true"
                :SummariesIndex="[5, 6]"
              >
                <template v-slot:planDate="{ row }">
                  <span>{{ formatTime(row.planDate) }}</span>
                </template>
              </base-table>
            </div>
          </el-collapse-item>
          <el-collapse-item name="6" style="margin: 0 10px">
            <template slot="title">
              <div class="title_box" flex="cross:center main:justify">
                <span class="title">附件管理({{ appendixList.length }})</span>
                <span class="operate">{{ arr5 == -1 ? "展开" : "收起" }}</span>
              </div>
            </template>
            <div>
              <el-table
                header-align="center"
                :data="appendixList"
                align="center"
                :border="true"
              >
                <el-table-column prop="sa_ShowName" label="文件名">
                </el-table-column>
                <el-table-column prop="personName" label="上传人" width="100">
                </el-table-column>
                <el-table-column
                  prop="sa_UploadDateTime"
                  label="上传时间"
                  width="200"
                >
                  <template slot-scope="scope">{{
                    formatTime(scope.row.sa_UploadDateTime)
                  }}</template>
                </el-table-column>
                <el-table-column
                  prop="sa_AttachmentSize"
                  label="大小"
                  width="80"
                >
                </el-table-column>
                <el-table-column label="操作" width="120">
                  <template slot-scope="scope">
                    <div flex="cross:center">
                      <span class="tableButton" @click="getFile(scope.row)"
                        >下载</span
                      >
                      <!-- <span class="tableButton">下载</span> -->
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-collapse-item>
        </el-collapse>
      </div>

      <contract-assistant
        ref="contractAssistant"
        :billID="queryId"
        :billStateName="billStateName"
      ></contract-assistant>

      <audit-note
        ref="auditNote"
        :billID="billID"
        :billKindID="billKindID"
        :billStateName="billStateName"
      ></audit-note>
    </div>

    <base-dialog
      :closeEscape="true"
      :showClose="true"
      :closeModal="false"
      :dialogVisible.sync="choiceDialog"
      class="userDialog"
      :title="choiceTitle"
      width="70%"
      top="10vh"
      v-loading="springFrame"
    >
      <div>
        <p
          style="
            font-size: 16px;
            color: #000;
            padding-bottom: 10px;
            border-bottom: 1px solid #fafafa;
          "
        >
          基本信息
        </p>
        <look-form
          :formRow="essentialInformation"
          :spanNumber="8"
          :ruleForm="informationContent"
          style="padding: 10px 0"
        >
        </look-form>
      </div>
      <div>
        <p
          style="
            font-size: 16px;
            color: #000;
            padding-bottom: 10px;
            border-bottom: 1px solid #fafafa;
          "
        >
          明细
        </p>
        <base-table
          ref="customtable"
          :border="true"
          :showIndex="true"
          :tableData="tableData"
          :tableColumn="tableColumn"
          :funData="[]"
          style="margin-top: 15px"
        >
        </base-table>
      </div>
      <div>
        <p
          style="
            font-size: 16px;
            color: #000;
            padding-bottom: 10px;
            padding-top: 20px;
            border-bottom: 1px solid #fafafa;
          "
        >
          附件管理
        </p>
        <base-table
          ref="customtable"
          :border="true"
          :showIndex="true"
          :tableData="attachmentDetails"
          :tableColumn="appendix"
          :funData="[]"
          style="margin-top: 15px"
        >
        </base-table>
      </div>
    </base-dialog>

    <base-drag-ball
      @handlepaly="openAssistant"
      style="cursor: pointer; z-index: 10000"
    ></base-drag-ball>
  </div>
</template>

<script>
import configData from "./configData";
import baseDragBall from "@/components/base/baseDragBall";

import { GetBillData, vendorGetBillData } from "@/api/apis/fileManagement";
import { UploadList, downloadFromMinio } from "@/api/apis/auth.js";
import contractAssistant from "./contractAssistant.vue";
import auditNote from "./auditNote.vue";
import {
  getAuditBtn,
  getAuditNote,
  audit,
  submitAudit,
} from "@/api/apis/audit";
import {
  getContractList,
  getContractDetails,
  OrganDelContract,
} from "@/api/apis/contract";
import lookForm from "@/components/base/baselookForm/index.vue";
import baseTable from "@/components/base/baseTable";
import baseDialog from "@/components/base/BaseNewDialog/index.vue";
export default {
  name: "SeeContract",
  components: {
    lookForm,
    baseTable,
    baseDialog,
    contractAssistant,
    auditNote,
    baseDragBall,
  },
  data() {
    return {
      queryId: "",
      //
      billID: "",
      billKindID: "45",
      billStateName: "",
      auditNote: [],
      textarea: "",
      auditState: null, //单据审核状态
      // openaudit: false,//审核
      //
      loading: false,
      leftButton: {},
      showButton: "",
      currentPage: "",
      pageCount: "",
      activeNames: ["1"],
      arr1: "",
      topFormRow: configData.topFormRow, // 基本信息表头,
      spanNumber: 6,
      topRuleForm: {}, //基本信息，保证金、质保金表体内容,
      arr2: "-1",
      secondFormRow: configData.secondFormRow, //保证金、质保金头,
      relatedContract: configData.relatedContract, // 关联合同表头
      arr3: "-1",
      detailedTableData: [], //congetContractDetails,
      contractDetails: configData.contractDetails,
      arr4: "-1",
      stageTableData: [], //configData.stageTableData,	//合同阶段表体内容,
      contractStage: configData.contractStage,
      arr5: "-1",
      appendix: [],
      appendixList: [],
      springFrame: false,
      choiceDialog: false,
      choiceTitle: "",
      essentialInformation: {},
      informationContent: {},
      tableData: [],
      tableColumn: [],
      attachmentDetails: [],
      arr6: "-1",
      total1: false,
      total2: false,
      detailedIndex: [10],
      stageIndex: [7],
      detailedTableColumn: configData.detailedTableColumn, //合同明细表头内容,
      stageTableColumn: configData.stageTableColumn, // 合同阶段表头内容,
      detailedLoading: false,
      secondRuleForm: {},
      detailed: [], //合同明细表体内容,
      list: {},
      getContractDetails,
      allData: [],
      appendixId: [],
      fileFunData: [
        {
          color: "#3CA2E1",
          text: "查看",
        },
        {
          color: "#3CA2E1",
          text: "下载",
        },
      ],
      contractDetails: [
        // {
        //   label: "序号",
        //   prop: "index",
        //   tooltip: true,
        //   width: "100",
        // },
        {
          label: "是否新产品",
          prop: "isCustomMade",
          tooltip: true,
          width: "90",
        },
        {
          label: "是否定制机",
          prop: "isNewProduct",
          tooltip: true,
          width: "90",
        },
        {
          label: "存货编码",
          prop: "invCode",
          tooltip: true,
          width: "110",
        },
        {
          label: "设备名称",
          prop: "invName",
          tooltip: true,
          width: "120",
        },
        {
          label: "设备编码",
          prop: "cEQCode",
          tooltip: true,
          width: "120",
        },
        // {
        //   label: "规格",
        //   prop: "InvStd",
        //   tooltip: true,
        // },
        {
          label: "计量单位",
          prop: "unit",
          tooltip: true,
        },
        {
          label: "数量",
          prop: "quantity",
          tooltip: true,
          width: "120",
        },
        {
          label: "单价",
          prop: "unitPrice",
          tooltip: true,
          width: "120",
        },
        {
          label: "金额",
          prop: "money",
          tooltip: true,
          width: "120",
        },
        {
          label: "税率",
          prop: "tax",
          tooltip: true,
          width: "95",
        },
        {
          label: "税额",
          prop: "taxMoney",
          tooltip: true,
          width: "120",
        },
        {
          label: "无税单价",
          prop: "nUnitPeice",
          tooltip: true,
          width: "120",
        },
        {
          label: "无税金额",
          prop: "nUnitMoney",
          tooltip: true,
          width: "120",
        },
        {
          label: "备注",
          prop: "detail_Remark",
          tooltip: true,
          width: "120",
        },
      ],
      contractDetailsData: [],
      tabLoading: false,
      contractPhase: [
        // {
        // 	label: '序号',
        // 	prop: 'index',
        // 	tooltip: true,
        // 	width: '100'
        // },
        {
          label: "阶段名称",
          prop: "phaseName",
          tooltip: true,
          width: "120",
        },
        {
          label: "执行内容",
          prop: "phaseContent",
          tooltip: true,
        },
        {
          label: "预警天数",
          prop: "warininDays",
          tooltip: true,
          width: "100",
        },
        {
          label: "预计执行日期",
          prop: "planDate",
          tooltip: true,
          width: "150",
        },
        {
          label: "执行数量",
          prop: "execAmount",
          tooltip: true,
          width: "120",
        },
        {
          label: "执行金额",
          prop: "execMoney",
          tooltip: true,
          width: "120",
        },
        // {
        // 	label: "操作",
        // 	prop: "operate",
        // 	width: "70",
        // },
      ],
      firstOpen: true,
      refresh: true,
    };
  },
  activated() {
    if (this.$route.query.Refresh == "true") {
      this.refresh = true;
    }
    if (this.firstOpen == false && this.refresh == true) {
      this.$tab.refreshPage(this.$route);
    }
    this.firstOpen = false;
    this.$route.query.Refresh = false;
  },
  created() {
    this.queryId = this.$route.query.id;
    this.billID = this.billID ? this.billID : this.queryId;
    if (this.queryId) {
      this.init();
    } else {
      this.getContractList();
    }
    this.refresh = false;
    this.$route.query.Refresh = false;
  },
  watch: {
    billID: {
      handler(val) {
        this.billID = val;
      },
      deep: true,
    },
  },
  methods: {
    openAssistant() {
      this.$refs.contractAssistant.open();
      this.$refs.auditNote.close();
    },
    getIcon(val) {
      if (val.contractBillState == "终止") {
        return "icon-zhongzhi";
      } else if (val.contractBillState == "未提交") {
        return "icon-weitijiao";
      } else if (val.contractBillState == "审核中") {
        return "icon-shenhezhong";
      } else if (val.contractBillState == "完成") {
        return "icon-shenhetongguo";
      } else if (val.invBillState == "未开票") {
        return "icon-a-9weikaipiaochuli";
      }
    },
    async init() {
      this.loading = true;
      if (this.queryId) {
        const res = await getContractDetails({
          id: this.queryId,
          op: "show",
        });
        this.assignment(res);
        this.getContractList();
      }

      this.openInit();
    },
    openInit() {
      if (this.billStateName != "审核中") {
        this.$refs.auditNote.close();
      } else {
        this.process();
      }
    },
    async getContractList() {
      this.list = await getContractList({
        page: 1,
        limit: 999,
        sequence: "",
        SequenceName: "",
        CodeOrName: "",
        ConType: "",
      });
      if (this.list.code == 1) {
        this.pageCount = this.list.data[0];
        this.currentPage = this.list.data[1].findIndex((item) => {
          return item.billid == this.queryId;
        });
        this.currentPage++;
        if (this.currentPage == '0') {
          this.nextPage()
        }
        this.loading = false;
      }
    },
		judgeOn(data,Refresh,id) {
			let el = this.$store.state.tagsView.visitedViews.filter(el => {
				return el.path == '/contractManagement/salesContract/addEditChange'
			})
			if (el.length > 0) {
					this.$confirm('当前页面已打开，继续打开页面原页面数据将被清除，是否继续?', '提示', {
					  confirmButtonText: '确定',
					  cancelButtonText: '取消',
					  type: 'warning'
					}).then(() => {
						this.$router.push({
							path: "addEditChange",
							query: {
								name: data,
								id: id,
                Refresh
							}
						});
					}).catch(() => {
					  this.$message({
						type: 'info',
						message: '已取消操作'
					  });          
				})
			} else {
				this.$router.push({
					path: "addEditChange",
					query: {
						name: data,
						id: id,
						Refresh: Refresh
					}
				});
      }
		},
    newlyIncreased() {
      this.judgeOn('新增合同',true)
      // this.$router.push({
      //   path: "addEditChange",
      //   query: {
      //     name: '新增合同'
      //   },
      // });
    },
    duplicate() {
      this.judgeOn('新增合同（复制）',true,this.list.data[1][this.currentPage - 1].billid)
      // this.$router.push({
      //   path: "addEditChange",
      //   query: {
      //     id: this.list.data[1][this.currentPage - 1].billid,
      //     Refresh: true,
      //     name: '新增合同（复制）'
      //   },
      // });
    },
    revise() {
      this.judgeOn('编辑合同',true,this.list.data[1][this.currentPage - 1].billid)
      // this.$router.push({
      //   path: "addEditChange",
      //   query: {
      //     id: this.list.data[1][this.currentPage - 1].billid,
      //     Refresh: true,
      //     name: '编辑合同'
      //   },
      // });
    },
    cutOut() {
      this.$confirm("确认删除吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.delData(this.list.data[1][this.currentPage - 1].billid);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消操作",
          });
        });
    },
    //审核
    process() {
      this.$refs.auditNote.open();
      this.$refs.auditNote.init();

      this.$refs.contractAssistant.close();
    },
    // 变更
    change() {
      this.judgeOn('变更合同',true,this.list.data[1][this.currentPage - 1].billid)
      // this.$router.push({
      //   path: "addEditChange",
      //   query: {
      //     id: this.list.data[1][this.currentPage - 1].billid,
      //     Refresh: true,
      //     name: '变更合同'
      //   },
      // });
    },
    stamp() {},
    async delData(id) {
      const res = await OrganDelContract({
        id,
      });
      if (res.success == "true") {
        this.$message({
          message: "删除成功",
          type: "success",
        });
        this.init();
        // this.$refs.customtable.clearRadioIndex();
        // this.radioIndex = false;
      }
    },
    async firstPage() {
      this.billID = this.list.data[1][0].billid;
      if (this.currentPage == 0) {
        this.$message({
          showClose: true,
          message: "已经是最早一页了！",
          type: "warning",
        });
        return;
      }
      if (this.currentPage == 1) {
        this.$message({
          showClose: true,
          message: "已经是最早一页了！",
          type: "warning",
        });
      } else {
        this.loading = true;
        const res = await getContractDetails({
          id: this.list.data[1][0].billid,
          op: "show",
        });
        if (res.code == 1) {
          this.currentPage = 1;
          this.assignment(res);
          this.openInit();
        }
        this.loading = false;
      }
    },
    async previousPage() {
      // this.billID = this.list.data[1][this.currentPage - 2].billid;
      if (this.currentPage == 0) {
        this.$message({
          showClose: true,
          message: "已经是最早一页了！",
          type: "warning",
        });
        return;
      }
      if (this.currentPage == 1) {
        this.$message({
          showClose: true,
          message: "已经是最早一页了！",
          type: "warning",
        });
      } else {
        this.loading = true;
        const res = await getContractDetails({
          id: this.list.data[1][this.currentPage - 2].billid,
          op: "show",
        });
        if (res.code == 1) {
          this.currentPage--;
          this.assignment(res);
          this.openInit();
        }
        this.loading = false;
      }
    },
    async nextPage() {
      this.billID = this.list.data[1][this.currentPage].billid;

      if (this.currentPage == this.pageCount) {
        this.$message({
          showClose: true,
          message: "已经是最后一页了！",
          type: "warning",
        });
      } else {
        this.loading = true;
        const res = await getContractDetails({
          id: this.list.data[1][this.currentPage].billid,
          op: "show",
        });

        if (res.code == 1) {
          this.currentPage++;
          this.assignment(res);
          this.openInit();
        }
        this.loading = false;
      }
      // if (this.currentPage == 0) {
      //   this.loading = true;
      //   const res = await getContractDetails({
      //     id: this.list.data[1][this.currentPage].billid,
      //     op: "show",
      //   });
      //   if (res.code == 1) {
      //     this.currentPage++;
      //     this.assignment(res);
      //   }
      //   this.loading = false;
      // }
    },
    async Last() {
      this.billID = this.list.data[1][this.pageCount - 1].billid;

      if (this.currentPage == this.pageCount) {
        this.$message({
          showClose: true,
          message: "已经是最后一页了！",
          type: "warning",
        });
      } else {
        this.loading = true;
        const res = await getContractDetails({
          id: this.list.data[1][this.pageCount - 1].billid,
          op: "show",
        });
        if (res.code == 1) {
          this.currentPage = this.pageCount;
          this.assignment(res);
          this.openInit();
        }
        this.loading = false;
      }
      if (this.currentPage == 0) {
        this.loading = true;
        const res = await getContractDetails({
          id: this.list.data[1][this.list.data[1].length].billid,
          op: "show",
        });
        if (res.code == 1) {
          this.currentPage++;
          this.assignment(res);
          this.openInit();
        }
        this.loading = false;
      }
    },
    handleChange(val, index) {
      // console.log(val, "val");

      this.arr1 = val.indexOf("1");
      this.arr2 = val.indexOf("2");
      this.arr3 = val.indexOf("3");
      this.arr4 = val.indexOf("4");
      this.arr5 = val.indexOf("5");
      this.arr6 = val.indexOf("6");
    },
    clickToView(row, ruleForm) {
      // console.log(row);
      if (row.prop == "cusName") {
        // console.log("111");
        this.springFrame = true;
        this.choiceTitle = "客户档案查看";
        this.essentialInformation = configData.essentialInformation;
        this.tableColumn = configData.tableColumn;
        this.appendix = configData.appendix;
        this.GetBillData(ruleForm.customerCode);
        this.choiceDialog = true;
        // console.log("123");
      } else if (row.prop == "venName") {
        this.springFrame = true;
        this.choiceTitle = "供应商档案查看";
        this.essentialInformation = configData.unitDetails;
        this.tableColumn = configData.tableColumn;
        this.appendix = configData.appendix;
        this.vendorGetBillData(ruleForm.vendorCode);
        this.choiceDialog = true;
        // console.log("456");
      }
    },
    async getFile(row) {
      // console.log(row);
      let res = await downloadFromMinio({
        filesID: row.sa_AttachmentID,
      });
      const blob = new window.Blob([res]);
      const fileName = row.sa_AttachmentName;
      const elink = document.createElement("a");
      elink.download = fileName;
      elink.style.display = "none";
      elink.href = URL.createObjectURL(blob);
      document.body.appendChild(elink);
      elink.click();
      URL.revokeObjectURL(elink.href); // 释放URL 对象 document.body.removeChild(elink);
    },
    async GetBillData(el) {
      const res = await GetBillData({
        id: "",
        op: "",
        code: el,
      });
      if (res.success == "true") {
        this.informationContent = res.data[0];
        this.tableData = res.data[1];
        this.springFrame = false;
      }
    },
    async vendorGetBillData(el) {
      const res = await vendorGetBillData({
        id: "",
        op: "",
        code: el,
      });
      if (res.success == "true") {
        this.informationContent = res.data[0];
        this.tableData = res.data[1];
        this.springFrame = false;
      }
    },
    assignment(res) {
      this.allData = res.data;
      this.topRuleForm = res.data[0];
      this.detailedTableData = res.data[1];
      this.detailedTableData.forEach(el => {
          el.isCustomMade = el.isCustomMade == "1" ? "是" : "否";
          el.isNewProduct = el.isNewProduct == "1" ? "是" : "否";
      })
      this.stageTableData = res.data[2];
      this.appendixId = res.data[3];
      this.leftButton = res.data[4];
      this.UploadList(this.appendixId);

      this.billStateName = this.leftButton.contractBillState;

      // console.log(this.billStateName, "all");

      if (res.data[4].contractBillState == "未提交") {
        this.showButton = "1";
      } else if (res.data[4].contractBillState == "审核中") {
        this.showButton = "2";
      } else if (res.data[4].contractBillState == "审核完成") {
        this.showButton = "3";
      } else {
        this.showButton = "";
      }
    },
    // 获取上传列表
    async UploadList() {
      let list = this.appendixId.split("'");
      let id = [];
      list.forEach((el) => {
        if (el != "" && el != ", ") {
          id.push(el);
        }
      });
      const res = await UploadList({
        page: "1", //当前页码
        limit: "20", //每页显示多少
        billid: "", //业务单据ID
        filesIDs: id, //附件ID
      });
      if (res.success == "true") {
        if (res.data.length != 0) {
          this.appendixList = res.data[1];
        }
      }
    },
    formatTime(row) {
      return row && row.substring(0, 10);
    },
    async submitTo() {
      const res = await submitAudit({
        billID: this.list.data[1][this.currentPage - 1].billid,
        wfID: "2",
        billKindID: this.billKindID,
      });
      if (res.success == "true") {
        this.$message({
          message: "提交审核成功",
          type: "success",
        });
      }
      this.init();
    },
  },
};
</script>

<style scoped lang="scss">
.iconfont {
  font-size: 12px !important;
}

.box {
  width: 100%;
  background-color: #fafafa;
  border-radius: 5px;
  margin-bottom: 20px;
  // height: calc(100vh - 135px);

  .title {
    font-size: 16px;
    color: #000;
    border-left: 3px solid #2261f6;
    padding-left: 8px;
    // padding: 28px 0 21px 29px;
    text-align: left;
  }

  .title_box {
    width: 100%;
    border-bottom: 1px solid #fafafa;
    padding-bottom: 10px;

    .operate {
      color: #409eff;
    }
  }

  ::v-deep .el-collapse-item {
    border-bottom: 10px solid #fafafa;
    // padding: 0 10px;
  }

  ::v-deep .el-collapse-item__header {
    height: auto;
    line-height: normal;
    padding: 15px 10px;
    border-bottom: none;
  }

  ::v-deep .el-collapse-item__arrow {
    margin-bottom: 8px;
    color: #409eff;
  }
}

>>> .el-form--label-top .el-form-item__label {
  padding: 0 !important;
}

// ::v-deep .el-button--primary {
//   background-color: #fff;
//   color: #06030c;
//   border: 1px solid #ccc;
// }

.agreement {
  // display: flex;
  // flex-wrap: wrap;

  ::v-deep .el-row {
    display: flex;
  }

  ::v-deep .el-col-6 {
    flex: 1;
    padding: 0;
  }

  ::v-deep .el-form-item__content {
    width: 70px;

    p {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}

.contract {
  display: flex;
  flex-wrap: wrap;

  ::v-deep .el-row {
    display: flex;
  }

  ::v-deep .el-col-6 {
    flex: 1;
    padding: 0;
  }

  ::v-deep .el-form-item__content {
    width: 70px;

    p {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }

  ::v-deep .el-row:nth-child(2) {
    p {
      height: 50px;
    }
  }
}

.rightButton {
  margin-top: 7px;

  ::v-deep .el-button--primary {
    padding: 9px 10px;
    margin-left: 8px;
  }

  ::v-deep .el-button--primary:last-child {
    padding: 9px 10px;
    margin-left: 8px;
    margin-right: 20px;
  }

  .mr {
    padding-right: 5px;
  }
}

::v-deep .el-loading-mask {
  z-index: 999;
}

.tableButton {
  color: #409eff;
  cursor: pointer;
}

.tableButton + .tableButton {
  // color: #409eff;
  margin-left: 5px;
}

::v-deep .el-collapse {
  flex: 1;
}
</style>
