优化商品库存耗材
This commit is contained in:
@@ -1,185 +1,194 @@
|
||||
<template>
|
||||
<div class="addgoods">
|
||||
<div class="header-wrap">
|
||||
<el-radio-group v-model="addFormType" size="large">
|
||||
<el-radio-button label="基础信息" :value="1"></el-radio-button>
|
||||
<el-radio-button label="耗材设置" :value="2"></el-radio-button>
|
||||
<el-radio-button label="关联推荐商品" :value="3"></el-radio-button>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-width="150px" class="demo-ruleForm" status-icon>
|
||||
<el-form-item label="商品名称" required>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="name">
|
||||
<el-input v-model="ruleForm.name" placeholder="请输入商品名称" :disabled="isSyncStatus()" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品介绍">
|
||||
<el-col :span="12">
|
||||
<el-form-item>
|
||||
<el-input v-model="ruleForm.shortTitle" type="textarea" placeholder="请输入商品介绍" :disabled="isSyncStatus()" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="单位" required>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="unitId">
|
||||
<el-select v-model="ruleForm.unitId" placeholder="请选择单位" :disabled="isSyncStatus()">
|
||||
<el-option :label="item.name" :value="item.id" v-for="item in datas.Company" :key="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品分类" required>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="region">
|
||||
<el-select v-model="ruleForm.categoryId" placeholder="请选择商品分类" :disabled="isSyncStatus()">
|
||||
<el-option :label="item.name" :value="item.id" v-for="item in datas.classification" :key="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="商品图片" required prop="images">
|
||||
<div v-show="addFormType == 1">
|
||||
<el-form-item label="商品名称" required>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="name">
|
||||
<el-input v-model="ruleForm.name" placeholder="请输入商品名称" :disabled="isSyncStatus()" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品介绍">
|
||||
<el-col :span="12">
|
||||
<el-form-item>
|
||||
<el-input v-model="ruleForm.shortTitle" type="textarea" placeholder="请输入商品介绍"
|
||||
:disabled="isSyncStatus()" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="单位" required>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="unitId">
|
||||
<el-select v-model="ruleForm.unitId" placeholder="请选择单位" :disabled="isSyncStatus()">
|
||||
<el-option :label="item.name" :value="item.id" v-for="item in datas.Company" :key="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品分类" required>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="region">
|
||||
<el-select v-model="ruleForm.categoryId" placeholder="请选择商品分类" :disabled="isSyncStatus()">
|
||||
<el-option :label="item.name" :value="item.id" v-for="item in datas.classification" :key="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="商品图片" required prop="images">
|
||||
<MultiImageUpload v-model="ruleForm.images" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="商品图片" required prop="images">
|
||||
<div style="display: flex; flex-wrap: wrap">
|
||||
<div v-for="(item, index) in ruleForm.images" :key="index" style="position: relative" class="showStyle">
|
||||
<el-icon class="buttonstyle" @click="deleteEvent(item)">
|
||||
<DeleteFilled />
|
||||
</el-icon>
|
||||
<img style="width: 148px; height: 148px; margin-right: 6px" class="imgStyle" :src="item" alt="" />
|
||||
</div>
|
||||
<div class="upImgStyle" @click="addimgEvent">+</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<div class="tips">注：第一张图为商品封面图，图片尺寸为750×750</div>
|
||||
</el-form-item>
|
||||
<!-- 选择图片 -->
|
||||
<AddImg ref="addImg" @successEvent="successEvent"></AddImg>
|
||||
|
||||
<el-form-item label="商品类型">
|
||||
<el-radio-group v-model="ruleForm.type" @change="changeTypeEnum(ruleForm.type)" :disabled="isSyncStatus()">
|
||||
<el-radio value="single">单规格商品</el-radio>
|
||||
<el-radio value="sku">多规格商品</el-radio>
|
||||
<el-radio value="package">套餐商品</el-radio>
|
||||
<el-radio value="weight">称重商品</el-radio>
|
||||
<!-- <el-radio label="coupon">团购券</el-radio> -->
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="套餐商品" v-if="ruleForm.type == 'package'">
|
||||
<div style="display: block; width: 100%">
|
||||
<div class="head-container">
|
||||
<el-radio-group v-model="ruleForm.groupType" @change="typeChange">
|
||||
<el-radio-button :label="0">固定套餐</el-radio-button>
|
||||
<el-radio-button :label="1">可选套餐</el-radio-button>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div v-if="ruleForm.groupType == 0">
|
||||
<el-table border :data="item.goods" v-for="(item, index) in ruleForm.proGroupVo" :key="index">
|
||||
<el-table-column label="名称" prop="proName"></el-table-column>
|
||||
<el-table-column label="规格" prop="skuName"></el-table-column>
|
||||
<el-table-column label="价格" prop="price"></el-table-column>
|
||||
<el-table-column label="数量" prop="number">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.number" :min="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column width="150">
|
||||
<template #header>
|
||||
<el-button type="primary" @click="addgoods(-1)" :disabled="isSyncStatus()">
|
||||
添加商品
|
||||
</el-button>
|
||||
</template>
|
||||
<template v-slot="scope">
|
||||
<el-button type="text" :disabled="scope.row.type != 'sku' && isSyncStatus()"
|
||||
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
|
||||
<el-button type="text"
|
||||
@click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div v-if="ruleForm.groupType == 1">
|
||||
<div class="group_wrap" v-for="(item, index) in ruleForm.proGroupVo" :key="index">
|
||||
<el-form inline :model="item">
|
||||
<el-form-item label="规格组名">
|
||||
<el-input v-model="item.title" :disabled="isSyncStatus()" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="`本组菜品${item.goods.length}选`">
|
||||
<el-input v-model="item.number" :disabled="isSyncStatus()" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="ruleForm.proGroupVo.splice(index, 1)" :disabled="isSyncStatus()">
|
||||
删除
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="margin-top: 20px">
|
||||
<el-table border :data="item.goods">
|
||||
<el-table-column label="名称" prop="proName"></el-table-column>
|
||||
<el-table-column label="规格" prop="skuName"></el-table-column>
|
||||
<el-table-column label="价格" prop="price"></el-table-column>
|
||||
<el-table-column label="数量" prop="number">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.number" :min="0" :disabled="isSyncStatus()" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column width="150">
|
||||
<template #header>
|
||||
<el-button type="primary" @click="addgoods(index)" :disabled="isSyncStatus()">
|
||||
添加商品
|
||||
</el-button>
|
||||
</template>
|
||||
<template v-slot="scope">
|
||||
<el-button type="text" :disabled="scope.row.type != 'sku' && isSyncStatus()"
|
||||
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
|
||||
<el-button type="text" @click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)"
|
||||
:disabled="isSyncStatus()">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-form-item label="商品图片" required prop="images">
|
||||
<div style="display: flex; flex-wrap: wrap">
|
||||
<div v-for="(item, index) in ruleForm.images" :key="index" style="position: relative" class="showStyle">
|
||||
<el-icon class="buttonstyle" @click="deleteEvent(item)">
|
||||
<DeleteFilled />
|
||||
</el-icon>
|
||||
<img style="width: 148px; height: 148px; margin-right: 6px" class="imgStyle" :src="item" alt="" />
|
||||
</div>
|
||||
<el-button type="primary" @click="addtaocan" :disabled="isSyncStatus()">
|
||||
添加套餐组
|
||||
</el-button>
|
||||
<div class="upImgStyle" @click="addimgEvent">+</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="选择规格" v-if="ruleForm.type == 'sku'">
|
||||
<el-select v-model="ruleForm.specId" placeholder="请选择规格" style="width: 500px" @change="selectSpecHandle"
|
||||
:disabled="isSyncStatus()">
|
||||
<el-option :label="item.name" :value="item.id" v-for="item in datas.specificationsconfig"
|
||||
:key="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="ele.name" v-if="datas.selectSpeclist.length" v-for="ele in datas.selectSpeclist"
|
||||
:key="ele.name">
|
||||
<el-checkbox-group v-model="ele.selectSpecResult" @change="selectSpecResultChange">
|
||||
<el-checkbox :value="element.name" :label="element.name" v-for="(element, index) in ele.children"
|
||||
:key="index"></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<!-- 规格属性 -->
|
||||
<!-- 单规格、称重 -->
|
||||
<SpecificationAttribute v-if="ruleForm.type != 'sku'" :info="ruleForm" :list="list"
|
||||
ref="specificationAttributeRef">
|
||||
</SpecificationAttribute>
|
||||
<SpecificationAttribute v-if="ruleForm.type == 'sku' && list.length" :specTableHeaders="datas.specTableHeaders"
|
||||
:info="ruleForm" :list="list" ref="specificationAttributeRef"></SpecificationAttribute>
|
||||
<el-form-item label="重量">
|
||||
<el-col :span="12">
|
||||
<div style="display: block">
|
||||
<el-input v-model="ruleForm.weight" placeholder="" :disabled="isSyncStatus()">
|
||||
<template #append>千克</template>
|
||||
</el-input>
|
||||
<!-- <div style="color: #999;">用于快递或配送运费计重</div> -->
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<div class="tips">注：第一张图为商品封面图，图片尺寸为750×750</div>
|
||||
</el-form-item>
|
||||
<!-- 选择图片 -->
|
||||
<AddImg ref="addImg" @successEvent="successEvent"></AddImg>
|
||||
|
||||
<el-form-item label="商品类型">
|
||||
<el-radio-group v-model="ruleForm.type" @change="changeTypeEnum(ruleForm.type)" :disabled="isSyncStatus()">
|
||||
<el-radio value="single">单规格商品</el-radio>
|
||||
<el-radio value="sku">多规格商品</el-radio>
|
||||
<el-radio value="package">套餐商品</el-radio>
|
||||
<el-radio value="weight">称重商品</el-radio>
|
||||
<!-- <el-radio label="coupon">团购券</el-radio> -->
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="套餐商品" v-if="ruleForm.type == 'package'">
|
||||
<div style="display: block; width: 100%">
|
||||
<div class="head-container">
|
||||
<el-radio-group v-model="ruleForm.groupType" @change="typeChange">
|
||||
<el-radio-button :label="0">固定套餐</el-radio-button>
|
||||
<el-radio-button :label="1">可选套餐</el-radio-button>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div v-if="ruleForm.groupType == 0">
|
||||
<el-table border :data="item.goods" v-for="(item, index) in ruleForm.proGroupVo" :key="index">
|
||||
<el-table-column label="名称" prop="proName"></el-table-column>
|
||||
<el-table-column label="规格" prop="skuName"></el-table-column>
|
||||
<el-table-column label="价格" prop="price"></el-table-column>
|
||||
<el-table-column label="数量" prop="number">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.number" :min="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column width="150">
|
||||
<template #header>
|
||||
<el-button type="primary" @click="addgoods(-1)" :disabled="isSyncStatus()">
|
||||
添加商品
|
||||
</el-button>
|
||||
</template>
|
||||
<template v-slot="scope">
|
||||
<el-button type="text" :disabled="scope.row.type != 'sku' && isSyncStatus()"
|
||||
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
|
||||
<el-button type="text"
|
||||
@click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div v-if="ruleForm.groupType == 1">
|
||||
<div class="group_wrap" v-for="(item, index) in ruleForm.proGroupVo" :key="index">
|
||||
<el-form inline :model="item">
|
||||
<el-form-item label="规格组名">
|
||||
<el-input v-model="item.title" :disabled="isSyncStatus()" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="`本组菜品${item.goods.length}选`">
|
||||
<el-input v-model="item.number" :disabled="isSyncStatus()" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="ruleForm.proGroupVo.splice(index, 1)" :disabled="isSyncStatus()">
|
||||
删除
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="margin-top: 20px">
|
||||
<el-table border :data="item.goods">
|
||||
<el-table-column label="名称" prop="proName"></el-table-column>
|
||||
<el-table-column label="规格" prop="skuName"></el-table-column>
|
||||
<el-table-column label="价格" prop="price"></el-table-column>
|
||||
<el-table-column label="数量" prop="number">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.number" :min="0" :disabled="isSyncStatus()" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column width="150">
|
||||
<template #header>
|
||||
<el-button type="primary" @click="addgoods(index)" :disabled="isSyncStatus()">
|
||||
添加商品
|
||||
</el-button>
|
||||
</template>
|
||||
<template v-slot="scope">
|
||||
<el-button type="text" :disabled="scope.row.type != 'sku' && isSyncStatus()"
|
||||
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
|
||||
<el-button type="text" @click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)"
|
||||
:disabled="isSyncStatus()">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
<el-button type="primary" @click="addtaocan" :disabled="isSyncStatus()">
|
||||
添加套餐组
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否允许临时改价">
|
||||
<el-radio-group v-model="ruleForm.isAllowTempModifyPrice" :disabled="isSyncStatus()">
|
||||
<el-radio :value="1">允许</el-radio>
|
||||
<el-radio :value="0">不允许</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="每日销量上限">
|
||||
</el-form-item>
|
||||
<el-form-item label="选择规格" v-if="ruleForm.type == 'sku'">
|
||||
<el-select v-model="ruleForm.specId" placeholder="请选择规格" style="width: 500px" @change="selectSpecHandle"
|
||||
:disabled="isSyncStatus()">
|
||||
<el-option :label="item.name" :value="item.id" v-for="item in datas.specificationsconfig"
|
||||
:key="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="ele.name" v-if="datas.selectSpeclist.length" v-for="ele in datas.selectSpeclist"
|
||||
:key="ele.name">
|
||||
<el-checkbox-group v-model="ele.selectSpecResult" @change="selectSpecResultChange">
|
||||
<el-checkbox :value="element.name" :label="element.name" v-for="(element, index) in ele.children"
|
||||
:key="index"></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<!-- 规格属性 -->
|
||||
<!-- 单规格、称重 -->
|
||||
<SpecificationAttribute v-if="ruleForm.type != 'sku'" :info="ruleForm" :list="list"
|
||||
ref="specificationAttributeRef">
|
||||
</SpecificationAttribute>
|
||||
<SpecificationAttribute v-if="ruleForm.type == 'sku' && list.length" :specTableHeaders="datas.specTableHeaders"
|
||||
:info="ruleForm" :list="list" ref="specificationAttributeRef"></SpecificationAttribute>
|
||||
<el-form-item label="重量">
|
||||
<el-col :span="12">
|
||||
<div style="display: block">
|
||||
<el-input v-model="ruleForm.weight" placeholder="" :disabled="isSyncStatus()">
|
||||
<template #append>千克</template>
|
||||
</el-input>
|
||||
<!-- <div style="color: #999;">用于快递或配送运费计重</div> -->
|
||||
</div>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否允许临时改价">
|
||||
<el-radio-group v-model="ruleForm.isAllowTempModifyPrice" :disabled="isSyncStatus()">
|
||||
<el-radio :value="1">允许</el-radio>
|
||||
<el-radio :value="0">不允许</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="每日销量上限">
|
||||
<el-input-number v-model="ruleForm.dayLimit" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="每单限购">
|
||||
@@ -188,48 +197,127 @@
|
||||
<el-form-item label="每人限购">
|
||||
<el-input-number v-model="ruleForm.dayLimit" :min="0" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="定时上下架">
|
||||
<el-checkbox-group v-model="ruleForm.days">
|
||||
<el-checkbox v-for="(item, index) in datas.cycle" :key="item.value" :value="item.value">
|
||||
{{ item.label }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-col :span="20">
|
||||
<!-- <el-time-picker v-model="ruleForm.useTime" is-range range-separator="至" start-placeholder="开始时间"
|
||||
<el-form-item label="定时上下架">
|
||||
<el-checkbox-group v-model="ruleForm.days">
|
||||
<el-checkbox v-for="(item, index) in datas.cycle" :key="item.value" :value="item.value">
|
||||
{{ item.label }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-col :span="20">
|
||||
<!-- <el-time-picker v-model="ruleForm.useTime" is-range range-separator="至" start-placeholder="开始时间"
|
||||
end-placeholder="结束时间" value-format="HH:mm:ss" format="HH:mm:ss" />
|
||||
-->
|
||||
|
||||
<el-time-picker v-model="ruleForm.startTime" value-format="HH:mm:ss" format="HH:mm:ss" placeholder="选择开始时间">
|
||||
</el-time-picker>-
|
||||
<el-time-picker v-model="ruleForm.endTime" value-format="HH:mm:ss" format="HH:mm:ss" placeholder="选择结束时间">
|
||||
</el-time-picker>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="上架">
|
||||
<el-switch v-model="ruleForm.isSale" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="库存开关">
|
||||
<div style="display: block;">
|
||||
<el-switch v-model="ruleForm.isStock" :active-value="1" :inactive-value="0" :disabled="isSyncStatus()" />
|
||||
<div style="color: #999;">注：关闭则不计算出库数据</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="设为推荐" prop="delivery">
|
||||
<el-switch v-model="ruleForm.isHot" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="库存数量">
|
||||
<el-input-number v-model="ruleForm.stockNumber" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="打包费" prop="delivery">
|
||||
<div style="display: block;">
|
||||
<el-input-number v-model="ruleForm.packFee" controls-position="right"
|
||||
:disabled="isSyncStatus()"></el-input-number>
|
||||
<div style="color: #999;">单份商品打包费。注：店铺开启外卖模式下该数据才生效</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="关联推荐商品">
|
||||
<el-time-picker v-model="ruleForm.startTime" value-format="HH:mm:ss" format="HH:mm:ss" placeholder="选择开始时间">
|
||||
</el-time-picker>-
|
||||
<el-time-picker v-model="ruleForm.endTime" value-format="HH:mm:ss" format="HH:mm:ss" placeholder="选择结束时间">
|
||||
</el-time-picker>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="上架">
|
||||
<el-switch v-model="ruleForm.isSale" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="库存开关">
|
||||
<div style="display: block;">
|
||||
<el-switch v-model="ruleForm.isStock" :active-value="1" :inactive-value="0" :disabled="isSyncStatus()" />
|
||||
<div style="color: #999;">注：关闭则不计算出库数据</div>
|
||||
</div>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="设为推荐" prop="delivery">
|
||||
<el-switch v-model="ruleForm.isHot" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="库存数量">
|
||||
<el-input-number v-model="ruleForm.stockNumber" :min="0" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="打包费" prop="delivery">
|
||||
<div style="display: block;">
|
||||
<el-input-number v-model="ruleForm.packFee" controls-position="right"
|
||||
:disabled="isSyncStatus()"></el-input-number>
|
||||
<div style="color: #999;">单份商品打包费。注：店铺开启外卖模式下该数据才生效</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div v-show="addFormType == 2" style="padding-bottom: 20px;">
|
||||
<!-- 耗材绑定 -->
|
||||
<el-form-item label="绑定耗材"></el-form-item>
|
||||
<el-form-item label="商品名">{{ ruleForm.name }}</el-form-item>
|
||||
<el-form-item>
|
||||
<el-table :data="ruleForm.consList" border>
|
||||
<el-table-column label="序号" type="index" width="60"></el-table-column>
|
||||
<el-table-column label="耗材名称" prop="consInfoId">
|
||||
<template v-slot="scope">
|
||||
<el-select filterable v-model="scope.row.consInfoId" reserve-keyword placeholder="请输入关键词"
|
||||
@change="selectionChange($event, scope.row)">
|
||||
<el-option v-for="item in consOptions" :key="item.id" :label="item.conName"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
<!-- <div class="tips" v-if="scope.row.stockNumber">库存：{{ scope.row.stockNumber }}</div> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="单位" prop="conUnit">
|
||||
<template v-slot="scope">
|
||||
<el-input v-model="scope.row.conUnit" readonly disabled placeholder="请选择耗材"></el-input>
|
||||
<!-- <el-select v-model="scope.row.conUnit" reserve-keyword placeholder="请输入关键词">
|
||||
<el-option
|
||||
v-for="item in returnConUnits(scope.row.consInfoId)"
|
||||
:key="item"
|
||||
:label="item"
|
||||
:value="item"
|
||||
></el-option>
|
||||
</el-select> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="使用数量" prop="surplusStock" min-width="150px">
|
||||
<template v-slot="scope">
|
||||
<el-input-number v-model="scope.row.surplusStock" :min="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="100">
|
||||
<template #header>
|
||||
<el-button type="primary" size="small" @click="createItem">添加</el-button>
|
||||
</template>
|
||||
<template v-slot="scope">
|
||||
<div class="table_btn_wrap">
|
||||
<div class="btn sub" @click="ruleForm.consList.splice(scope.$index, 1)">
|
||||
<el-icon>
|
||||
<RemoveFilled />
|
||||
</el-icon>
|
||||
</div>
|
||||
<!-- <div class="btn add" v-if="scope.$index == ruleForm.consList.length - 1"
|
||||
@click="createItem(scope.row)">
|
||||
<el-icon>
|
||||
<CirclePlusFilled />
|
||||
</el-icon>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
<el-form-item label="自动售罄">
|
||||
<div class="center">
|
||||
<el-switch v-model="ruleForm.isAutoSoldStock" :active-value="1" :inactive-value="0"></el-switch>
|
||||
<el-text type="info">当绑定的任何一种耗材库存不足时，商品自动售罄</el-text>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="退菜是否退库存">
|
||||
<div class="column">
|
||||
<div>
|
||||
<el-radio-group v-model="ruleForm.refundMode">
|
||||
<el-radio label="退菜退库存" :value="1"></el-radio>
|
||||
<el-radio label="仅退菜不退库存" :value="2"></el-radio>
|
||||
<el-radio label="每次询问-退菜后弹窗提示，可手动选择" :value="3"></el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div>
|
||||
<el-text type="danger">当前店铺退菜退库存规则：{{ shopInfoTypeFilter(shopInfo.refundMode) }}</el-text>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item label="关联推荐商品" v-show="addFormType == 3">
|
||||
<div class="column">
|
||||
<div class="row">
|
||||
<div class="center">
|
||||
@@ -313,10 +401,62 @@ import Sortable from "sortablejs";
|
||||
import { useTagsViewStore } from "@/store";
|
||||
import selecProductDialog from "@/views/marketing_center/group_booking/components/selecProductDialog.vue";
|
||||
|
||||
const route = useRoute();
|
||||
const selecProductDialogRef = ref(null)
|
||||
const goodsListMax = ref(9)
|
||||
|
||||
const addFormType = ref(1)
|
||||
|
||||
const consOptions = ref([])
|
||||
|
||||
// let haocaiData = ref({
|
||||
// consList: [
|
||||
// {
|
||||
// productId: '',
|
||||
// consInfoId: "",
|
||||
// surplusStock: "0",
|
||||
// }
|
||||
// ]
|
||||
// });
|
||||
|
||||
// 生成新商品绑定耗材关系项
|
||||
function createItem(val) {
|
||||
let item = {
|
||||
productId: '',
|
||||
consInfoId: "",
|
||||
surplusStock: "",
|
||||
};
|
||||
ruleForm.consList.push(item);
|
||||
}
|
||||
|
||||
// 商品选择耗材
|
||||
function selectionChange(e, row) {
|
||||
let item = consOptions.value.find((item) => item.id == e);
|
||||
row.name = item.conName;
|
||||
row.conUnit = item.conUnit;
|
||||
}
|
||||
|
||||
// 获取耗材列表
|
||||
async function gethaocaiList() {
|
||||
try {
|
||||
let res = await UserAPI3.productconsList({ id: route.query.id });
|
||||
console.log('获取耗材列表', res);
|
||||
consOptions.value = res || [];
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
|
||||
const shopInfo = ref('')
|
||||
|
||||
function shopInfoTypeFilter(t) {
|
||||
if (t == 1) return '跟随商品分类'
|
||||
if (t == 2) return '跟随单商品'
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
shopInfo.value = JSON.parse(localStorage.getItem('userInfo'))
|
||||
gethaocaiList()
|
||||
// Sortable 需要在 el-table 渲染 tbody 后初始化，尝试多次以确保 DOM 可用
|
||||
const initSortable = async () => {
|
||||
await nextTick();
|
||||
@@ -520,7 +660,10 @@ const ruleForm = reactive<RuleForm>({
|
||||
// 排序值
|
||||
sort: 1,
|
||||
selectSpecInfo: {},
|
||||
relatedRecommendJson: [] // 关联推荐商品
|
||||
relatedRecommendJson: [], // 关联推荐商品
|
||||
consList: [], // 耗材列表
|
||||
refundMode: 1, // 退菜是否退库存 1退菜退库存 2仅退菜不退库存 3每次询问-退菜后弹窗提示
|
||||
isAutoSoldStock: 0, // 是否自动售罄
|
||||
});
|
||||
const rules = reactive<FormRules<RuleForm>>({
|
||||
name: [{ required: true, message: "请输入商品名称", trigger: "blur" }],
|
||||
@@ -584,6 +727,14 @@ async function tbProductGetDetail(id: any) {
|
||||
} else {
|
||||
list.value = ruleForm.skuList;
|
||||
}
|
||||
|
||||
// if (res.consList.length == 0) {
|
||||
// ruleForm.consList.push({
|
||||
// productId: '',
|
||||
// consInfoId: "",
|
||||
// surplusStock: "0",
|
||||
// })
|
||||
// }
|
||||
}
|
||||
// 选择套餐商品sku
|
||||
function selectSkuHandle(item: any, index: number) {
|
||||
@@ -1088,4 +1239,8 @@ const resetForm = (formEl: FormInstance | undefined) => {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.header-wrap {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user