Skip to content

L
linshenxs-shop
Commit 37a5f53e by cpa
Options

规格修改

parent a58dc8e5
Showing with 193 additions and 81 deletions
src/views/businessGoods/components/addSpec.vue 0 → 100644
<template>
<el-dialog :title="topTitle"
:visible.sync="show"
:close-on-click-modal="false"
:before-close="handleClose" append-to-body >
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="选择规格名称" prop="specName"
:initDropDownBox="initDropDownBox">
<avue-select v-model="form.specName" @change="getSpecValue" placeholder="选择规格名称" type="tree" :dic="dic" ></avue-select>
</el-form-item>
<el-form-item label="选择规格值" prop="specValueStr">
<el-checkbox-group v-model="specValueStr" size="medium">
<el-checkbox-button v-for="city in cities" :label="city" :key="city">{{city}}</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
</el-form>
<!-- 底部 -->
<span slot="footer" class="dialog-footer">
<el-button type="primary" :loading="loading" @click="onSubmit" style="width: 200px; height: 40px;display:block;margin:0 auto;" >确认添加</el-button>
</span>
</el-dialog>
</template>
<script>
import {ZmMixin} from '@/mixins/ZmMixin.js'
export default {
props: {
show: Boolean,
},
mixins: [ZmMixin],
components: {
},
computed: {
topTitle() {
return '添加规格'
},
initDropDownBox(){
this.$axios.get("/general/mallGoodsSpec/dropDownBox").then(e =>{
this.dic=Object.values(e.data)
})
}
},
watch: {},
data() {
return {
dic:[],
value:'选择规格名称',//下拉
specValueStr: [],
cities: [],
inputVisible: false,
inputValue: '',
loading: false,
form: {
specName: '',
specValueStr:'',
},
rules: {},
}
},
methods: {
// 下拉框值变更事件：获取规格值
getSpecValue(val){
if(val!==undefined && val!==''){
this.$axios.get("/general/mallGoodsSpecValue/multiSelectButton",{
params:{specId:val}
}).then(response => {
this.cities=Object.values(response.data)
return response.data
}, error => {
console.log('错误', error.message)
})
}
},
handleClose() {
this.$emit('close')
},
handleCloseTag(tag) {
this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
},
showInput() {
this.inputVisible = true;
this.$nextTick(_ => {
this.$refs.saveTagInput.$refs.input.focus();
});
},
handleInputConfirm() {
let inputValue = this.inputValue;
if (inputValue) {
this.dynamicTags.push(inputValue);
}
this.inputVisible = false;
this.inputValue = '';
},
onSubmit() {
this.$refs.elTable.style.display='none'
this.handleClose()
}
},
}
</script>
<style>
.el-tag + .el-tag {
margin-left: 10px;
}
</style>
src/views/businessGoods/goodsEdit/goods_api.js
...@@ -15,6 +15,15 @@ export function searchSpecByName(query) { ...@@ -15,6 +15,15 @@ export function searchSpecByName(query) {
}) })
} }
export function searchSpecByClassId(query) {
return request({
url: '/admin/mallGoodsSpec/getSpecByClassId',
method: 'get',
params: query
})
}
export function getSpecValue(query) { export function getSpecValue(query) {
return request({ return request({
url: '/admin/mallGoodsSpec/getSpecValueById', url: '/admin/mallGoodsSpec/getSpecValueById',
...@@ -25,16 +34,19 @@ export function getSpecValue(query) { ...@@ -25,16 +34,19 @@ export function getSpecValue(query) {
export function getGoodsDetails(query) { export function getGoodsDetails(query) {
return request({ return request({
url: '/admin/mallGoodsSpec/getDetails', url: '/admin/mallGoods/getDetailsById',
method: 'get', method: 'get',
params: query params: query
}) })
} }
export function addOrEditGoods(data) { export function addOrEditGoods(data) {
return request({ return request({
url: '/admin/merchantMallGoods/addOrEditGoods', url: '/admin/mallGoods/addOrEditGoods',
method: 'get', method: 'post',
params: data params: data
}) })
} }
src/views/businessGoods/goodsEdit/goods_edit.vue
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
添加规格</el-button> 添加规格</el-button>
<el-table :data="form.skus" size="mini"> <el-table :data="form.skus" size="mini">
<el-table-column v-for="(spec, index) in specs" :label="spec.specName" width="120"> <el-table-column v-for="(spec, index) in specs" :key="index" :label="spec.specName" width="120">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{titleValue(spec, scope.row)}}</span> <span>{{titleValue(spec, scope.row)}}</span>
...@@ -35,14 +35,14 @@ ...@@ -35,14 +35,14 @@
</el-table-column> </el-table-column>
<el-table-column label="商家价格" width="170"> <el-table-column label="商家价格" width="160">
<template slot-scope="scope"> <template slot-scope="scope">
<el-input-number v-model="scope.row.merchantPrice" :precision="2" :step="1" :min="0"> <el-input-number v-model="scope.row.merchantPrice" :precision="2" :step="1" :min="0">
</el-input-number> </el-input-number>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="售卖价格" width="170"> <el-table-column label="售卖价格" width="160">
<template slot-scope="scope"> <template slot-scope="scope">
<el-input-number v-model="scope.row.sellPrice" :precision="2" :step="1" :min="0"> <el-input-number v-model="scope.row.sellPrice" :precision="2" :step="1" :min="0">
</el-input-number> </el-input-number>
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="商品库存" width="170"> <el-table-column label="商品库存" width="160">
<template slot-scope="scope"> <template slot-scope="scope">
<el-input-number v-model="scope.row.stock" :step="1" :min="0"></el-input-number> <el-input-number v-model="scope.row.stock" :step="1" :min="0"></el-input-number>
</template> </template>
...@@ -85,12 +85,6 @@ ...@@ -85,12 +85,6 @@
<span class="sug">上传视频，建议视频长度1分钟，仅支持MP4格式</span> <span class="sug">上传视频，建议视频长度1分钟，仅支持MP4格式</span>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="商品认证视频" prop="authUrl" v-if="this.needVideoProof===0">
<div class="upload">
<uploader :lazyList="form.authUrl" :video="true" :image="false" @change="(list) => { form.authUrl = list.join(',') }" />
<span class="sug">上传视频，建议视频长度1分钟，仅支持MP4格式</span>
</div>
</el-form-item>
</div> </div>
<div class="zm_info_row"> <div class="zm_info_row">
...@@ -183,7 +177,7 @@ ...@@ -183,7 +177,7 @@
</span> </span>
<!-- 规格显示控件 --> <!-- 规格显示控件 -->
<type-select v-if="this.form.goodsClassId != undefined" :show="showSpecList" :classifyId="this.form.goodsClassId" <type-select v-if="this.form.goodsClassId != undefined" :show="showSpecList" :classId="this.form.goodsClassId"
@chosen="onChosen" @close="showSpecList = false" /> @chosen="onChosen" @close="showSpecList = false" />
</div> </div>
...@@ -192,9 +186,7 @@ ...@@ -192,9 +186,7 @@
<script> <script>
import {getMerchantByAccount} from "@/api/mall/merchantMallgoods"; let DBG = false
let DBG = true
import { import {
ZmMixin ZmMixin
} from '@/mixins/ZmMixin.js' } from '@/mixins/ZmMixin.js'
...@@ -206,9 +198,9 @@ ...@@ -206,9 +198,9 @@
import { import {
getClassifyDropDown, getClassifyDropDown,
getGoodsDetails, getGoodsDetails,
addOrEditGoods addOrEditGoods,
addOrEdit
} from './goods_api.js' } from './goods_api.js'
import {fetchList} from "@/api/mall/merchantMallorder";
export default { export default {
mixins: [ZmMixin], mixins: [ZmMixin],
components: { components: {
...@@ -218,7 +210,6 @@ ...@@ -218,7 +210,6 @@
}, },
data() { data() {
return { return {
needVideoProof:2,
//如果是编辑则需要id //如果是编辑则需要id
id: undefined, id: undefined,
//如果是编辑则需要加载数据 //如果是编辑则需要加载数据
...@@ -229,10 +220,8 @@ ...@@ -229,10 +220,8 @@
specs: [], specs: [],
//表单数据 //表单数据
form: { form: {
merchantId:'', goodsName: "",
goodsName: "1", goodsClassId: "",
goodsClassId: "1",
skus: [],
listImage: "", listImage: "",
detailImage: "", detailImage: "",
videoUrl: "", videoUrl: "",
...@@ -244,7 +233,8 @@ ...@@ -244,7 +233,8 @@
needVideo: true, needVideo: true,
needContract: true, needContract: true,
needDelivery: true, needDelivery: true,
hireRate: 0 hireRate: 0,
skus: [],
}, },
//分类数据 //分类数据
classOptions: [], classOptions: [],
...@@ -380,24 +370,9 @@ ...@@ -380,24 +370,9 @@
} }
} }
}, },
created() {
let userInfo= JSON.parse(sessionStorage.getItem("linshenxs-userInfo"))
let account=userInfo.content.username
getMerchantByAccount(
{account: account}
).then(response => {
this.form.merchantId=response.data.data.id
this.needVideoProof=response.data.data.needVideoProof
})
},
computed: { computed: {
//点前页面标题 //点前页面标题
editTitle() { editTitle() {
return this.id ? "编辑商品基础信息" : "添加商品基础信息" return this.id ? "编辑商品基础信息" : "添加商品基础信息"
}, },
//能否选择规格 //能否选择规格
...@@ -419,6 +394,9 @@ ...@@ -419,6 +394,9 @@
methods: { methods: {
//重新加载 //重新加载
reload(id) { reload(id) {
if(id == undefined) {
this.clearData()
}
this.loading = true this.loading = true
getClassifyDropDown() getClassifyDropDown()
.then(r => { .then(r => {
...@@ -443,9 +421,29 @@ ...@@ -443,9 +421,29 @@
}) })
.catch(e => { .catch(e => {
this.loading = false this.loading = false
console.log(e)
}) })
}, },
//清除数据
clearData() {
this.form = {
goodsName: "",
goodsClassId: "",
listImage: "",
detailImage: "",
videoUrl: "",
authUrl: "",
details: "",
fakeNumber: 0,
needReal: true,
payWithA: true,
needVideo: true,
needContract: true,
needDelivery: true,
hireRate: 0,
skus: [],
}
},
//回填数据 //回填数据
refill(data) { refill(data) {
let skus = data.skus let skus = data.skus
...@@ -683,14 +681,11 @@ ...@@ -683,14 +681,11 @@
//点击退出 //点击退出
handleClose() { handleClose() {
this.$emit('close') this.$emit('close')
// this.$router.push('/index')
// this.$router.go(-1)
}, },
//点击确认 //点击确认
onSubmit() { onSubmit() {
this.$refs['refForm'].validate((valid) => { this.$refs['refForm'].validate((valid) => {
if(valid) { if(valid) {
console.log("valid"+valid)
this.doSubmit() this.doSubmit()
} }
}) })
...@@ -770,4 +765,8 @@ ...@@ -770,4 +765,8 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
>>> .el-input-number__increase {
right: 1px!important
}
</style> </style>
src/views/businessGoods/goodsEdit/goods_edit_pop.vue
...@@ -23,9 +23,6 @@ ...@@ -23,9 +23,6 @@
}, },
computed: { computed: {
topTitle() { topTitle() {
if(this.id>=0&&this.id!=undefined){
return "编辑商品"
}
return "新增商品" return "新增商品"
} }
}, },
......
src/views/businessGoods/goodsEdit/mock_data.js
export const mock = { export const mock = {
"goodsName": "你行你上", "goodsName": "老牛批了",
"goodsClassId": 1, "goodsClassId": 1,
"skus": [ "skus": [
{ {
...@@ -19,7 +19,7 @@ export const mock = { ...@@ -19,7 +19,7 @@ export const mock = {
], ],
"merchantPrice": 10, "merchantPrice": 10,
"sellPrice": 50, "sellPrice": 50,
"goodsImage": "https://s.cn.bing.net/th?id=OJ.yL3aH2PmKyuCjQ", "goodsImage": "http://linshenxs.oss-cn-beijing.aliyuncs.com/images/9941abc6gy1g4s9kdz3d1j205k05kt8o.jpg",
"stock": 10 "stock": 10
}, },
{ {
......
src/views/businessGoods/goodsEdit/type_select.vue
...@@ -10,23 +10,14 @@ ...@@ -10,23 +10,14 @@
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> <el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="选择规格" prop="class"> <el-form-item label="选择规格" prop="class">
<el-select <el-select v-model="form.class" filterable placeholder="请选择规格" @change="onSelect">
v-model="form.class"
filterable
remote
reserve-keyword
placeholder="搜索规格名称"
@change="onSelect"
:remote-method="remoteMethod"
:disabled="valuing"
:loading="searching">
<el-option <el-option
v-for="item in options" v-for="item in options"
:key="item.value" :key="item.value"
:label="item.label" :label="item.label"
:value="item.value"> :value="item.value">
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="选择规格值" prop="value"> <el-form-item label="选择规格值" prop="value">
...@@ -55,7 +46,7 @@ ...@@ -55,7 +46,7 @@
} from '@/mixins/ZmMixin.js' } from '@/mixins/ZmMixin.js'
import { import {
searchSpecByName, searchSpecByClassId,
getSpecValue getSpecValue
} from './goods_api.js' } from './goods_api.js'
...@@ -63,7 +54,7 @@ ...@@ -63,7 +54,7 @@
mixins: [ZmMixin], mixins: [ZmMixin],
props: { props: {
show: Boolean, show: Boolean,
classifyId: [String, Number] classId: [String, Number]
}, },
data() { data() {
return { return {
...@@ -97,6 +88,7 @@ ...@@ -97,6 +88,7 @@
this.values = [] this.values = []
this.form.class = "" this.form.class = ""
this.form.value = [] this.form.value = []
this.remoteMethod()
} }
} }
}, },
...@@ -104,26 +96,21 @@ ...@@ -104,26 +96,21 @@
handleClose() { handleClose() {
this.$emit('close') this.$emit('close')
}, },
remoteMethod(query) { remoteMethod() {
this.options = [] this.options = []
if(query !== '') { searchSpecByClassId({classId: this.classId})
this.searching = true .then(z => {
searchSpecByName({specName: query, classifyId: this.classifyId}) let r = this.zmRes(z)
.then(z => { if(r) {
this.searching = false this.options = r.map(r => {
let r = this.zmRes(z) return {
if(r) { label: r.specName,
this.options = r.map(r => { value: r.id
return { }})
label: r.specName, }
value: r.id })
}}) .catch(e => {
} })
})
.catch(e => {
this.searching = false
})
}
}, },
onSelect(select) { onSelect(select) {
if(select) { if(select) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment