陈伟 8 months ago
commit 89aa484150
  1. 179
      src/views/dataCenter/goods/Create.vue
  2. 170
      src/views/dataCenter/goods/Update.vue

@ -324,6 +324,44 @@
<a-input-number v-decorator="['sales_initial', { initialValue: 0}]" />
</a-form-item>
<div >
<a-divider orientation="left">销售区域</a-divider>
<a-form-item label="销售区域" :labelCol="labelCol" :wrapperCol="{ span: 15 }">
<a-table
v-show="ruleList.length"
class="table-rules"
:columns="columns"
:dataSource="ruleList"
:pagination="false"
bordered
>
<!-- 销售区域 -->
<template slot="region_text" slot-scope="text, item, index">
<p class="content">
<span v-for="(province, pidx) in text" :key="pidx">
<span>{{ province.name }}</span>
<template v-if="province.citys.length">
<span>(</span>
<span
class="city-name"
v-for="(city, cidx) in province.citys"
:key="cidx"
>{{ city.name }}{{ province.citys.length > cidx + 1 ? '、': '' }}</span>
<span>)</span>
</template>
<span>{{ ' ' }}</span>
</span>
</p>
<p class="operation">
<a href="javascript:void(0);" class="edit" @click="handleEdit(index, item)">编辑</a>
<a href="javascript:void(0);" class="delete" @click="handleDelete(index)">删除</a>
</p>
</template>
</a-table>
<a-button icon="environment" @click="handleAdd">点击添加销售区域</a-button>
</a-form-item>
</div>
<div >
<a-divider orientation="left">积分设置</a-divider>
<a-form-item
@ -450,6 +488,8 @@
<a-button type="primary" html-type="submit" :loading="isBtnLoading">提交</a-button>
</a-form-item>
</a-form>
<AreasModal ref="AreasModal" @handleSubmit="handleAreaSubmit" />
</a-spin>
</a-card>
</template>
@ -459,6 +499,18 @@ import * as GoodsApi from '@/api/goods'
import { SelectImage, SelectVideo, Ueditor, InputNumberGroup } from '@/components'
import GoodsModel from '@/common/model/goods/Index'
import { GoodsType, MultiSpec } from './modules'
import { AreasModal } from '@/components/Modal'
import Region from '@/common/model/Region'
const defaultItem = {
key: 0,
// first: 1,
// first_fee: 0,
// additional: 0,
// additional_fee: 0,
region: [],
region_text: []
}
export default {
components: {
@ -467,7 +519,8 @@ export default {
SelectVideo,
Ueditor,
InputNumberGroup,
MultiSpec
MultiSpec,
AreasModal
},
data () {
return {
@ -483,7 +536,42 @@ export default {
//
form: this.$form.createForm(this),
//
formData: GoodsModel.formData
formData: GoodsModel.formData,
columns: [
{
title: '销售区域',
dataIndex: 'region_text',
width: '400px',
scopedSlots: { customRender: 'region_text' }
}
// {
// title: ' ()',
// dataIndex: 'first',
// scopedSlots: { customRender: 'first' }
// },
// {
// title: '()',
// dataIndex: 'first_fee',
// scopedSlots: { customRender: 'first_fee' }
// },
// {
// title: ' ()',
// dataIndex: 'additional',
// scopedSlots: { customRender: 'additional' }
// },
// {
// title: '()',
// dataIndex: 'additional_fee',
// scopedSlots: { customRender: 'additional_fee' }
// }
],
// table
ruleList: [],
//
method: 10,
//
citysCount: null
}
},
//
@ -494,6 +582,11 @@ export default {
.then(() => {
this.isLoading = false
})
//
Region.getCitysCount().then(count => {
this.citysCount = count
})
},
methods: {
@ -540,7 +633,8 @@ export default {
handleSubmit (e) {
e.preventDefault()
//
const { form: { validateFields } } = this
console.log(this.form)
const { form: { validateFields }, ruleList } = this
validateFields((errors, values) => {
// tab
if (errors) {
@ -561,6 +655,7 @@ export default {
values.categoryIds = values.categorys.map(item => item.value)
delete values.categorys
// api
values.rules = ruleList
this.onFormSubmit(values)
return true
})
@ -602,6 +697,67 @@ export default {
this.isBtnLoading = false
})
.finally(() => this.isLoading = false)
},
//
handleAdd () {
const index = this.ruleList.length
const newItem = { ...defaultItem, key: index }
// id(id)
const excludedCityIds = this.getExcludedCityIds()
if (excludedCityIds.length === this.citysCount) {
this.$message.error('已选择了所有的区域', 0.8)
return false
}
//
this.handleAreasModal('add', index, newItem, excludedCityIds)
},
//
handleEdit (index, item) {
// id(id)
const excludedCityIds = this.getExcludedCityIds()
//
this.handleAreasModal('edit', index, item, excludedCityIds)
},
//
handleAreaSubmit (result) {
console.log(JSON.stringify(this.ruleList))
const { custom: { scene, item } } = result
item.region = result.selectedCityIds
item.region_text = result.selectedText
if (scene === 'add') {
this.ruleList.push(item)
}
},
// id(id)
getExcludedCityIds () {
const excludedCityIds = []
this.ruleList.forEach(item => {
item.region.forEach(cityId => {
excludedCityIds.push(cityId)
})
})
return excludedCityIds
},
//
handleAreasModal (scene, index, item, excludedCityIds) {
this.$refs.AreasModal.handle({ scene, index, item }, item.region, excludedCityIds)
},
//
handleDelete (index) {
const app = this
const modal = this.$confirm({
title: '您确定要删除该记录吗?',
onOk () {
app.ruleList.splice(index, 1)
modal.destroy()
}
})
}
}
@ -610,4 +766,21 @@ export default {
</script>
<style lang="less" scoped>
@import './style.less';
.table-rules {
.operation {
text-align: right;
a {
font-size: @font-size-base;
margin-left: 6px;
}
}
.content {
color: #505050;
white-space: normal;
.city-name {
font-size: 12.5px;
color: #7b7b7b;
}
}
}
</style>

@ -56,7 +56,7 @@
<a-form-item label="是否大牌正品" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-radio-group
v-decorator="['is_brand', { initialValue: 0, rules: [{ required: true }] }]"
v-decorator="['is_brand', { initialValue: 0, rules: [{ required: true }] }]"
>
<a-radio :value="0"></a-radio>
<a-radio :value="1"></a-radio>
@ -65,7 +65,7 @@
<a-form-item label="是否新品首发" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-radio-group
v-decorator="['is_new', { initialValue: 0, rules: [{ required: true }] }]"
v-decorator="['is_new', { initialValue: 0, rules: [{ required: true }] }]"
>
<a-radio :value="0"></a-radio>
<a-radio :value="1"></a-radio>
@ -340,6 +340,44 @@
<a-input-number v-decorator="['sales_initial', { initialValue: 0}]" />
</a-form-item>
<div >
<a-divider orientation="left">销售区域</a-divider>
<a-form-item label="销售区域" :labelCol="labelCol" :wrapperCol="{ span: 15 }">
<a-table
v-show="ruleList.length"
class="table-rules"
:columns="columns"
:dataSource="ruleList"
:pagination="false"
bordered
>
<!-- 销售区域 -->
<template slot="region_text" slot-scope="text, item, index">
<p class="content">
<span v-for="(province, pidx) in text" :key="pidx">
<span>{{ province.name }}</span>
<template v-if="province.citys.length">
<span>(</span>
<span
class="city-name"
v-for="(city, cidx) in province.citys"
:key="cidx"
>{{ city.name }}{{ province.citys.length > cidx + 1 ? '、': '' }}</span>
<span>)</span>
</template>
<span>{{ ' ' }}</span>
</span>
</p>
<p class="operation">
<a href="javascript:void(0);" class="edit" @click="handleEdit(index, item)">编辑</a>
<a href="javascript:void(0);" class="delete" @click="handleDelete(index)">删除</a>
</p>
</template>
</a-table>
<a-button icon="environment" @click="handleAdd">点击添加销售区域</a-button>
</a-form-item>
</div>
<div >
<a-divider orientation="left">积分设置</a-divider>
<a-form-item
@ -407,8 +445,8 @@
addonAfter="折"
:inputProps="{ min: 0, max: 9.9 }"
v-decorator="[`alone_grade_equity[grade_id:${item.grade_id}]`, {
initialValue: formData.defaultUserGradeValue[item.grade_id], rules: [{ required: true, message: '折扣率不能为空'}]
}]"
initialValue: formData.defaultUserGradeValue[item.grade_id], rules: [{ required: true, message: '折扣率不能为空'}]
}]"
/>
</a-form-item>
</div>
@ -466,16 +504,25 @@
<a-button type="primary" html-type="submit" :loading="isBtnLoading">提交</a-button>
</a-form-item>
</a-form>
<AreasModal ref="AreasModal" @handleSubmit="handleAreaSubmit" />
</a-spin>
</a-card>
</template>
<script>
import * as GoodsApi from '@/api/goods'
import { SelectImage, SelectGoods,SelectVideo, Ueditor, InputNumberGroup } from '@/components'
import { SelectImage, SelectGoods, SelectVideo, Ueditor, InputNumberGroup } from '@/components'
import GoodsModel from '@/common/model/goods/Index'
import { GoodsType, MultiSpec } from './modules'
import { isEmptyObject } from '@/utils/util'
import { AreasModal } from '@/components/Modal'
import Region from '@/common/model/Region'
const defaultItem = {
key: 0,
region: [],
region_text: []
}
export default {
components: {
GoodsType,
@ -484,7 +531,9 @@ export default {
SelectVideo,
Ueditor,
InputNumberGroup,
MultiSpec
MultiSpec,
AreasModal,
Region
},
data () {
return {
@ -503,7 +552,21 @@ export default {
goodsId: null,
//
formData: GoodsModel.formData,
checkList:[]
checkList: [],
//
ruleList: [
],
//
columns: [
{
title: '销售区域',
dataIndex: 'region_text',
width: '400px',
scopedSlots: { customRender: 'region_text' }
}
],
//
citysCount: null
}
},
watch: {
@ -520,6 +583,11 @@ export default {
//
this.initData()
this.getDataList()
//
Region.getCitysCount().then(count => {
this.citysCount = count
})
},
beforeDestroy () {
//
@ -545,6 +613,7 @@ export default {
this.onForceUpdate()
})
}
// this.ruleList = record.rule.map((item, index) => { return { ...item, key: index } })
this.isLoading = false
})
},
@ -590,15 +659,14 @@ export default {
//
getDataList () {
return GoodsApi.list().then(result => {
this.checkList=result.data.list.data
this.checkList = result.data.list.data
})
},
//
handleSubmit (e) {
e.preventDefault()
//
console.log(this.form)
const { form: { validateFields } } = this
const { form: { validateFields }, ruleList } = this
validateFields((errors, values) => {
// tab
if (errors) {
@ -619,6 +687,7 @@ export default {
values.categoryIds = values.categorys.map(item => item.value)
delete values.categorys
// api
values.rules = ruleList
this.onFormSubmit(values)
return true
})
@ -629,7 +698,7 @@ export default {
// tabKey
//
const tabsFieldsMap = [
['goods_type', 'goods_name', 'categorys', 'imagesIds', 'delivery_id', 'is_ind_delivery_type', 'delivery_type','is_brand', 'is_in_store'],
['goods_type', 'goods_name', 'categorys', 'imagesIds', 'delivery_id', 'is_ind_delivery_type', 'delivery_type', 'is_brand', 'is_in_store'],
['spec_type', 'goods_price', 'is_restrict', 'restrict_total', 'restrict_single', 'cost_price'],
['content'],
['alone_grade_equity', 'first_money', 'second_money', 'third_money']
@ -660,6 +729,68 @@ export default {
this.isBtnLoading = false
})
.finally(() => this.isLoading = false)
},
//
handleAdd () {
const index = this.ruleList.length
const newItem = { ...defaultItem, key: index }
// id(id)
const excludedCityIds = this.getExcludedCityIds()
if (excludedCityIds.length === this.citysCount) {
this.$message.error('已选择了所有的区域', 0.8)
return false
}
//
this.handleAreasModal('add', index, newItem, excludedCityIds)
},
//
handleEdit (index, item) {
// id(id)
const excludedCityIds = this.getExcludedCityIds()
//
this.handleAreasModal('edit', index, item, excludedCityIds)
},
//
handleAreaSubmit (result) {
console.log(JSON.stringify(this.ruleList))
const { custom: { scene, item } } = result
item.region = result.selectedCityIds
item.region_text = result.selectedText
if (scene === 'add') {
this.ruleList.push(item)
}
},
// id(id)
getExcludedCityIds () {
const excludedCityIds = []
this.ruleList.forEach(item => {
item.region.forEach(cityId => {
excludedCityIds.push(cityId)
})
})
console.log(excludedCityIds)
return excludedCityIds
},
//
handleAreasModal (scene, index, item, excludedCityIds) {
this.$refs.AreasModal.handle({ scene, index, item }, item.region, excludedCityIds)
},
//
handleDelete (index) {
const app = this
const modal = this.$confirm({
title: '您确定要删除该记录吗?',
onOk () {
app.ruleList.splice(index, 1)
modal.destroy()
}
})
}
}
@ -668,4 +799,21 @@ export default {
</script>
<style lang="less" scoped>
@import './style.less';
.table-rules {
.operation {
text-align: right;
a {
font-size: @font-size-base;
margin-left: 6px;
}
}
.content {
color: #505050;
white-space: normal;
.city-name {
font-size: 12.5px;
color: #7b7b7b;
}
}
}
</style>

Loading…
Cancel
Save