order-ui-pc/src/views/sellOut/bargainList/detail.vue

<template>
  <div class="bargainListDetail">
    <div
      class="bargainListDetail-main"
      v-if="powers && powers.length > 0 && powers.some((item) => item == '007')"
    >
      <el-tabs v-model="projectTabs">
        <el-tab-pane label="议价单详情" name="1">
          <el-collapse v-model="activeNames" style="margin: -18px 0 0 0">
            <el-collapse-item :title="'议价详情'" name="1">
              <show-data-table
                style="padding: -5px 0 10px 0"
                :newTime="newTime"
                v-if="newTime !== '' && queryType === 'view'"
                :sitem="sitem"
                :columns="editColumns"
              >
                <template slot="status">
                  <el-tag
                    :size="tablebtnSize"
                    v-text="
                      (options.find((item) => item.id == sitem.status) || {})
                        .label || '--'
                    "
                  ></el-tag>
                </template>

                <template slot="good_name">
                  <img
                    v-if="sitem.good_img"
                    :src="sitem.good_img"
                    class="fl hover"
                    v-viewer
                    style="
                      width: 23px;
                      height: 23px;
                      margin: 0;
                      vertical-align: top;
                    "
                    alt=""
                  />
                  <span style="vertical-align: top">{{ sitem.good_name }}</span>
                </template>
                <template slot="specinfo">
                  <span
                    v-for="(si, sii) in sitem.specinfo"
                    :key="si.specid + sii"
                  >
                    <span v-if="sii !== 0">--</span>{{ si.spec_name }}[{{
                      si.spec_value_name
                    }}]</span
                  >
                </template>
                <template slot="can">
                  <span v-for="(si, sii) in sitem.can" :key="si.id + sii">
                    <span v-if="sii !== 0">_</span>{{ si.name }}</span
                  >
                </template>
                <template slot="is_addrs">
                  <el-tag
                    :size="tablebtnSize"
                    v-text="
                      (
                        options12.find((item) => item.id == sitem.is_addrs) ||
                        {}
                      ).name || '--'
                    "
                  ></el-tag>
                </template>
                <template slot="is_custom">
                  <el-tag
                    :size="tablebtnSize"
                    v-text="
                      (
                        options1.find((item) => item.id == sitem.is_custom) ||
                        {}
                      ).name || '--'
                    "
                  ></el-tag>
                </template>
                <template slot="supply_area">
                  <el-tag
                    :size="tablebtnSize"
                    v-text="
                      (
                        options6.find(
                          (item) => item.id === sitem.supply_area
                        ) || {}
                      ).name || '--'
                    "
                  ></el-tag>
                </template>
                <template slot="pay_way">
                  <el-tag
                    :size="tablebtnSize"
                    v-text="
                      (options10.find((item) => item.id == sitem.pay_way) || {})
                        .name || '--'
                    "
                  ></el-tag>
                </template>
                <template slot="send_way">
                  <el-tag
                    :size="tablebtnSize"
                    v-text="
                      (
                        options11.find((item) => item.id == sitem.send_way) ||
                        {}
                      ).name || '--'
                    "
                  ></el-tag>
                </template>

                <template slot="good_num">
                  <span
                    >{{ sitem.good_num ? sitem.good_num : "0"
                    }}{{ sitem.unit }}</span
                  >
                </template>
                <template slot="metal_id">
                  <span v-if="sitem.metal_id"
                    >{{ sitem.noble_weight ? sitem.noble_weight : "0" }}g---{{
                      sitem.metal_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>
              </show-data-table>

              <show-data-table
                style="padding: -5px 0 10px 0"
                :newTime="newTime"
                v-if="newTime !== '' && queryType === 'view'"
                :sitem="sitem"
                :columns="costArr"
              >
              </show-data-table>
              <show-data-table
                style="padding: -5px 0 10px 0"
                :newTime="newTime"
                v-if="newTime !== '' && queryType === 'view'"
                :sitem="sitem"
                :columns="bargainingArr"
              >
              </show-data-table>
            </el-collapse-item>
            <el-collapse-item
              title="业务部门审批"
              name="2"
              v-if="status == '0' && powers.some((item) => item == '043')"
            >
              <exam-formss
                :statusList="[]"
                :newTime="newTime"
                :disabled="false"
                :isMust="false"
                
                @searchChange="examForm($event, 1, '业务部门')"
              />
            </el-collapse-item>
            <el-collapse-item
              title="财务专员审批"
              name="3"
              v-if="status == '2' && powers.some((item) => item == '058')"
            >
              <exam-formss
                :statusList="[]"
                :newTime="newTime"
                :remarkTxt="sitem.remark"
                remarkTitle="业务主管"
                :disabled="false"
                :isMust="false"
                @searchChange="examForm($event, 2, '财务专员')"
              />
            </el-collapse-item>
            <el-collapse-item
              title="财务主管审批"
              name="4"
              v-if="status == '4' && powers.some((item) => item == '059')"
            >
              <exam-formss
                :statusList="[]"
                :newTime="newTime"
                :remarkTxt="sitem.remark"
                remarkTitle="财务专员"
                :disabled="false"
                :isMust="false"
                @searchChange="examForm($event, 3, '财务主管')"
              />
            </el-collapse-item>

            <el-collapse-item
              title="BOSS审批"
              name="5"
              v-if="status == '7' && powers.some((item) => item == '084')"
            >
              <exam-formss
                :statusList="[]"
                :newTime="newTime"
                :disabled="false"
                :remarkTxt="sitem.remark"
                remarkTitle="财务主管"
                :isMust="false"
                @searchChange="examForm($event, 7, 'BOSS')"
              />
            </el-collapse-item>

            <el-collapse-item
              title="驳回意见详情"
              name="6"
              v-if="
                status == '3' ||
                status == '5' ||
                status == '8' ||
                status == '11'
              "
            >
              <exam-formss
                :statusList="[]"
                :newTime="newTime"
                flag="0"
                :remarkTxt="sitem.remark"
                remarkTitle="驳回详情"
              />
            </el-collapse-item>
          </el-collapse>
        </el-tab-pane>
        <el-tab-pane label="审批记录" name="3">
          <process-time-line
            v-if="newTime !== ''"
            :newTime="newTime"
            :type="'YJD'"
            :orderCode="queryId"
          />
        </el-tab-pane>
      </el-tabs>
    </div>
    <div v-else>
      <no-auth></no-auth>
    </div>
  </div>
</template>
   <script>
import examFormss from "./exam-form/main.vue";
import asyncRequest from "@/apis/service/sellOut/bargainList";
import resToken from "@/mixins/resToken";
import { mapGetters } from "vuex";

import {
  editColumns,
  costArr,
  bargainingArr,
  options1,
  options2,
  options3,
  options4,
  options5,
  options6,
  options7,
  options8,
  options9,
  options10,
  options11,
  options12,
} from "./columns";
export default {
  components: {
    examFormss,
  },
  name: "bargainListDetail",
  mixins: [resToken],
  computed: {
    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
    powers() {
      let tran =
        this.$store.getters.btnList.find(
          (item) => item.menu_route == "bargainListDetail"
        ) || {};
      if (tran && tran.action && tran.action.length > 0) {
        return tran.action;
      } else {
        return [];
      }
    },
  },

  data() {
    return {
      statusList: [],
      size: "small",
      costArr: costArr,
      bargainingArr: bargainingArr,
      editColumns: editColumns,
      options1: options1,
      options2: options2,
      options3: options3,
      options4: options4,
      options5: options5,
      options6: options6,
      options7: options7,
      options8: options8,
      options9: options9,
      options10: options10,
      options11: options11,
      options12: options12,
      projectTabs: "1",
      activeNames: ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"],
      newTime: "",
      loading: false,
      queryType: "",
      queryId: "",
      status: "",
      sitem: null,
      options: [
        // 0待业务主管审核
        { id: "0", label: "待业务主管审核", type: "" },
        { id: "1", label: "业务主管审核通过", type: "" },
        //  2 业务税率未通过直接财务专员审批
        // { id: "2", label: "业务税率未通过", type: "" },
        { id: "2", label: "待财务专员审批", type: "" },
        { id: "3", label: "业务驳回", type: "" },
        // { id: "4", label: "专员通过", type: "" },
        // 4 专员通过后直接财务主管审核
        { id: "4", label: "待财务主管审核", type: "" },
        { id: "5", label: "专员驳回", type: "" },
        { id: "6", label: "财务通过", type: "" },
        // { id: "7", label: "财务税率未通过", type: "" },
        // 7 财务税率未通过直接BOSS审批
        { id: "7", label: "待BOSS审批", type: "" },
        { id: "8", label: "财务驳回", type: "" },
        { id: "9", label: "boss通过", type: "" },
        { id: "10", label: "boss税率越线通过", type: "" },
        { id: "11", label: "boss驳回", type: "" },

        // 0待审核 1业务主管审核通过
        //  2 业务税率未通过 3 业务驳回 4 专员通过
        //  5 专员驳回 6 财务通过 7 财务税率未通过
        //  8财务驳回 9 boss通过 10 boss 税率越线通过 11 boss驳回
      ],
    };
  },
  mounted() {
    this.initForm();
  },
  methods: {
    async initForm() {
      const { id, type } = this.$route.query;
      this.queryId = id;
      this.queryType = type;
      this.projectTabs = "1";
      this.loading = true;
      await this.initData();
      this.loading = false;
    },

    handleClick(row) {
      console.log(row);
    },
    async refresh() {
      this.routeReGoto("bargainList", {});
    },
    async initData() {
      this.loading = true;
      const { code, message, data } = await asyncRequest.detail({
        bargainNo: this.queryId,
      });

      this.loading = false;
      if (code === 0) {
        this.sitem = JSON.parse(JSON.stringify(data));
        const { status, can } = this.sitem;

        // if (can && can.length > 0) {
        //   let cat_id = [];
        //   can.forEach((e) => {
        //     cat_id.push(e.id);
        //   });
        //   this.sitem.cat_id = cat_id;
        // } else {
        //   this.sitem.cat_id = [];
        // }

        this.status = status;
        console.log("当前对应状态", this.status);
        console.log("当前数据",this.sitem)
        console.log(JSON.parse(JSON.stringify(this.sitem.exam_info)))
        console.log(JSON.parse(this.sitem.exam_info))
        
        this.getNewTime();
      } else if (code >= 100 && code <= 104) {
        await this.logout();
      } else {
        this.$message.warning(message);
      }
    },
    getNewTime() {
      this.newTime = new Date().valueOf();
    },

    // 点击业务审核的保存按钮

    async examForm(e, type, title) {
      console.log(e, type, title);
      if (!this.loading) {
        let model = {
          bargainNo: this.queryId,
          status: e.state,
          // remark: e.state === "1" ? "" : e.remark,
          remark: e.remark,
        };

        // if (type === 1) {
        //   model.status = e.state === "1" ? "2" : "5";
        // } else if (type === 2) {
        //   model.status = "3";
        // }else if (type === 3) {
        //   model.status = "8";
        // }else if (type === 8) {
        //   model.status = e.state === "1" ? "4" : "9";
        // }   else {
        //   model.status = e.state === "1" ? "4" : "6";
        // }

        return;
        await this.setstatus(`提交${title}审核`, model);
      }
    },
    async setstatus(detail, model) {
      //if(this.sitem.status == BOSS 并且 最低售价越过红线)
      //需要补充逻辑字段
      if (this.sitem.status == 7) {
        await this.$confirm(
          `当前最低售价为${this.sitem.lower_price}确定要继续吗？`,
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }
        )
          .then(async () => {
            await this.$confirm(`确定要${detail}？`, {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            })
              .then(async () => {
                let res = await asyncRequest.status(model);
                console.log("res", res);
                if (res && res.code === 0) {
                  this.$notify.success({
                    title: "提交成功！",
                    message: "",
                  });
                  await this.initForm();
                } else if (res && res.code >= 100 && res.code <= 104) {
                  await this.logout();
                } else {
                  this.$message.warning(res.message);
                }
              })
              .catch(() => {
                console.log("取消");
              });
          })
          .catch(() => {
            console.log("取消");
          });
      } else {
        await this.$confirm(`确定要${detail}？`, {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(async () => {
            let res = await asyncRequest.status(model);
            console.log("res", res);
            if (res && res.code === 0) {
              this.$notify.success({
                title: "提交成功！",
                message: "",
              });
              await this.initForm();
            } else if (res && res.code >= 100 && res.code <= 104) {
              await this.logout();
            } else {
              this.$message.warning(res.message);
            }
          })
          .catch(() => {
            console.log("取消");
          });
      }
    },
  },
};
</script>
   <style lang="scss" scoped>
.bargainListDetail {
  position: relative;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  .bargainListDetail-main {
    position: relative;
    padding: 10px;
    height: 100%;
    width: 100%;
  }
  .bargainListDetail-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: 12px 0 0 0;
    }
  }
  /deep/ .dmain {
    padding: 20px 0 0 0;
    width: calc(100% - 40px);
    border-left: 1px solid #dcdfe6;
  }
}
</style>