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

<template>
  <div class="zixunOrderDetail">
    <div
      class="zixunOrderDetail-main"
      v-if="powers && powers.length > 0 && powers.some((item) => item == '007')"
    >
      <show-data-table
        style="padding: 10px 0 5px 0"
        :newTime="newTime"
        border
        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>
          <el-tooltip
            effect="dark"
            content="停止招标任务"
            placement="top"
            v-if="sitem.status === '1' && powers.some((item) => item == '066')"
          >
            <i
              class="el-icon-video-pause hover"
              style="margin: 0 0 0 10px"
              @click="changeStatus('7')"
            ></i>
          </el-tooltip>
          <el-tooltip
            effect="dark"
            content="启动招标任务"
            placement="top"
            v-if="
              (sitem.status === '7' || sitem.status === '2') &&
              powers.some((item) => item == '067')
            "
          >
            <i
              class="el-icon-video-play hover"
              style="margin: 0 0 0 10px"
              @click="changeStatus('1')"
            ></i>
          </el-tooltip>
        </template>

        <template slot="departinfo">
          <span>{{ sitem.salesman }}--</span>
          <span v-for="(si, sii) in sitem.departinfo" :key="si + sii"
            ><span v-if="sii !== 0">/</span>{{ si.name }}</span
          >
        </template>
      </show-data-table>
      <el-tabs v-model="projectTabs">
        <el-tab-pane label="新建咨询单" name="0" v-if="queryType === 'add'">
          <add-form
            v-if="newTime !== ''"
            :newTime="newTime"
            :id="queryId"
            :type="queryType"
            :sitem="sitem"
            @refresh="refresh"
          />
        </el-tab-pane>
        <el-tab-pane label="咨询单详情" name="1" v-if="queryType !== 'add'">
          <edit-form
            v-if="newTime !== ''"
            :newTime="newTime"
            :id="queryId"
            :type="queryType"
            :sitem="sitem"
            @refresh="refresh"
          />
        </el-tab-pane>
        <el-tab-pane label="反馈情况" name="2" v-if="queryType == 'view'">
          <feedback-list
            v-if="newTime !== ''"
            :newTime="newTime"
            :sitem="sitem"
            :id="queryId"
            @resGoodOk="initForm()"
          />
        </el-tab-pane>
        <el-tab-pane label="审批记录" name="3" v-if="queryType == 'view'">
          111
        </el-tab-pane>
      </el-tabs>
    </div>
    <div v-else>
      <no-auth></no-auth>
    </div>
  </div>
</template>
   <script>
import asyncRequest from "@/apis/service/sellOut/zixunOrder";
import resToken from "@/mixins/resToken";
import { mapGetters } from "vuex";
import addForm from "./components/addEditForm";
import editForm from "./components/editForm";
import feedbackList from "./components/feedbackList";
import { editColumns } from "./components/ShowDataTableColumns";

export default {
  name: "zixunOrderDetail",
  mixins: [resToken],
  components: {
    addForm,
    editForm,
    feedbackList,
  },
  
  computed: {
    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
    powers() {
      let tran =
        this.$store.getters.btnList.find(
          (item) => item.menu_route == "zixunOrderDetail"
        ) || {};
      if (tran && tran.action && tran.action.length > 0) {
        return tran.action;
      } else {
        return [];
      }
    },
  },

  data() {
    return {
      statusList: [],
      size: "small",
      editColumns: editColumns,
      projectTabs: "1",
      projectNames: ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"],
      newTime: "",
      loading: false,
      queryType: "",
      queryId: "",
      status: "",
      sitem: null,
      options: [
        { id: "0", label: "待发布竞标" },
        { id: "1", label: "招标进行中" },
        { id: "2", label: "招标已结束" },
        { id: "3", label: "待选择商品" },
        { id: "4", label: "已选商品待下单" },
        { id: "5", label: "已成功转单" },
        { id: "6", label: "已取消转单" },
        { id: "7", label: "招标已暂停" },
      ],
    };
  },
  mounted() {
    this.initForm();
  },
  methods: {
    async initForm() {
      const { id, type } = this.$route.query;
      this.queryId = id;
      this.queryType = type;
      this.projectTabs = type === "add" ? "0" : "1";
      this.loading = true;
      if (this.queryType === "add") {
        this.sitem = {};
        this.getNewTime();
      } else {
        await this.initData();
      }

      this.loading = false;
    },

    handleClick(row) {
      console.log(row);
    },
    async refresh() {
      this.routeReGoto("zixunOrder", {});
    },
    async initData() {
      this.loading = true;
      const { code, message, data } = await asyncRequest.detail({
        infoNo: this.queryId,
      });
      this.loading = false;
      console.log(data);
      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;
        this.getNewTime();
      } else if (code >= 100 && code <= 104) {
        await this.logout();
      } else {
        this.$message.warning(message);
      }
    },
    getNewTime() {
      this.newTime = new Date().valueOf();
    },
    /**
     * 停止招标任务
     * @param {String} id id
     * @param {String} status 0-禁用 1-启用
     */
    async changeStatus(status) {
      await this.$confirm(
        status === "7" ? `确定要停止招标任务么？` : "确定要重启招标任务么？",
        status === "7" ? "" : "重启需要重新编辑咨询信息",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(async () => {
          if (status === "7") {
            this.loading = true;
            let model = {
              infoNo: this.queryId,
              status: status,
            };
            const res = await asyncRequest.status(model);
            console.log(res);
            this.loading = false;
            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);
            }
          } else {
            let model = {
              id: this.queryId,
              type: "edit",
            };
            this.routeReGoto("zixunOrderDetail", model);
            location.reload();
          }
        })
        .catch(() => {
          console.log("取消");
        });
    },
    // 点击业务审核的保存按钮

    async examForm(e) {
      console.log(e);
      if (!this.loading) {
        let model = {
          activity_code: this.queryId,
          status: e.state === "1" ? "1" : "8",
          remark: e.remark,
        };
        await this.setstatus("提交产品部门审核", model);
      }
    },
    async setstatus(detail, model) {
      await this.$confirm(`确定要${detail}？`, {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(async () => {
          let res = await asyncRequest.actstatus(model);
          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>
.zixunOrderDetail {
  position: relative;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  .zixunOrderDetail-main {
    position: relative;
    padding: 10px;
    height: 100%;
    width: 100%;
  }
  .zixunOrderDetail-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>