<template>
  <div class="finance-exam-one-form">
    <el-table
      :data="tableData"
      stripe
      border
      :size="'mini'"
      style="width: 100%"
    >
      <el-table-column
        prop="skuCode"
        label="商品编码"
        show-overflow-tooltip
        width="170"
      />
      <el-table-column
        prop="good_name"
        label="商品名称"
        show-overflow-tooltip
      />
      <el-table-column
        prop="activity_stock"
        label="活动库存"
        width="100"
        show-overflow-tooltip
      />
      <el-table-column
        prop="moq_num"
        label="起订量"
        width="100"
        show-overflow-tooltip
      />
      <el-table-column
        prop="cost_price"
        label="成本单价(元)"
        width="100"
        show-overflow-tooltip
      />

      <el-table-column fixed="right" width="80">
        <template slot="header" slot-scope="scope">
          <span>操作</span>
        </template>
        <template slot-scope="scope">
          <el-tooltip effect="dark" content="编辑成本" placement="top">
            <i class="el-icon-edit tb-icon" @click="openModal(scope.row)"></i>
          </el-tooltip>
          <el-tooltip effect="dark" content="查看商品信息" placement="top">
            <i
              class="el-icon-view tb-icon"
              @click="showGoodModelFun(scope.row.skuCode)"
            ></i>
          </el-tooltip>
        </template>
      </el-table-column>
    </el-table>
    <edit-minorder-form
      :sitem="sfinditem"
      :showModel="showModel"
      @refresh="editRefresh"
      @cancel="showModel = false"
    />
    <show-good-data-modal
      :show-model="showGoodModel"
      :skuCode="showGoodId"
      @cancel="showGoodModel = false"
    />
    <el-col
      :span="24"
      style="
        text-align: right;
        padding: 15px 0 15px 0;
        border-top: 1px solid #dcdfe6;
      "
    >
      <el-button :size="'mini'" type="primary" @click="submitForm"
        >保 存
      </el-button>
    </el-col>
  </div>
</template>
   <script>
import asyncRequest from "@/apis/service/goodStore/active";
import showGoodDataModal from "@/components/show-good-data-modal";
import resToken from "@/mixins/resToken";
import { mapGetters } from "vuex";
import editMinorderForm from "./edit-minorder-form";
export default {
  name: "financeExamOneForm",
  mixins: [resToken],
  props: ["id", "type", "sitem", "newTime"],
  computed: {
    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
  },
  components: {
    editMinorderForm,
    showGoodDataModal,
  },
  data() {
    return {
      status: "",
      showGoodModel: false,
      showGoodId: "",
      loading: false,
      showModel: false,
      sfinditem: {},
      tableData: [],
    };
  },
  mounted() {
    this.initForm();
  },
  watch: {
    newTime: function (val) {
      if (val) {
        this.initForm();
      }
    },
  },
  methods: {
    async initForm() {
      this.loading = true;
      this.resetFormData();
      this.loading = false;
    },
    editRefresh(e) {
      this.showModel = false;
      const { skuCode, moq_num, cost_price } = JSON.parse(JSON.stringify(e));
      const aindex = this.tableData.findIndex((eis) => eis.skuCode === skuCode);
      if (aindex !== -1) {
        this.tableData[aindex].moq_num = moq_num;
        this.tableData[aindex].cost_price = cost_price;
      }
      this.tableData.forEach((s, i) => {
        this.$set(this.tableData, i, this.tableData[i]);
      });
    },
    showGoodModelFun(skuCode) {
      this.showGoodModel = true;
      this.showGoodId = skuCode;
    },
    openModal(e) {
      this.sfinditem = JSON.parse(JSON.stringify(e));
      this.showModel = true;
    },
    resetFormData() {
      this.tableData = [];
      const { info, status } = this.sitem;

      this.status = status || "";
      this.tableData =
        info && info.length > 0 ? JSON.parse(JSON.stringify(info)) : [];
    },
    openEdit(e) {
      console.log("2345");
    },
    async submitForm() {
      if (!this.loading) {
        this.loading = true;
        const { activity_code } = this.sitem;
        let ruleForm = {
          activity_code: activity_code || "",
          good_list: [],
        };
        let list = JSON.parse(JSON.stringify(this.tableData));
        let isok = true;
        let newlist = [];
        list.forEach((e) => {
          if (e.moq_num + "" === "0" || e.moq_num + "" === "") {
            isok = false;
          }
          let item = {
            id: e.id,
            skuCode: e.skuCode,
            cost_price: e.cost_price,
            moq_num: e.moq_num,
          };
          newlist.push(item);
        });
        if (!isok) {
          this.$message.warning("部分商品起订量不合法！");
          this.loading = false;
          return;
        }
        ruleForm.good_list = JSON.parse(JSON.stringify(newlist));
        let res = await asyncRequest.actcost(ruleForm);
        this.loading = false;
        if (res && res.code === 0) {
          this.$notify.success({
            title: "提交成功！",
            message: "",
          });
          // 刷新
          this.$emit("refresh", true);
        }
      }
    },
  },
};
</script>
   <style lang="scss" scoped>
.activeAdd {
  .activeAdd-title {
    border-top: 1px solid #ebeef5;
    span {
      height: 50px;
      line-height: 50px;
      font-family: "微软雅黑", sans-serif;
      font-weight: 400;
      font-style: normal;
      font-size: 16fpx;
      text-align: left;
    }
  }
  /deep/ .ddiv {
    border-top: 1px solid #dcdfe6;
  }
  /deep/ .dtitle {
    width: 40px;
    text-align: center;
    height: 100%;
    min-height: 100%;
    ul {
      padding: 20px 0 0 0;
    }
  }
  /deep/ .dmain {
    padding: 20px 0 0 0;
    width: calc(100% - 40px);
    border-left: 1px solid #dcdfe6;
  }
}
</style>
   