wangmingchuan
/
yanzong_vue_admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'main' of http://git.njrzwl.cn:3000/wangmingchuan/yanzong_vue_admin

Browse Source
main
陈伟 9 months ago
parent 191cf8513e cbe6195212
commit 89aa484150
2 changed files with 335 additions and 14 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 179
      src/views/dataCenter/goods/Create.vue
  2. 162
      src/views/dataCenter/goods/Update.vue

179
src/views/dataCenter/goods/Create.vue
Unescape View File

@ -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>

162
src/views/dataCenter/goods/Update.vue
Unescape View File

@ -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
@ -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>

Write Preview
Loading…
Cancel
Save