|
|
@@ -0,0 +1,133 @@
|
|
|
+<template>
|
|
|
+ <el-drawer v-model="visible" size="800px" destroy-on-close :close-on-click-modal="false" :with-header="false">
|
|
|
+ <el-container class="flex-column">
|
|
|
+ <div class="drawer-detail-main">
|
|
|
+ <div class="drawer-detail-header">
|
|
|
+ <div class="drawer-detail-header-body">
|
|
|
+ <div class="drawer-detail-header-left">{{titleMap[mode]}}</div>
|
|
|
+ <div class="drawer-detail-header-left">
|
|
|
+ <el-button type="default" icon="el-icon-close" @click="visible=false"></el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-main>
|
|
|
+ <el-form ref="dialogForm" :model="formData" :rules="rules" label-width="100px" label-position="top">
|
|
|
+ <el-form-item label="计划名称" prop="plan_name">
|
|
|
+ <el-input v-model="formData.plan_name" readonly disabled clearable placeholder="请输入"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="推广团购商品" v-if="mode == 'goods'">
|
|
|
+ <el-button type="default" @click="quickGoods" v-if="goodsData.length > 0">一键设置佣金</el-button>
|
|
|
+ <div class="goods-live" v-if="goodsData.length>0">
|
|
|
+ <scTable ref="starTable" :data="goodsData" row-key="id" height="300" hidePagination hideDo style="width: 750px;">
|
|
|
+ <el-table-column label="商品信息" width="340" prop="name" fixed="left">
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="goods-img">
|
|
|
+ <div class="img">
|
|
|
+ <el-image
|
|
|
+ style="width: 54px; height: 54px"
|
|
|
+ :src="scope.row.goods.image_list[0].url"
|
|
|
+ :zoom-rate="1.2"
|
|
|
+ :max-scale="7"
|
|
|
+ :min-scale="0.2"
|
|
|
+ :preview-src-list="[scope.row.goods.image_list[0].url]"
|
|
|
+ preview-teleported
|
|
|
+ z-index="999"
|
|
|
+ fit="cover"></el-image>
|
|
|
+ </div>
|
|
|
+ <div class="name">
|
|
|
+ <span>{{ scope.row.goods.product_name }}</span>
|
|
|
+ <span class="dec">商品编码：{{ scope.row.goods.product_id }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="佣金比例" prop="types" width="150">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-input v-model="scope.row.commission_rate" @input="setRate(scope.$index)" @focus="setRate(scope.$index)" placeholder="0%-29%">
|
|
|
+ <template #suffix>%</template>
|
|
|
+ </el-input>
|
|
|
+ <div class="el-form-item-msg">预估每单佣金 {{ scope.row.rate_money }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="商品类型" prop="types" width="100"></el-table-column>
|
|
|
+ <el-table-column label="价格" width="200" prop="id">
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="price">{{ $TOOL.moneyFormat(scope.row.goods.price) }}</div>
|
|
|
+ <div class="goods-price">
|
|
|
+ <div class="del">{{ $TOOL.moneyFormat(scope.row.goods.line_price) }}</div>
|
|
|
+ <span>{{ $TOOL.disFormat(scope.row.goods.price,scope.row.goods.line_price) }}折</span></div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="剩余库存" prop="category_id" width="120">
|
|
|
+ <template #default="scope">
|
|
|
+ <span v-if="scope.row.goods.limit_use_rule==1">{{ scope.row.goods.use_num_per_consume }}</span>
|
|
|
+ <span v-else>不限</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="状态" prop="enable" width="120" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="status-success" v-if="scope.row.goods.status==1"><sc-status-indicator type="success"></sc-status-indicator> 正常</div>
|
|
|
+ <div class="status-danger" v-if="scope.row.goods.status==2"><sc-status-indicator type="danger"></sc-status-indicator> 禁用</div>
|
|
|
+ <div class="status-danger" v-if="scope.row.goods.status==0"><sc-status-indicator type="danger"></sc-status-indicator> 审核中</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </scTable>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-main>
|
|
|
+ <el-footer>
|
|
|
+ <el-button @click="visible=false" size="large">取 消</el-button>
|
|
|
+ </el-footer>
|
|
|
+ </el-container>
|
|
|
+ </el-drawer>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data(){
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+ isSaveing: false,
|
|
|
+ mode:"add",
|
|
|
+ titleMap:{
|
|
|
+ goods:"修改计划商品佣金",
|
|
|
+ star:"达人管理"
|
|
|
+ },
|
|
|
+ visible:false,
|
|
|
+ formData:{
|
|
|
+ status:1
|
|
|
+ },
|
|
|
+ goodsData:[],
|
|
|
+ starData:[],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ open(mode = 'add'){
|
|
|
+ this.mode = mode;
|
|
|
+ this.visible = true;
|
|
|
+ return this
|
|
|
+ },
|
|
|
+ //表单注入数据
|
|
|
+ setData(data){
|
|
|
+ this.formData = JSON.parse(JSON.stringify(data));
|
|
|
+ this.getDetail()
|
|
|
+ },
|
|
|
+ async getDetail(){
|
|
|
+ var resp = await this.$API.merPlan.detail.get({"id":this.formData.id});
|
|
|
+ if (resp.code == 0) {
|
|
|
+ this.visible = false;
|
|
|
+ return this.$message.error(resp.msg);
|
|
|
+ }
|
|
|
+ this.goodsData = resp.data.goods
|
|
|
+ this.starData = resp.data.star
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+.goods-live{width: 100%;margin-top: 10px;}
|
|
|
+</style>
|
Zory