<template>
  <el-dialog
    :title="'采返商品详情'"
    :center="true"
    align="left"
    top="8vh"
    width="1040px"
    @close="showModelThis = false"
    :close-on-click-modal="false"
    :visible.sync="showModelThis"
    v-loading="loading"
    element-loading-text="拼命加载中"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)"
    append-to-body
  >
    <show-data-table
      style="margin: -20px 0 0 0"
      :sitem="sitem"
      :columns="costColumns"
      :border="true"
    >
      <template slot="supplierName">
        <span>{{ sitem.supplierName }}</span>

        <el-popover placement="top" width="300" trigger="hover">
          <ul>
            <li>
              <span>供应商编号：</span><span>{{ sitem.supplierNo }}</span>
            </li>
          </ul>
          <i class="el-icon-warning-outline fr" slot="reference"></i>
        </el-popover>
      </template>
      <template slot="good_name">
        <span>{{ sitem.good_name }}</span>
        <span v-for="(si, i) in sitem.specinfo" :key="si.spec_id + i">
          <span v-if="i !== 0">-</span>
          <span v-else>_</span>
          <span>{{ si.spec_name }}[{{ si.spec_value_name }}]</span>
        </span>
        <el-popover placement="top" width="300" trigger="hover">
          <ul>
            <li>
              <span>商品编号：</span><span>{{ sitem.spuCode }}</span>
            </li>
          </ul>
          <i class="el-icon-warning-outline fr" slot="reference"></i>
        </el-popover>
      </template>
      <template slot="cat">
        <span v-for="(si, i) in sitem.cat_info" :key="si.id + i">
          {{ i === 0 ? "" : "_" }}{{ si.name }}
        </span>
      </template>
      <template slot="send_way">
        <span>{{ sitem.send_way === "1" ? "供应商包邮" : "公司自提" }}</span>
      </template>

      <template slot="good_type">
        <el-tag
          :size="'mini'"
          v-text="
            (options1.find((item) => item.id == sitem.good_type) || {}).name || '--'
          "
        />
        <span v-if="sitem.good_type === '1'" style="padding: 0 0 0 5px"
          >{{ sitem.moq }}起订/工期{{ sitem.customized }}天</span
        >
      </template>
      <template slot="pay_way">
        <el-tag
          :size="'mini'"
          v-text="(options9.find((item) => item.id == sitem.pay_way) || {}).name || '--'"
        />
      </template>
      <template slot="supply_area">
        <el-tag
          :size="'mini'"
          v-text="
            (options6.find((item) => item.id == sitem.supply_area) || {}).name || '--'
          "
        />
      </template>

      <template slot="noble">
        <span v-if="sitem.noble_name"
          >{{ sitem.noble_weight ? sitem.noble_weight : "0" }}g-{{ sitem.noble_name }}-{{
            sitem.gold_price ? sitem.gold_price : "0"
          }}元/g-{{ sitem.is_gold_price === "0" ? "不" : "" }}启用实时金价-{{
            sitem.is_diff === "1" ? "有" : "无"
          }}工差-{{ sitem.config }}-{{ sitem.other_config }}</span
        >
        <span v-else>--</span>
      </template>
      <template slot="good_img">
        <img
          v-viewer
          style="width: 23px; height: 23px; margin: 0 5px 0 0"
          class="fl"
          v-for="(si, sii) in sitem.good_img"
          :key="si + sii"
          :src="si"
          alt=""
        />
      </template>
    </show-data-table>
  </el-dialog>
</template>

<script>
import {
  options1,
  options2,
  options3,
  options4,
  options5,
  options6,
  options7,
  options8,
  options9,
  costColumns,
} from "./columns";
import resToken from "@/mixins/resToken";
import asyncRequest from "@/apis/recovery";
export default {
  name: "showData",
  props: ["showModel", "bidNo"],
  mixins: [resToken],
  data() {
    return {
      newTime: "",
      loading: true,
      showModelThis: this.showModel,
      sitem: "",
      options1,
      options2,
      options3,
      options4,
      options5,
      options6,
      options7,
      options8,
      options9,
      costColumns,
    };
  },
  watch: {
    showModel: function (val) {
      this.showModelThis = val;
      if (val) {
        this.initData();
      }
    },
    showModelThis(val) {
      if (!val) {
        this.$emit("cancel");
      }
    },
  },

  methods: {
    async initData() {
      this.loading = true;
      const res = await asyncRequest.good_detail({
        bidNo: this.bidNo,
      });
      const { code, data, message } = await this.useResHandle(res, true);
      if (code === 0) {
        this.sitem = data;
        // const { good_img } = this.sitem;
        // if (good_img) {
        //   this.sitem.good_img = good_img.split(",");
        // } else {
        //   this.sitem.good_img = [];
        // }

        this.loading = false;
      }
    },
  },
};
</script>

<style></style>
