<template>
  <div class="content-main">
    <el-form ref="formDetail" label-width="140px" :model="formDetail" class="demo-form-inline" :rules="rules">
      <div class="wrap">
          <el-row>
            <el-col :span="12">
              <el-form-item label="委托编号" required>
                <el-select v-model="formDetail.wtbh" clearable disabled>
                  <el-option v-for="(item, index) in []" :key="index" :label="item" :value="item"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="场次:" prop="apcc">
                <el-select disabled clearable v-model="formDetail.apcc">
                  <el-option v-for="item in ccOptions" :key="item.bdbm" :label="item.apcc" :value="item.bdbm"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="交易方向:" required>
                <el-input
                  disabled
                  clearable
                  v-model="formDetail.jyfxmc"
                  placeholder="请输入交易方向"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="交易方式:" required>
                <el-input
                  disabled
                  clearable
                  v-model="formDetail.jyfsmc"
                  placeholder="请输入交易方向"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="交易日期:" prop="jyrq">
                <el-input disabled clearable v-model="formDetail.jyrq"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="交易时间:" prop="jysj">
                <el-input disabled clearable v-model="formDetail.jysj"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="品种:">
                <el-input disabled clearable v-model="formDetail.lspzmc" placeholder="请输入交易品种"></el-input>
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item label="数量:">
                <el-input disabled clearable v-model="formDetail.sl" placeholder="请输入数量"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="交易保证金(元/吨):" prop="jybzj">
                <el-input
                  disabled
                  clearable
                  v-bind:value="
                    String(formDetail.jybzj).indexOf('.') > -1
                      ? Number(formDetail.jybzj).toFixed(2)
                      : formDetail.jybzj
                  "
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="履约保证金(元/吨)::" prop="lybzj">
                <el-input
                  disabled
                  clearable
                  v-bind:value="
                    String(formDetail.lybzj).indexOf('.') > -1
                      ? Number(formDetail.lybzj).toFixed(2)
                      : formDetail.lybzj
                  "
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="报名日期:" prop="bmrq">
                <el-input disabled clearable v-model="formDetail.bmrq" placeholder="请输入报名日期"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="报名单位:" prop="dwmc">
                <el-input disabled clearable v-model="formDetail.dwmc" placeholder="请输入报名单位"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="意向数量(吨):" prop="yxsl">
                <el-input disabled clearable v-model="formDetail.yxsl" placeholder="请输入意向数量"></el-input>
              </el-form-item>
            </el-col>
            <!-- <el-col :span="12">
              <el-form-item label="意向标的:" prop="yxbd">
                <el-input disabled clearable v-model="formDetail.yxbd" placeholder="请输入报名单位"></el-input>
              </el-form-item>
            </el-col> -->
            <el-col :span="12">
              <el-form-item label="缴款额:" prop="jkje">
                <el-input
                  disabled
                  clearable
                  v-model="formDetail.jkje"
                  v-bind:value="
                    String(formDetail.jkje).indexOf('.') > -1
                      ? Number(formDetail.jkje).toFixed(2)
                      : formDetail.jkje
                  "
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="联系人:" prop="sxfl">
                <el-input :disabled="disableFlag" clearable v-model="formDetail.sxfl" placeholder="请输入联系人"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="联系电话:" prop="lxdh" :rules="{
                  validator: checkCall,
                  trigger: 'blur'
                }">
                <el-input :disabled="disableFlag" clearable v-model="formDetail.lxdh" placeholder="请输入联系电话"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="附件:">
                <template>
                  <el-upload :disabled="disableFlag" :on-success="handleSuccess" class="upload-demo" :action="fileUrl" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" :file-list="fileList" style="width:95%">
                    <el-button type="primary" size="small" class="iconfont iconshangchuan" v-if="!disableFlag">上传</el-button>
                  </el-upload>
                  <!-- <span v-if="!disableFlag" @click="fjdetail(scope.row)">{{fjmc}}</span> -->
                </template>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
          <el-row style="background: rgb(237, 245, 253); line-height: 50px;margin-bottom: 10px;">
            <span style="margin-left:10px">交易审核信息:</span>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="审核结果:" prop="shjg" required>
                <el-radio-group v-model="formDetail.shjg" disabled>
                  <el-radio label="通过">通过</el-radio>>
                  <el-radio label="不通过">不通过</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="审核时间:" prop="shsj">
                <el-input clearable v-model="formDetail.shsj" disabled placeholder="请输入审核时间"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-col :span="24">
            <el-form-item label="审核意见:" prop="shyj">
              <el-input
                disabled
                type="textarea"
                clearable
                v-model="formDetail.shyj"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row style="background: rgb(237, 245, 253); line-height: 50px;margin-bottom: 10px;">
          <span style="margin-left:10px">汇款信息:</span>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="审核结果:" prop="skzt">
              <el-radio-group v-model="formDetail.skzt" :disabled="disableFlag">
                <el-radio :label="1">是</el-radio>
                <el-radio :label="0">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="审核时间:" prop="hksj">
              <el-input disabled v-model="formDetail.hksj"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="审核意见:">
              <el-input
                :disabled="disableFlag"
                type="textarea"
                clearable
                v-model="formDetail.hkyj"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        </div>
      </el-form>
    <!-- <div>
				<el-row class="sub-title">标的详情</el-row>
				<el-table :data="[]" border>
					<el-table-column
						label="序号"
						width="70px"
						type="index"
						align="center"
					></el-table-column>
					<el-table-column
						label="标的号"
						prop="bdh"
						align="center"
						show-overflow-tooltip
					></el-table-column>
					<el-table-column
						label="承储单位"
						prop="bdh"
						align="center"
						show-overflow-tooltip
					></el-table-column>
					<el-table-column
						label="仓号"
						prop="bdh"
						align="center"
						show-overflow-tooltip
					></el-table-column>
					<el-table-column
						label="品种"
						prop="bdh"
						align="center"
						show-overflow-tooltip
					></el-table-column>
					<el-table-column
						label="数量"
						prop="bdh"
						align="center"
						show-overflow-tooltip
					></el-table-column>
					<el-table-column
						label="生产年度"
						prop="bdh"
						align="center"
						show-overflow-tooltip
					></el-table-column>
					<el-table-column label="操作" align="center">
						<template slot-scope="scope">
							<el-tooltip
								class="item"
								effect="light"
								content="查看"
								placement="top"
							>
								<el-button
									type="primary"
									size="small"
									class="operate_show_btn iconfont iconchakan2"
									@click="handleDetail(scope.row)"
								></el-button>
							</el-tooltip>
						</template>
					</el-table-column>
				</el-table>
    </div>-->

    <span class="detail-footer">
      <el-button @click="save(0)" type="primary" size="small" class="iconfont iconbaocun" v-if="!disableFlag && !isSubmit" :disabled="isSaving">保存</el-button>
      <el-button @click="save(1)" type="primary" size="small" class="iconfont icontijiao" v-show="!disableFlag || isSubmit" :disabled="isSaving">提交</el-button>
      <el-button @click="returnList" type="primary" size="small" class="iconfont iconfanhui">返回</el-button>
    </span>
  </div>
