|
|
@@ -1,11 +1,187 @@
|
|
|
<template>
|
|
|
<template-page v-if="isShowTab" ref="pageRef" :get-list="getList"
|
|
|
:table-attributes="tableAttributes" :table-events="tableEvents" :options-evens-group="optionsEvensGroup"
|
|
|
- :moreParameters="moreParameters" :column-parsing="columnParsing" :operation="operation()":operationColumnWidth="80">
|
|
|
+ :moreParameters="moreParameters" :column-parsing="columnParsing" :operation="operation":operationColumnWidth="80">
|
|
|
<div class="footer">
|
|
|
<el-button size="mini" @click="cancel()">取消</el-button>
|
|
|
<el-button size="mini" @click="formConfirm()" type="primary">确定</el-button>
|
|
|
</div>
|
|
|
+ <!-- 选择商品 -->
|
|
|
+ <el-dialog title="商品详情" :visible.sync="isShowDetail" width="90%" :close-on-click-modal="false" :modal-append-to-body="false" :append-to-body="true">
|
|
|
+ <div style="max-height: 600px;overflow-y: auto;">
|
|
|
+ <el-form ref="formRef" :rules="rules" :model="formData" label-width="110px" size="small" label-position="left">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>基础信息</span>
|
|
|
+ </div>
|
|
|
+ <div class="mymain-container">
|
|
|
+ <el-row :gutter="20" justify="start">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="商品可选状态" prop="status" :required="true">
|
|
|
+ <div class="flex_ac">
|
|
|
+ <el-radio-group v-model="formData.status">
|
|
|
+ <el-radio disabled :label="true">开启</el-radio>
|
|
|
+ <el-radio disabled :label="false">关闭</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ <div class="hui" style="margin-left: 80px;">开启状态，商户可选择本商品；关闭则不允许商户选择；</div>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label="品牌" prop="brandName" :rules="[{ required: true, message: `请输入品牌`, trigger: 'blur' }]">
|
|
|
+ <el-input type="text" v-model="formData.brandName" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label="是否虚拟商品" prop="isVr" :required="true">
|
|
|
+ <el-radio-group v-model="formData.isVr">
|
|
|
+ <el-radio disabled :label="true">是</el-radio>
|
|
|
+ <el-radio disabled :label="false">否</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label="商品大类" prop="category1" :rules="[{ required: true, message: `请输入商品大类`, trigger: 'blur' }]">
|
|
|
+ <el-input type="text" v-model="formData.category1" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label="商品小类" prop="category2" :rules="[{ required: true, message: `请输入商品小类`, trigger: 'blur' }]">
|
|
|
+ <el-input type="text" v-model="formData.category2" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="商品名称" prop="goodsName" :rules="[{ required: true, message: `请输入商品名称`, trigger: 'blur' }]">
|
|
|
+ <el-input type="textarea" :rows="3" v-model="formData.goodsName" disabled placeholder="请输入"></el-input>
|
|
|
+ <div class="hui">商品名称将显示在商品详情，让用户更直接了解商品内涵</div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="商品描述" prop="describeText">
|
|
|
+ <el-input type="textarea" :rows="3" v-model="formData.describeText" disabled placeholder="请输入"></el-input>
|
|
|
+ <div class="hui">商品描述将显示在商品详情，让用户更了解商品细节</div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="商品主图" prop="imgUrl" :rules="[{ required: true, message: `请上传商品主图`, trigger: 'change' }]">
|
|
|
+ <ImageUpload :fileList="formData.imgUrl" :limit="1" :isEdit="false" :fileType="['image']"/>
|
|
|
+ <div class="suggest">建议尺寸800*800</div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="商品视频" prop="vedio">
|
|
|
+ <ImageUpload :fileList="formData.vedio" :limit="1" :isEdit="false" :fileType="['video']"/>
|
|
|
+ <div class="suggest">建议视频宽高比16:9，建议时长9-30秒</div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="轮播图" prop="imgs" :rules="[{ required: true, message: `请上传轮播图`, trigger: 'change' }]">
|
|
|
+ <ImageUpload :fileList="formData.imgs" :limit="6" :isEdit="false" :fileType="['image']"/>
|
|
|
+ <div class="suggest">建议尺寸800*800，最多上传6张</div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>价格库存</span>
|
|
|
+ </div>
|
|
|
+ <div class="mymain-container">
|
|
|
+ <el-row :gutter="20" justify="start">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="规格类型" prop="goodsLibrarySpecList" class="is-required">
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-table :data="formData.goodsLibrarySpecList" element-loading-text="Loading" border fit highlight-current-row stripe>
|
|
|
+ <el-table-column prop="" align="center" label="*大类">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item :prop="'goodsLibrarySpecList.' + scope.$index + '.mainName'" :rules="[{ required: true, message: `请输入大类`, trigger: 'blur' }]" label-width="0">
|
|
|
+ <el-input type="text" v-model="scope.row.mainName" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="" align="center" label="*小类">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item :prop="'goodsLibrarySpecList.' + scope.$index + '.smallName'" :rules="[{ required: true, message: `请输入小类`, trigger: 'blur' }]" label-width="0">
|
|
|
+ <el-input type="text" v-model="scope.row.smallName" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="" align="center" label="*规格型号">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item :prop="'goodsLibrarySpecList.' + scope.$index + '.specValue'" :rules="[{ required: true, message: `请输入规格型号`, trigger: 'blur' }]" label-width="0">
|
|
|
+ <el-input type="text" v-model="scope.row.specValue" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="" align="center" label="*参考销售价格">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item :prop="'goodsLibrarySpecList.' + scope.$index + '.price'" :rules="[{ required: true, message: `请输入参考销售价格`, trigger: 'blur' },{ pattern:/^(([0-9]\d*)|([0][.]{1}[0-9]{0,2}[1-9]+)|([1-9]\d*[.]{1}[0-9]+))$/g, message: '请输入大于等于0的数', trigger: 'blur' }]" label-width="0">
|
|
|
+ <el-input type="number" v-model="scope.row.price" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="" align="center" label="*参考划线价格">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item :prop="'goodsLibrarySpecList.' + scope.$index + '.orgPrice'" :rules="[{ required: true, message: `请输入参考划线价格`, trigger: 'blur' },{ pattern:/^(([0-9]\d*)|([0][.]{1}[0-9]{0,2}[1-9]+)|([1-9]\d*[.]{1}[0-9]+))$/g, message: '请输入大于等于0的数', trigger: 'blur' }]" label-width="0">
|
|
|
+ <el-input type="number" v-model="scope.row.orgPrice" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="" align="center" label="*参考成本价">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item :prop="'goodsLibrarySpecList.' + scope.$index + '.costPrice'" :rules="[{ required: true, message: `请输入参考成本价`, trigger: 'blur' },{ pattern:/^(([0-9]\d*)|([0][.]{1}[0-9]{0,2}[1-9]+)|([1-9]\d*[.]{1}[0-9]+))$/g, message: '请输入大于等于0的数', trigger: 'blur' }]" label-width="0">
|
|
|
+ <el-input type="number" v-model="scope.row.costPrice" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="" align="center" label="*参考佣金">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item :prop="'goodsLibrarySpecList.' + scope.$index + '.shareAmount'" :rules="[{ required: true, message: `请输入参考佣金`, trigger: 'blur' },{ pattern:/^(([0-9]\d*)|([0][.]{1}[0-9]{0,2}[1-9]+)|([1-9]\d*[.]{1}[0-9]+))$/g, message: '请输入大于等于0的数', trigger: 'blur' }]" label-width="0">
|
|
|
+ <el-input type="number" v-model="scope.row.shareAmount" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="" align="center" label="*参考内部佣金">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item :prop="'goodsLibrarySpecList.' + scope.$index + '.innerShareAmount'" :rules="[{ required: true, message: `请输入参考内部佣金`, trigger: 'blur' },{ pattern:/^(([0-9]\d*)|([0][.]{1}[0-9]{0,2}[1-9]+)|([1-9]\d*[.]{1}[0-9]+))$/g, message: '请输入大于等于0的数', trigger: 'blur' }]" label-width="0">
|
|
|
+ <el-input type="number" v-model="scope.row.innerShareAmount" disabled placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="" align="center" label="*参考规格图片">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item :prop="'goodsLibrarySpecList.' + scope.$index + '.imgUrl'" :rules="[{ required: true, message: `请上传参考规格图片`, trigger: 'change' }]" label-width="0">
|
|
|
+ <div class="flex_ac">
|
|
|
+ <ImageUpload :fileList="scope.row.imgUrl" :limit="1" :download="false" :viewOnline="false" :isEdit="false" modType="text" :fileType="['image']"/>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>详情内容</span>
|
|
|
+ </div>
|
|
|
+ <div class="mymain-container">
|
|
|
+ <el-row :gutter="20" justify="start">
|
|
|
+ <el-form-item label="详情内容" prop="content" :rules="[{ required: true, message: `请输入详情内容`, trigger: 'change' }]">
|
|
|
+ <quillEditor v-model="formData.content"></quillEditor>
|
|
|
+ <input type="hidden" v-model="formData.content">
|
|
|
+ </el-form-item>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="footer">
|
|
|
+ <el-button size="mini" @click="isShowDetail = false">返回</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
</template-page>
|
|
|
</template>
|
|
|
|
|
|
@@ -14,9 +190,11 @@
|
|
|
import { required, mobileRequired, mobile } from '@/components/template/rules_verify.js'
|
|
|
import { listPageV2, pageExport, save, del, getDetail, batch, sync } from "@/api/goodsWarehouse";
|
|
|
import operation_mixin from '@/components/template/operation_mixin.js'
|
|
|
+ import ImageUpload from '@/components/file-upload'
|
|
|
+ import quillEditor from '@/components/v-quill-editor'
|
|
|
export default {
|
|
|
components: {
|
|
|
- TemplatePage
|
|
|
+ TemplatePage,ImageUpload,quillEditor
|
|
|
},
|
|
|
mixins: [operation_mixin],
|
|
|
props: ['isSelectShop'],
|
|
|
@@ -59,7 +237,8 @@
|
|
|
stepIndex: 1,
|
|
|
isEdit: 0,
|
|
|
editSpecImageIdx: 0,
|
|
|
- isShowTab: true
|
|
|
+ isShowTab: true,
|
|
|
+ isShowDetail: false
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
@@ -124,15 +303,38 @@
|
|
|
this.recordSelected = data
|
|
|
},
|
|
|
// 表格操作列
|
|
|
- operation() {
|
|
|
- return this.operationBtn({
|
|
|
- viewDetail: {
|
|
|
- btnType: 'text',
|
|
|
- click: ({ row, index, column }) => {
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- })
|
|
|
+ operation(h, { row, index, column }) {
|
|
|
+ return (
|
|
|
+ <div class='operation-btns'>
|
|
|
+ <el-button type="text" onClick={() => {
|
|
|
+ this.isShowDetail = true
|
|
|
+ getDetail({
|
|
|
+ goodsLibraryId: row.goodsLibraryId
|
|
|
+ }).then(res => {
|
|
|
+ let imgs = []
|
|
|
+ let goodsLibrarySpecList = []
|
|
|
+ res.data.imgs.split(",").forEach(item=>{
|
|
|
+ imgs.push({
|
|
|
+ url: item
|
|
|
+ })
|
|
|
+ })
|
|
|
+ res.data.goodsLibrarySpecList.forEach(item=>{
|
|
|
+ goodsLibrarySpecList.push({
|
|
|
+ ...item,
|
|
|
+ imgUrl: item.imgUrl?[{url: item.imgUrl}]:[]
|
|
|
+ })
|
|
|
+ })
|
|
|
+ Object.assign(this.formData, res.data,{
|
|
|
+ imgUrl: res.data.imgUrl?[{url: res.data.imgUrl}]:[],
|
|
|
+ imgs: res.data.imgs?imgs:[],
|
|
|
+ vedio: res.data.vedio?[{url: res.data.vedio}]:[],
|
|
|
+ goodsLibrarySpecList
|
|
|
+ })
|
|
|
+ console.log(this.formData,imgs)
|
|
|
+ })
|
|
|
+ }}>查看详情</el-button>
|
|
|
+ </div>
|
|
|
+ )
|
|
|
},
|
|
|
formCancel() {
|
|
|
this.formVisible = false
|
pengyh