<template>
  <div class="content-detail">
    <el-form :inline="true" :model="detailForm" ref="detailForm">
      <el-row>
        <el-form-item label="交易性质" label-width="150px" required>
          <el-radio-group
            v-model="detailForm.jylx"
            :disabled="isView"
            @change="handleTradeTypeChange"
            class="input-w"
          >
            <el-radio :label="0">采购</el-radio>
            <el-radio :label="1">销售</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="品种" label-width="150px" required prop="pzbm">
          <el-select
            v-model="detailForm.pzbm"
            :rules="[
              { required: true, message: '请选择品种', trigger: ['change'] },
            ]"
            clearable
            placeholder="请选择品种"
            @change="hanldeTypesChange"
            :disabled="isView"
            class="input-w"
          >
            <el-option
              v-for="item in variety"
              :key="item.dictCode"
              :label="item.dictName"
              :value="item.dictCode"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-row>
      <el-row>
        <el-form-item label="委托编号" label-width="150px" required>
          <el-input
            v-model="detailForm.wtbh"
            disabled
            class="input-w"
          ></el-input>
        </el-form-item>
        <!-- wtfbm -->
        <el-form-item label="委托方" label-width="150px" required>
          <el-input
            v-model="detailForm.wtfmc"
            disabled
            class="input-w"
          ></el-input>
        </el-form-item>
      </el-row>
      <el-row>
        <el-form-item label="交割日期" label-width="150px" required prop="jgrq">
          <el-date-picker
            v-model="detailForm.jgrq"
            :rules="[
              {
                required: true,
                message: '请选择交割日期',
                trigger: ['change'],
              },
            ]"
            :disabled="isView"
            type="date"
            value-format="yyyy-MM-dd"
            class="input-w"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="交易日期" label-width="150px" required prop="jyrq">
          <el-date-picker
            v-model="detailForm.jyrq"
            :rules="[
              {
                required: true,
                message: '请选择交易日期',
                trigger: ['change'],
              },
            ]"
            :disabled="isView"
            type="date"
            value-format="yyyy-MM-dd"
            class="input-w"
          ></el-date-picker>
        </el-form-item>
      </el-row>
      <el-row>
        <!-- <el-form-item label="损耗计算方式" label-width="150px" required>
					<el-radio-group
						v-model="detailForm.jsfs"
						:disabled="isView"
						@change="handleWayChange"
						class="input-w"
					>
						<el-radio :label="0">先算</el-radio>
						<el-radio :label="1">后算</el-radio>
					</el-radio-group>
				</el-form-item> -->
        <el-form-item label="粮食性质" label-width="150px" required>
          <el-select
            v-model="detailForm.lsxzbm"
            clearable
            placeholder="请选择粮食性质"
            @change="hanldePropertyChange"
            :disabled="isView"
            class="input-w"
          >
            <el-option
              v-for="item in properties"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-row>
      <el-row
        style="
          width: 80%;
          margin: 0 auto;
          border: 1px solid #f5f7fa;
          border-radius: 6px;
          padding: 20px;
          background-color: white;
        "
      >
        <el-input
          v-html="detailForm.wbnr"
          type="textarea"
          :autosize="{ minRows: 5 }"
          :disabled="isView"
        ></el-input>
      </el-row>
      <el-row v-if="isConfirm">
        <el-form-item label="接受委托" label-width="150px" required>
          <el-radio-group
            v-model="detailForm.sfjs"
            :disabled="!isConfirm"
            @change="handleWayChange"
            class="input-w"
          >
            <el-radio :label="0">确认</el-radio>
            <el-radio :label="1">驳回</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-row>
      <el-row v-if="isConfirm">
        <el-form-item
          label="意见"
          label-width="150px"
          required
          class="textarea"
        >
          <el-input
            v-model="detailForm.wbnr"
            :autosize="{ minRows: 3 }"
            type="textarea"
          ></el-input>
        </el-form-item>
      </el-row>
    </el-form>
    <el-row style="text-align: center; margin-top: 20px">
      <el-button
        v-if="!isView"
        @click="handleSave"
        class="iconfont iconbaocun"
        type="primary"
        size="small"
      >
        保存</el-button
      >
      <el-button
        v-if="isConfirm"
        @click="handleConfirm"
        class="iconfont iconbaocun"
        type="primary"
        size="small"
      >
        保存
        <!--确认-->
      </el-button>
      <el-button
        v-if="isConfirm"
        @click="handleConfirmAndSubmit"
        class="iconfont iconbaocun"
        type="primary"
        size="small"
      >
        保存并发布
        <!--确认并发布-->
      </el-button>
      <el-button
        v-if="!isView"
        @click="handleSubmit"
        class="iconfont icontijiao"
        type="primary"
        size="small"
      >
        提交</el-button
      >
      <el-button
        @click="$router.push('index')"
        class="iconfont iconfanhui"
        type="primary"
        size="small"
      >
        返回</el-button
      >
    </el-row>
  </div>