</template>

<script>
import {
  insertTransactionSignUp,
  selectTransactionSignUpDetail,
  updateTransactionSignUp,
  selectSceneList,
  findByGroupId,
  selectFeeRateDetail,
  uploadFn,
  fileInfo,
} from "@/api/transaction/registrationFee/transactionSignup/index";
import { status1, getCodeName } from "@/utils/statusList.js";
import { getNowDate, dateTimeFormat } from "@/utils/index";
import { FileApi } from "@/api/index";
// const log = console.log;
export default {
  // components: {},
  // name: 'userInfo',
  data() {
    return {
      isSaving: false,
      add: "",
      fileUrl: `${FileApi}/file/upload`,
      tableData: [{ name: "000" }],
      dialogTableVisible: false,
      formDetail: { bdbm: "", sl: "", sxfl: "", bmrq: "" },
      disableFlag: false,
      ccOptions: [],
      xzOptions: [],
      isSubmit: false,
      lbList: [
        { value: "0", lable: "销售" },
        { value: "1", lable: "采购" },
      ],
      fileList: [],
      rules: {
        bdbm: [{ required: true, message: "请选择场次", trigger: "blur" }],
      },
    };
  },
  created() {
    // selectSceneList({ dwbm: sessionStorage.getItem('tyshxydm') }).then(
    // 	(res) => {
    // 		if (res.infoCode == 200) {
    // 			this.ccOptions = res.data
    // 		}
    // 	}
    // )
    // findByGroupId('LSXZ').then((res) => {
    // 	this.xzOptions = res.data
    // })
    let { state } = this.$route.query;

    this.disableFlag = state == "edit" ? false : true;
    if (state == "submit") {
      this.isSubmit = true;
      this.disableFlag = false;
    } else {
      this.isSubmit = false;
    }
    this.getDetail();
  },
  methods: {
    checkCall(rule, val, callback) {
      if (/^(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}$/.test(val) || val == "") {
        callback();
      } else {
        callback(new Error("请按正确电话号码格式填写"));
      }
    },
    getDetail() {
      let { jybm, ccbm } = this.$route.query;
      if (ccbm) {
        // this.disableFlag = true
        selectTransactionSignUpDetail({
          ccbm: ccbm,
          jybm: jybm,
        }).then((res) => {
          if (res.infoCode == 200) {
            let resp = res.data;
            // this.formDetail = resp.siteVO;
            this.formDetail = resp.transactionSignUpVO;
            // let ee = resp.entryAndExitOrderVO;
            let ts = resp.transactionSignUpVO || {};
            this.formDetail = {
              ...this.formDetail,
              jybm: jybm,
              shjg: ts.shztmc == "已驳回" ? "不通过" : "通过"
            };
            if (this.formDetail.fjid) {
              fileInfo(this.formDetail.fjid).then((res) => {
                this.fileList = res.data;
              });
            }
          }
        });
      } else {
        this.disableFlag = false;
        if (this.$route.query.state == "edit") {
          this.formDetail.bmrq = new Date();
          this.formDetail.dwbm = sessionStorage.getItem("tyshxydm");
          this.formDetail.dwmc = sessionStorage.getItem("orgName");
        }
      }
    },
    resetInfo(formName) {
      this.$refs[formName].resetFields();
      this.getList();
    },
    save(flag) {
      this.isSaving = true;
      this.$refs["formDetail"].validate((valid) => {
        if (valid) {
          this.formDetail.lsxzmc = getCodeName(
            this.formDetail.lsxz,
            this.xzOptions,
            "dictCode",
            "dictName"
          );
          this.formDetail.lslbmc = getCodeName(
            this.formDetail.lslb,
            this.lbList,
            "value",
            "lable"
          );
          let msg = "";
          if (flag == 0) {
            msg = "保存成功!";
            // this.formDetail.bmrq = ''
            this.formDetail.shzt = status1.toBeSubmit.value;
            this.formDetail.shztmc = status1.toBeSubmit.name;
          } else {
            msg = "提交成功!";
            this.formDetail.url = `/transaction/registrationFee/signupExamine/detail`;
            this.formDetail.itemQuery = JSON.stringify({
              state: "edit",
              idKey: "jybm",
              ccbm: this.formDetail.ccbm,
            });
            this.formDetail.itemQueryHaveDone = JSON.stringify({
              state: "detail",
              idKey: "jybm",
              ccbm: this.formDetail.ccbm,
            });
            this.formDetail.shzt = status1.toBeReview.value;
            this.formDetail.shztmc = status1.toBeReview.name;
          }
          // console.log(this.formDetail);
          let arr = [];
          this.fileList.map((item) => {
            if (item.response) {
              arr.push(item.response.data.id);
            } else {
              arr.push(item.id);
            }
          });
          this.formDetail.fjid = arr.join(",");
          updateTransactionSignUp(this.formDetail).then((res) => {
            if (res.infoCode == 200) {
              this.$message({
                message: msg,
                type: "success",
              });
              this.$router.push({ name: "seeTransactionSignup" });
            } else {
              this.isSaving = false;
            }
          });
        } else {
          this.isSaving = false;
        }
      });
    },
    returnList() {
      this.$router.push({ name: "seeTransactionSignup" });
    },
    getsxfInfo(val) {
      if (val) {
        selectFeeRateDetail({ clxzbm: val }).then((res) => {
          // console.log(res.data.sxfl)
          if (res.infoCode == 200) {
            this.formDetail.sxfl = res.data.sxfl ? res.data.sxfl : "";
          } else {
            this.$message({
              message: res.msg,
              type: "error",
            });
          }
        });
      } else {
        this.formDetail.sxfl = "";
      }
    },
    handleSuccess(res, file, fileList) {
      this.fileList = fileList;
      this.$message.success("上传成功！");
    },
    handleRemove(res, file) {
      this.fileList = file;
    },
    handlePreview(file, fileList) {
      document.location.href = `${FileApi}/file/download?id=${file.response ? file.response.data.id : file.id
        }`;
    },
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`, "提示");
    },
  },
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.line {
  border-bottom: 1px solid #000;
}
.title {
  margin-bottom: 20px;
  text-align: center;
  font-size: 16px;
}
.wrap {
  width: 100%;
  overflow: hidden;
}
.sub-title {
  width: 98%;
  text-align: center;
  font-size: 1em;
  line-height: 2.5em;
  color: #fff;
  background-color: #49a2fa;
  box-sizing: border-box;
  margin-bottom: 20px;
  position: relative;
}
.text {
  text-align: center;
}
.w90 {
  width: 90% !important;
}
</style>
