hfysite/pages/manger/product/info.vue

<script >
import langMap from "@/map/langMap";
import {apiMap} from "@/map/apiMap";
import {handle} from "@/until/handle";
import {rCode} from "@/map/rcodeMap_esm";
import {unescapeHtml} from "@/until/unescapeHtml";
import {timestampToTime} from "@/until/time";
import RoundedTitle from "@/components/public/roundedTitle.vue";

export default {
  name: "productInfoView",
  components: {RoundedTitle},
  data() {
    return {
      loading: false,
      productInfo: {},
      // 英文的产品信息
      productId: 0,
      lang: langMap.lang.zh,
      showImage: ''
    }
  },
  beforeMount() {
    this.productId = this.$route.query.id;
    this.loadProductInfo();
  },
  computed: {
  },
  methods: {
    async loadProductInfo() {
      let productId = this.productId;
      if (!productId) {
        this.$message.error('未获取到产品id');
        return;
      }
      this.loading = true;
      let url = apiMap.productInfo.path;
      url += `/${productId}?lang=${this.lang}`
      let [err, res] = await handle(this.$axios.get(url));
      this.loading = false;
      if (err) {
        this.$message.error('获取产品信息失败');
        return console.log(err);
      }
      let result = res.data;
      if (result.code !== rCode.OK) {
        this.$message.error(`获取产品信息失败,${result.msg}`)
        return
      }
      let data = result.data;
      data.showImage = data.image;
      this.productInfo = result.data;
    },
    deleteProduct(){

      this.$confirm({
        title: '删除产品',
        content: '是否删除该产品?',
        okText: '删除',
        okType: 'danger',
        cancelText: '取消',
        onOk: async () => {
          this.executeDelete();
        },
      });
    },
    async executeDelete() {
      let productId = this.productId;
      if (!productId) {
        this.$message.error('未获取到产品id');
        return;
      }
      let url = apiMap.productDelete.path;
      url += `?id=${productId}`
      let [err, res] = await handle(this.$axios.post(url, {
        id: productId
      }));
      if(err){
        this.$message.error(`删除产品失败, 出现异常:${err.message}`);
        return console.log(err);
      }
      let result = res.data;
      if (result.code !== rCode.OK) {
        this.$message.error(`删除产品失败,${result.msg}`)
        console.log(result)
        return
      }
      this.$message.success('删除产品成功');
      window.location.href = '/manger/product';
    },
    getLangText(str) {
      return langMap.getText(this.lang, str);
    },
  }
}
</script>

<template>
<div class="page p-2">
  <rounded-title class="text-xl flex justify-between">
    <a href="/manger/product">产品详情</a>

    <a :href="`/manger/product/edit?id=${productInfo.proid}`"
       class="edit-btn custom-btn btn-13">
      编辑
    </a>
    <a-button type="danger" @click="deleteProduct">
      删除产品
    </a-button>
  </rounded-title>
  <div class="product-show">
    <product-info
      :product="productInfo"
      :lang="lang"
      :productId="productId"
    />
  </div>

</div>
</template>

<style scoped>
.page{
  width: 100%;
  height: calc(100% - 60px);
}
.product-show{
  margin-top: 20px;
  width: 100%;
  height: calc(100% - 50px);
  overflow: auto;
  background-color: #fff;
  border-radius: 10px;
}
.edit-btn{
  font-size: 14px;
}


</style>