</template>

<script>
import {
  varietys,
  insert,
  update,
  detail,
} from "@/api/transaction/tradeEntrust/outInDepotEntrust/index.js";

export default {
  data() {
    return {
      detailForm: {
        jylx: 0,
        jsfs: 0,
        sfjs: 0, // 接受委托
        wtbh: new Date().getFullYear() + "CG",
        wtfmc: window.sessionStorage.getItem("orgName"),
        wtfbm: window.sessionStorage.getItem("orgCode"),
        tbr: window.sessionStorage.getItem("userName"),
        tbr: window.sessionStorage.getItem("userName"),
        jsfsmc: "先算",
        jylxmc: "采购",
        wbnr: "",
      },
      variety: [], // 品种列表
      properties: [
        { label: "市级储备粮", value: "2" },
        { label: "区级储备粮", value: "3" },
        { label: "贸易粮", value: "4" },
      ], // 粮食性质列表
      isEdit: false,
      isView: false,
      isConfirm: false,
      wtbm: "", // 主键
    };
  },
  created() {
    // 0 新增 1 修改 2 详情查看 3 确认 4 发布 5 公告
    let { state, wtbm } = this.$route.query;
    this.wtbm = wtbm;
    if (state == 1) this.isEdit = true;
    if (state == 2) this.isView = true;
    if (state == 3) {
      this.isView = true;
      this.isConfirm = true;
    }
    if (state != 0) this.getDetail();
    this.getTypes();
  },
  methods: {
    hanldePropertyChange(val) {
      var cur = this.properties.filter((item) => item.value == val)[0];
      this.detailForm.lsxzmc = cur.label;
    },
    handleConfirmAndSubmit() {
      this.detailForm.zt = "91000018";
      this.detailForm.ztmc = "已确认";
      this.update(true);
    },
    handleConfirm() {
      this.detailForm.zt = "91000018";
      this.detailForm.ztmc = "已确认";
      this.update();
    },
    async getDetail() {
      var res = await detail(this.wtbm);
      if (res && res.infoCode === 200) {
        this.detailForm = res.data;
        if (!res.data.sfjs) {
          this.detailForm.sfjs = 0;
        }
      }
    },
    handleWayChange(val) {
      this.detailForm.jsfsmc = val == 0 ? "先算" : "后算";
    },
    hanldeTypesChange(val) {
      var type = this.variety.filter((item) => item.dictCode == val)[0];
      this.detailForm.pzmc = type.dictName;
    },
    handleTradeTypeChange(val) {
      this.detailForm.jylxmc = val == 0 ? "采购" : "销售";
      var year = new Date().getFullYear();
      this.detailForm.wtbh = year + (val == 0 ? "CG" : "XS");
    },
    handleSave() {
      this.detailForm.zt = "91000001";
      this.detailForm.ztmc = "待提交";
      if (this.isEdit) {
        this.update();
        return;
      }
      this.insert();
    },
    insert() {
      insert({
        ...this.detailForm,
      }).then((res) => {
        if (res.infoCode === 200) {
          this.$message.success(res.msg);
          this.$router.push("index");
          return;
        }
        this.$message.error(res.msg);
      });
    },
    update(isPublish = false) {
      update({
        ...this.detailForm,
      }).then((res) => {
        if (res.infoCode === 200) {
          this.$message.success(res.msg);
          if (isPublish) {
            this.$router.push("publish");
            return;
          }
          this.$router.push("index");
          return;
        }
        this.$message.error(res.msg);
      });
    },
    handleSubmit() {
      this.detailForm.zt = "91000004";
      this.detailForm.ztmc = "已提交";
      if (this.isEdit) {
        this.update();
        return;
      }
      this.insert();
    },
    getTypes() {
      varietys(11).then((res) => {
        this.variety = res.data;
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.content-detail {
  padding: 20px;
  width: 80%;
  margin: 0 auto;

  .input-w {
    width: 200px;
  }

  .textarea {
    width: 100%;

    /deep/ .el-form-item__content {
      min-width: 50%;
    }
  }
}
</style>
