chuchuManage/src/HDrpManagement/promotion/modules/detail.vue

<template>
  <div>
    <basicDetails
        ref="details"
        :titleText="mainData.promnum"
        :editData="mainData"
        :mainAreaData="mainAreaData"
        :turnPageId="20221230144803"
        :delApiId="20221230144903"
        idname="sa_promotionid"
        ownertable="sa_promotion"
        tags=""
        :tabs="['促销商品','授权范围','详细信息']"
        :statusCheck="[{key:'status',value:'审核'},{key:'status',value:'发布'}]"
        @pageChange="pageChange"
        @onEditSuccess="queryMainData($route.query.id)">
      <div slot="customOperation">
        <Edit class="inline-16" :data="mainData" v-if="tool.checkAuth($route.name,'update') && mainData.status == '新建'" @onSuccess="queryMainData"></Edit>
        <Check 
          :data="mainData" 
          class="inline-16" 
          @onSuccess="queryMainData" 
          v-if="mainData.status != '发布'"
        />
        <Send :data="mainData" class="inline-16" @onSuccess="queryMainData" v-if="mainData.status != '关闭' || mainData.status != '新建'"/>
        <Close :data="mainData" class="inline-16" @onSuccess="queryMainData"/>
      </div>
      <div slot="slot0" >
        <productDetail :data="mainData" ref="productDetail">
          <template v-slot:promotionPrice="scope">
              <promotion-price :data="scope.data" ref="promotionPrice">
                <template v-slot:editPrice="scope2">
                    <el-button type="text" size="mini" @click="$refs.promotionPrice.currentProduct = scope2.data">编 辑</el-button>
                </template>
              </promotion-price>
          </template>
          <template v-slot:addProduct="scope">  
            <add-product :data="mainData" @onSuccess="$refs.productDetail.listData(scope.data.data.sa_promotion_itemgroupid)"></add-product>
            <calcPrice 
              class="inline-16" 
              :data="scope.data.selectRow" 
              @onSuccess="$refs.productDetail.$refs.selectTable.$refs.tables.clearSelection();$refs.productDetail.$refs.selectTable.allArr=[];$refs.productDetail.selectRow=[]"
            ></calcPrice>
            <importFile 
              ref="importFile" 
              class="inline-16" 
              :bindData="{ownertable:'sa_promotionid',ownerid:$route.query.id,usetype:'default'}" 
              :errorUrl="errorUrl" 
              @clearUrl="errorUrl = null" 
              @onSuccess="bindImportOrder"
            ></importFile>
          </template>
          <template v-slot:delProduct="scope">
            <el-button :disabled="!isEdit" type="text" size="mini" @click="productDel(scope.data)">删 除</el-button>
          </template>
        </productDetail>
      </div>
      <div slot="slot1">
        <prowerArea ref="prowerArea" :data="mainData">
          <template v-slot:editArea="scope">
              <el-button v-if="tool.checkAuth($route.name,'prowerArea')" class="inline-16" size="mini" type="text" @click="$refs.prowerArea.currentArea=scope.data">编 辑</el-button>
          </template>
          <template v-slot:delArea="scope">
            <delete-btn
               v-if="tool.checkAuth($route.name,'prowerArea')"
              message="确定删除当前授权吗?"
              class="inline-16"
              :id="scope.data.sa_promotion_authid" 
              nameId="20230102103003" 
              nameKey="sa_promotion_authids"
              @deleteSuccess="$refs.prowerArea.listData()"></delete-btn>
          </template>
          <add-prower-area v-if="tool.checkAuth($route.name,'prowerArea')" @onSuccess="$refs.prowerArea.listData()" slot="addProwerArea"></add-prower-area>
        </prowerArea>
      </div>
      <div slot="slot2" >
        <base-info v-if="detailInfo" :data="detailInfo"></base-info>
      </div>
    </basicDetails>
  </div>
</template>

<script>
import Edit from '@/Form/promotion/edit'

import BaseInfo from '@/components/detailInfo/index.vue'
import Check from '../components/check'
import Send from '../components/send'
import Close from '../components/close.vue'
import promotionModel from './productModel/index.vue'
import addModel from './productModel/add.vue'
import productDetail from './productModel/productDetail.vue'
import promotionPrice from './productModel/promotionPrice'
import calcPrice from './productModel/calcPrice'
import addProduct from './productModel/addProduct.vue'

import prowerArea from './prowerArea/index.vue'
import addProwerArea from './prowerArea/addPowerArea'

import importFile from './productModel/importFile.vue'
export default {
  name: "index",
  components:{Edit,BaseInfo,Check,Send,Close,promotionModel,addModel,productDetail,promotionPrice,calcPrice,addProduct,prowerArea,addProwerArea,importFile},
  data(){
    return {
      mainData:'',
      mainAreaData:[],
      detailInfo:'',
      isEdit:false,
      errorUrl:''
    }
  },
  provide () {
    return {
      isEdit: () => this.isEdit
    }
  },
  methods:{
    async queryMainData(id){
      const res = await this.$api.requested({
        "id": "20221230144703",
        "version":1,
        "content": {
          "sa_promotionid":this.$route.query.id
        }
      })
      this.mainData = res.data
      console.log(this.mainData);
      this.isEdit = this.mainData.status == '新建' ? true : false
      this.changeDataStructure()
    },
    changeDataStructure() {
      let that = this
      this.mainAreaData = [
        {
          label:'方案编号',
          value:this.mainData.promnum
        },
        {
          label:'方案名称',
          value:this.mainData.promname
        },
        {
          label:'促销类型',
          value:this.mainData.type
        },
        {
          label:'订货账号',
          value:this.mainData.accountname
        },
        {
          label:'活动开始时间',
          value:this.mainData.begdate 
        },
        {
          label:'活动结束时间',
          value:this.mainData.enddate
        },
        {
          label:'品牌',
          value:this.mainData.brandname
        },
        {
          label:'领域',
          value:this.mainData.tradefield.join(',')
        },
        {
          label:'起订数量',
          value:this.mainData.orderminqty
        },
        {
          label:'起订金额',
          value:this.mainData.orderminamount
        },
        {
          label:'订单增量',
          value:this.mainData.orderaddqty
        },
        {
          label:'备注',
          value:this.mainData.remarks
        },
        {
          label:'状态',
          value:this.mainData.status,
          style:function () {
              let style = {}
              switch (that.mainData.status) {
                case '新建':
                  style = {color:'#000000'}
                  break;
                case '审核':
                  style = {color:'#52C41A'}
                  break;
                case '发布':
                  style = {color:'#d90a0a'}
                  break;
                case '关闭':
                  style = {color:'#b2c0ea'}
                  break;
              }
              return style
            }
        },
      ]
      this.detailInfo = {
        baseInfo: [
          {
            label:'方案编号',
            value:this.mainData.promnum
          },
          {
            label:'方案名称',
            value:this.mainData.promname
          },
          {
            label:'促销类型',
            value:this.mainData.type
          },
          {
            label:'订货账号',
            value:this.mainData.accountname
          },
          {
            label:'活动开始时间',
            value:this.mainData.begdate 
          },
          {
            label:'活动结束时间',
            value:this.mainData.enddate
          },
          {
            label:'品牌',
            value:this.mainData.brandname
          },
          {
            label:'领域',
            value:this.mainData.tradefields
          },
          {
            label:'起订数量',
            value:this.mainData.orderminqty
          },
          {
            label:'起订金额',
            value:this.tool.formatAmount(this.mainData.orderminamount,2)
          },
          {
            label:'订单增量',
            value:this.mainData.orderaddqty
          },
          {
            label:'备注',
            value:this.mainData.remarks
          },
          {
            label:'状态',
            value:this.mainData.status,
            style:function () {
              let style = {}
              switch (that.mainData.status) {
                case '新建':
                  style = {color:'#000000'}
                  break;
                case '审核':
                  style = {color:'#52C41A'}
                  break;
                case '发布':
                  style = {color:'#d90a0a'}
                  break;
                case '关闭':
                  style = {color:'#b2c0ea'}
                  break;
              }
              return style
            }
          },
        ],
        systemInfo: [
          {label:'录入人',value:this.mainData.createby},
          {label:'录入时间',value:this.mainData.createdate},
          {label:'审核人',value:this.mainData.checkby},
          {label:'审核时间',value:this.mainData.checkdate},
          {label:'发布人',value:this.mainData.sendby},
          {label:'发布时间',value:this.mainData.senddate},
        ]
      }
    },
    async productDel (data) {
      
      let res = await this.$api.requested({
        "id":20230102142603,
        "content": {
          "sa_promotion_itemsids":[data.sa_promotion_itemsid]
        }
      })
      this.tool.showMessage(res,() => {
        this.$refs.productDetail.listData(data.sa_promotion_itemgroupid)
      })
    },
    async bindImportOrder (id) {
      const res = await this.$api.requested({
        "id": 20230510153504,
        "content": {
        "attachmentid":id,
        "sa_promotionid":this.$route.query.id
        }
      })
      if (res.data !== '成功') {
        this.errorUrl = res.data
      }
      this.tool.showMessage(res,() => {
        this.$refs.productDetail.listData()
      })
    },
    // 监听切换数据,上一页,下一页
    pageChange (id,rowindex) {
      this.flag = false
      this.$router.replace({path:'/promotionDetail',query:{id:id,rowindex:rowindex}})
      this.queryMainData(id)
    },
    onSuccess(){
      this.queryMainData(this.$route.query.id)
    }
  },
  created() {
    this.queryMainData(this.$route.query.id)
  }
}
</script>

<style scoped>

</style>