添加：总平台添加商品
This commit is contained in:
parent
79c7068c44
commit
ca198a4c11
|
|
@ -1,4 +1,3 @@
|
|||
|
||||
import request from './request'
|
||||
|
||||
/**
|
||||
|
|
@ -37,3 +36,47 @@ export function expressStatuseApi(id, is_show) {
|
|||
export function syncExpressApi() {
|
||||
return request.get('store/express/sync')
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* @description 运费模板 -- 城市
|
||||
*/
|
||||
export function cityList() {
|
||||
return request.get('system/city/lst')
|
||||
}
|
||||
export function cityListV2(pid) {
|
||||
return request.get('v2/system/city/lst/' + pid)
|
||||
}
|
||||
/**
|
||||
* @description 运费模板 -- 列表
|
||||
*/
|
||||
export function templateListApi(data) {
|
||||
return request.get('store/shipping/lst', data)
|
||||
}
|
||||
/**
|
||||
* @description 运费模板 -- 新增
|
||||
*/
|
||||
export function templateCreateApi(data) {
|
||||
return request.post('store/shipping/create', data)
|
||||
}
|
||||
/**
|
||||
* @description 运费模板 -- 编辑
|
||||
*/
|
||||
export function templateUpdateApi(id, data) {
|
||||
return request.post(`store/shipping/update/${id}`, data)
|
||||
}
|
||||
/**
|
||||
* @description 运费模板 -- 详情
|
||||
*/
|
||||
export function templateDetailApi(id) {
|
||||
return request.get(`/store/shipping/detail/${id}`)
|
||||
}
|
||||
/**
|
||||
* @description 运费模板 -- 删除
|
||||
*/
|
||||
export function templateDeleteApi(id) {
|
||||
return request.delete(`store/shipping/delete/${id}`)
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -42,6 +42,12 @@ export function storeCategoryStatusApi(id, status) {
|
|||
export function storeCategoryRecommendApi(id, status) {
|
||||
return request.post(`store/category/is_hot/${id}`, { status })
|
||||
}
|
||||
/**
|
||||
* @description 商品列表 -- 商户分类
|
||||
*/
|
||||
export function categorySelectApi() {
|
||||
return request.get(`store/category/select`)
|
||||
}
|
||||
/**
|
||||
* @description 品牌分类 -- 列表
|
||||
*/
|
||||
|
|
@ -72,6 +78,12 @@ export function brandCategoryDeleteApi(id) {
|
|||
export function brandCategoryStatusApi(id, status) {
|
||||
return request.post(`store/brand/category/status/${id}`, { status })
|
||||
}
|
||||
/**
|
||||
* @description 商品列表 -- 品牌分类
|
||||
*/
|
||||
export function categoryBrandListApi() {
|
||||
return request.get(`store/category/brandlist`)
|
||||
}
|
||||
/**
|
||||
* @description 品牌 -- 列表
|
||||
*/
|
||||
|
|
@ -420,6 +432,7 @@ export function guaranteeUpdateApi(id) {
|
|||
export function guaranteeDeleteApi(id) {
|
||||
return request.delete(`guarantee/delete/${id}`)
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 商品列表 -- 编辑排序
|
||||
*/
|
||||
|
|
@ -519,3 +532,67 @@ export function merSpecsList(data) {
|
|||
export function merProductLstApi(data) {
|
||||
return request.get(`store/product/list`, data)
|
||||
}
|
||||
// 复制商品 -- 剩余次数
|
||||
export function productCopyCountApi() {
|
||||
return request.get(`store/productcopy/count`)
|
||||
}
|
||||
// 商品列表 -- 运费模板筛选
|
||||
export function shippingListApi() {
|
||||
return request.get(`store/shipping/list`)
|
||||
}
|
||||
// 商品添加 -- 属性规则
|
||||
export function templateLsitApi() {
|
||||
return request.get(`/store/attr/template/list`)
|
||||
}
|
||||
// 添加商品 -- 参数筛选
|
||||
export function specsSelectedApi(data) {
|
||||
return request.get(`store/params/temp/select`,data)
|
||||
}
|
||||
// 配置状态
|
||||
export function productConfigApi() {
|
||||
return request.get(`store/product/config`)
|
||||
}
|
||||
// 属性规则 -- 添加
|
||||
export function attrCreatApi(data) {
|
||||
return request.post('store/attr/template/create', data)
|
||||
}
|
||||
// 商品列表 -- 立即生成规格
|
||||
export function generateAttrApi(id,data) {
|
||||
return request.post(`store/product/get_attr_value/${id}`, data)
|
||||
}
|
||||
// 服务保障 -- 添加
|
||||
export function guaranteeTemplateAddApi(data) {
|
||||
return request.post(`guaranteeTemplate/create`, data)
|
||||
}
|
||||
// 服务保障 - 搜索
|
||||
export function guaranteeTemplateSelectApi(data) {
|
||||
return request.get(`guaranteeTemplate/select`, data)
|
||||
}
|
||||
// 服务保障 - 详情
|
||||
export function guaranteeTemplateDetailApi(id) {
|
||||
return request.get(`guaranteeTemplate/detail/${id}`)
|
||||
}
|
||||
// 添加商品 -- 获取服务保障模板列表
|
||||
export function guaranteeTemplateListApi() {
|
||||
return request.get(`guaranteeTemplate/list`)
|
||||
}
|
||||
// 添加商品 -- 参数筛选详情
|
||||
export function productSpecsDetailApi(data) {
|
||||
return request.get(`store/params/temp/show`, data)
|
||||
}
|
||||
// 商品列表 -- 添加
|
||||
export function productCreateApi(data) {
|
||||
return request.post(`store/product/create`, data)
|
||||
}
|
||||
// 商品列表 -- 编辑
|
||||
export function productEditApi(id, data) {
|
||||
return request.post(`store/product/edit/${id}`, data)
|
||||
}
|
||||
// 商品列表 -- 商品上下架
|
||||
export function changeProductStatus(id, status) {
|
||||
return request.post(`store/product/change_status/${id}`, { status })
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,278 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-form ref="formDynamic" size="small" :model="formDynamic" :rules="rules" class="attrFrom mb20" label-width="100px" @submit.native.prevent>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="模板名称：" prop="template_name">
|
||||
<el-input v-model="formDynamic.template_name" placeholder="请输入模板名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col v-for="(item, index) in formDynamic.template_value" :key="index" :span="24" class="noForm">
|
||||
<el-form-item>
|
||||
<div class="acea-row row-middle"><span class="mr5">{{ item.value }}</span><i class="el-icon-circle-close" @click="handleRemove(index)" /></div>
|
||||
<div class="rulesBox">
|
||||
<el-tag
|
||||
v-for="(j, indexn) in item.detail"
|
||||
:key="indexn"
|
||||
closable
|
||||
size="medium"
|
||||
:disable-transitions="false"
|
||||
class="mb5 mr10"
|
||||
@close="handleClose(item.detail,indexn)"
|
||||
>
|
||||
{{ j }}
|
||||
</el-tag>
|
||||
<el-input
|
||||
v-if="item.inputVisible"
|
||||
ref="saveTagInput"
|
||||
v-model="item.detail.attrsVal"
|
||||
class="input-new-tag"
|
||||
size="small"
|
||||
maxlength="30"
|
||||
@keyup.enter.native="createAttr(item.detail.attrsVal,index)"
|
||||
@blur="createAttr(item.detail.attrsVal,index)"
|
||||
/>
|
||||
<el-button v-else class="button-new-tag" size="small" @click="showInput(item)">+ 添加</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col v-if="isBtn" :span="24" class="mt10" style="padding-left: 0;padding-right: 0;">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="规格：">
|
||||
<el-input v-model="attrsName" maxlength="30" placeholder="请输入规格" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="规格值：">
|
||||
<el-input v-model="attrsVal" maxlength="30" placeholder="请输入规格值" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-button type="primary" class="mr10" @click="createAttrName">确定</el-button>
|
||||
<el-button @click="offAttrName">取消</el-button>
|
||||
</el-col>
|
||||
</el-col>
|
||||
<Spin v-if="spinShow" size="large" fix />
|
||||
</el-row>
|
||||
<el-form-item>
|
||||
<el-button v-if="!isBtn" type="primary" icon="md-add" class="mt10" @click="addBtn">添加新规格</el-button>
|
||||
</el-form-item>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
<span class="footer acea-row">
|
||||
<el-button @click="resetForm('formDynamic')">取消</el-button>
|
||||
<el-button :loading="loading" type="primary" @click="handleSubmit('formDynamic')">确 定</el-button>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { attrCreatApi, attrEdittApi } from '@/api/product'
|
||||
export default {
|
||||
name: 'CreatAttr',
|
||||
props: {
|
||||
currentRow: {
|
||||
type: Object,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
inputVisible: false,
|
||||
inputValue: '',
|
||||
spinShow: false,
|
||||
loading: false,
|
||||
grid: {
|
||||
xl: 3,
|
||||
lg: 3,
|
||||
md: 12,
|
||||
sm: 24,
|
||||
xs: 24
|
||||
},
|
||||
modal: false,
|
||||
index: 1,
|
||||
rules: {
|
||||
template_name: [
|
||||
{ required: true, message: '请输入模板名称', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
formDynamic: {
|
||||
template_name: '',
|
||||
template_value: []
|
||||
},
|
||||
attrsName: '',
|
||||
attrsVal: '',
|
||||
formDynamicNameData: [],
|
||||
isBtn: false,
|
||||
formDynamicName: [],
|
||||
results: [],
|
||||
result: [],
|
||||
ids: 0
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
currentRow: {
|
||||
handler: function(val, oldVal) {
|
||||
this.formDynamic = val
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.formDynamic.template_value.map(item => {
|
||||
this.$set(item, 'inputVisible', false)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
resetForm(formName) {
|
||||
this.$msgbox.close()
|
||||
this.clear()
|
||||
this.$refs[formName].resetFields()
|
||||
},
|
||||
// 添加按钮
|
||||
addBtn() {
|
||||
this.isBtn = true
|
||||
},
|
||||
handleClose(item, index) {
|
||||
item.splice(index, 1)
|
||||
},
|
||||
// 取消
|
||||
offAttrName() {
|
||||
this.isBtn = false
|
||||
},
|
||||
// 删除
|
||||
handleRemove(index) {
|
||||
this.formDynamic.template_value.splice(index, 1)
|
||||
},
|
||||
// 添加规则名称
|
||||
createAttrName() {
|
||||
if (this.attrsName && this.attrsVal) {
|
||||
const data = {
|
||||
value: this.attrsName,
|
||||
detail: [
|
||||
this.attrsVal
|
||||
]
|
||||
}
|
||||
this.formDynamic.template_value.push(data)
|
||||
var hash = {}
|
||||
this.formDynamic.template_value = this.formDynamic.template_value.reduce(function(item, next) {
|
||||
/* eslint-disable */
|
||||
hash[next.value] ? '' : hash[next.value] = true && item.push(next);
|
||||
return item
|
||||
}, [])
|
||||
this.attrsName = '';
|
||||
this.attrsVal = '';
|
||||
this.isBtn = false;
|
||||
} else {
|
||||
if(!this.attrsName){
|
||||
this.$message.warning('请输入规格名称！');
|
||||
return
|
||||
}
|
||||
if(!this.attrsVal){
|
||||
this.$message.warning('请输入规格值！');
|
||||
return
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
// 添加属性
|
||||
createAttr (num, idx) {
|
||||
if (num) {
|
||||
this.formDynamic.template_value[idx].detail.push(num);
|
||||
var hash = {};
|
||||
this.formDynamic.template_value[idx].detail = this.formDynamic.template_value[idx].detail.reduce(function (item, next) {
|
||||
/* eslint-disable */
|
||||
hash[next] ? '' : hash[next] = true && item.push(next);
|
||||
return item
|
||||
}, [])
|
||||
this.formDynamic.template_value[idx].inputVisible = false
|
||||
} else {
|
||||
this.$message.warning('请添加属性');
|
||||
}
|
||||
},
|
||||
showInput(item) {
|
||||
this.$set(item, 'inputVisible', true)
|
||||
},
|
||||
// 提交
|
||||
handleSubmit (name) {
|
||||
this.$refs[name].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.formDynamic.template_value.length === 0) {
|
||||
return this.$message.warning('请至少添加一条属性规格！');
|
||||
}
|
||||
this.loading = true;
|
||||
setTimeout(() => {
|
||||
this.currentRow.attr_template_id? attrEdittApi(this.currentRow.attr_template_id,this.formDynamic).then(res => {
|
||||
this.$message.success(res.message);
|
||||
this.loading = false;
|
||||
setTimeout(() => {
|
||||
this.$msgbox.close()
|
||||
}, 500);
|
||||
setTimeout(() => {
|
||||
this.clear();
|
||||
this.$emit('getList');
|
||||
}, 600);
|
||||
}).catch(res => {
|
||||
this.loading = false;
|
||||
this.$message.error(res.message);
|
||||
}):attrCreatApi(this.formDynamic).then(res => {
|
||||
this.$message.success(res.message);
|
||||
this.loading = false;
|
||||
setTimeout(() => {
|
||||
this.$msgbox.close()
|
||||
}, 500);
|
||||
setTimeout(() => {
|
||||
this.$emit('getList');
|
||||
this.clear();
|
||||
}, 600);
|
||||
}).catch(res => {
|
||||
this.loading = false;
|
||||
this.$message.error(res.message);
|
||||
})
|
||||
}, 1200);
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
clear () {
|
||||
this.$refs['formDynamic'].resetFields();
|
||||
this.formDynamic.template_value = [];
|
||||
this.formDynamic.template_name=''
|
||||
this.isBtn = false;
|
||||
this.attrsName = '';
|
||||
this.attrsVal = '';
|
||||
},
|
||||
handleInputConfirm() {
|
||||
const inputValue = this.inputValue
|
||||
if (inputValue) {
|
||||
this.dynamicTags.push(inputValue)
|
||||
}
|
||||
this.inputVisible = false
|
||||
this.inputValue = ''
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.button-new-tag {
|
||||
height: 28px;
|
||||
line-height: 26px;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.input-new-tag {
|
||||
width: 90px;
|
||||
margin-left: 10px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
.footer{
|
||||
justify-content: flex-end;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,287 @@
|
|||
<template>
|
||||
<div class="divBox">
|
||||
<div class="header clearfix">
|
||||
<div class="container">
|
||||
<el-form inline size="small">
|
||||
<el-form-item label="优惠劵名称：">
|
||||
<el-input v-model="tableFrom.coupon_name" placeholder="请输入优惠券名称" @keyup.enter.native="getList" class="selWidth" size="small">
|
||||
<el-button slot="append" icon="el-icon-search" class="el-button-solt" size="small" @click="getList" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<el-table
|
||||
ref="table"
|
||||
v-loading="listLoading"
|
||||
:data="tableData.data"
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
max-height="400"
|
||||
tooltip-effect="dark"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column
|
||||
v-if="handle==='wu'"
|
||||
type="selection"
|
||||
width="55"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="coupon_id"
|
||||
label="ID"
|
||||
min-width="50"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="title"
|
||||
label="优惠券名称"
|
||||
min-width="120"
|
||||
/>
|
||||
<el-table-column
|
||||
label="优惠劵类型"
|
||||
min-width="80"
|
||||
>
|
||||
<template slot-scope="{ row }">
|
||||
<span>{{ row.type | couponTypeFilter }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="coupon_price"
|
||||
label="优惠券面值"
|
||||
min-width="90"
|
||||
/>
|
||||
<el-table-column
|
||||
label="最低消费额"
|
||||
min-width="90"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.use_min_price===0?'不限制':scope.row.use_min_price }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="有效期限"
|
||||
min-width="250"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.coupon_type===1?scope.row.use_start_time+' 一 '+scope.row.use_end_time:scope.row.coupon_time }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="剩余数量"
|
||||
min-width="90"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.is_limited===0 ? '不限量' : scope.row.remain_count }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="handle==='send'" label="操作" min-width="120" fixed="right" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" size="small" class="mr10" @click="send(scope.row.id)">发送</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="block mb20">
|
||||
<el-pagination
|
||||
:page-sizes="[10, 20, 40]"
|
||||
:page-size="tableFrom.limit"
|
||||
:current-page="tableFrom.page"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="tableData.total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="pageChange"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<el-button size="small" type="primary" class="fr" @click="ok">确定</el-button>
|
||||
<el-button size="small" class="fr mr20" @click="close">取消</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { couponSelectApi } from '@/api/marketing'
|
||||
import { roterPre } from '@/settings'
|
||||
export default {
|
||||
name: 'CouponList',
|
||||
props: {
|
||||
handle: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
couponId: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
keyNum: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
couponData: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
roterPre: roterPre,
|
||||
listLoading: true,
|
||||
tableData: {
|
||||
data: [],
|
||||
total: 0
|
||||
},
|
||||
tableFrom: {
|
||||
page: 1,
|
||||
limit: 10,
|
||||
coupon_name: '',
|
||||
send_type: 3
|
||||
},
|
||||
multipleSelection: [],
|
||||
attr: [],
|
||||
multipleSelectionAll: [],
|
||||
idKey: 'coupon_id',
|
||||
nextPageFlag: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
keyNum: {
|
||||
deep: true,
|
||||
handler(val) {
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.tableFrom.page = 1
|
||||
this.getList()
|
||||
this.multipleSelectionAll = this.couponData
|
||||
},
|
||||
watch:{
|
||||
couponData: {
|
||||
deep: true,
|
||||
handler(val) {
|
||||
this.multipleSelectionAll = this.couponData
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
close() {
|
||||
this.$msgbox.close()
|
||||
this.multipleSelection = []
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val
|
||||
setTimeout(() => {
|
||||
this.changePageCoreRecordData()
|
||||
}, 50)
|
||||
},
|
||||
// 设置选中的方法
|
||||
setSelectRow() {
|
||||
if (!this.multipleSelectionAll || this.multipleSelectionAll.length <= 0) {
|
||||
return
|
||||
}
|
||||
// 标识当前行的唯一键的名称
|
||||
const idKey = this.idKey
|
||||
const selectAllIds = []
|
||||
this.multipleSelectionAll.forEach(row => {
|
||||
selectAllIds.push(row[idKey])
|
||||
})
|
||||
this.$refs.table.clearSelection()
|
||||
for (var i = 0; i < this.tableData.data.length; i++) {
|
||||
if (selectAllIds.indexOf(this.tableData.data[i][idKey]) >= 0) {
|
||||
// 设置选中，记住table组件需要使用ref="table"
|
||||
this.$refs.table.toggleRowSelection(this.tableData.data[i], true)
|
||||
}
|
||||
}
|
||||
},
|
||||
// 记忆选择核心方法
|
||||
changePageCoreRecordData() {
|
||||
// 标识当前行的唯一键的名称
|
||||
const idKey = this.idKey
|
||||
const that = this
|
||||
// 如果总记忆中还没有选择的数据，那么就直接取当前页选中的数据，不需要后面一系列计算
|
||||
if (this.multipleSelectionAll.length <= 0) {
|
||||
this.multipleSelectionAll = this.multipleSelection
|
||||
return
|
||||
}
|
||||
// 总选择里面的key集合
|
||||
const selectAllIds = []
|
||||
this.multipleSelectionAll.forEach(row => {
|
||||
selectAllIds.push(row[idKey])
|
||||
})
|
||||
const selectIds = []
|
||||
// 获取当前页选中的id
|
||||
this.multipleSelection.forEach(row => {
|
||||
selectIds.push(row[idKey])
|
||||
// 如果总选择里面不包含当前页选中的数据，那么就加入到总选择集合里
|
||||
if (selectAllIds.indexOf(row[idKey]) < 0) {
|
||||
that.multipleSelectionAll.push(row)
|
||||
}
|
||||
})
|
||||
const noSelectIds = []
|
||||
// 得到当前页没有选中的id
|
||||
this.tableData.data.forEach(row => {
|
||||
if (selectIds.indexOf(row[idKey]) < 0) {
|
||||
noSelectIds.push(row[idKey])
|
||||
}
|
||||
})
|
||||
noSelectIds.forEach(id => {
|
||||
if (selectAllIds.indexOf(id) >= 0) {
|
||||
for (let i = 0; i < that.multipleSelectionAll.length; i++) {
|
||||
if (that.multipleSelectionAll[i][idKey] == id) {
|
||||
// 如果总选择中有未被选中的，那么就删除这条
|
||||
that.multipleSelectionAll.splice(i, 1)
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
ok() {
|
||||
if (this.multipleSelection.length > 0) {
|
||||
this.$emit('getCouponId', this.multipleSelectionAll)
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.warning('请先选择优惠劵')
|
||||
}
|
||||
},
|
||||
// 列表
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
couponSelectApi(this.tableFrom).then(res => {
|
||||
this.tableData.data = res.data.list
|
||||
this.tableData.total = res.data.count
|
||||
this.listLoading = false
|
||||
this.$nextTick(function() {
|
||||
this.setSelectRow()// 调用跨页选中方法
|
||||
})
|
||||
}).catch(res => {
|
||||
this.listLoading = false
|
||||
this.$message.error(res.message)
|
||||
})
|
||||
},
|
||||
pageChange(page) {
|
||||
this.changePageCoreRecordData()
|
||||
this.tableFrom.page = page
|
||||
this.getList()
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.changePageCoreRecordData()
|
||||
this.tableFrom.limit = val
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.selWidth{
|
||||
width: 219px !important;
|
||||
}
|
||||
.seachTiele{
|
||||
line-height: 35px;
|
||||
}
|
||||
.fr{
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,470 @@
|
|||
<template>
|
||||
<div class="lazy-cascader" :style="{ width: width }">
|
||||
<!-- 禁用状态 -->
|
||||
<div
|
||||
v-if="disabled"
|
||||
class="el-input__inner lazy-cascader-input lazy-cascader-input-disabled"
|
||||
>
|
||||
<span v-show="placeholderVisible" class="lazy-cascader-placeholder">
|
||||
{{ placeholder }}
|
||||
</span>
|
||||
<div v-if="props.multiple" class="lazy-cascader-tags">
|
||||
<el-tag
|
||||
v-for="(item, index) in labelArray"
|
||||
:key="index"
|
||||
class="lazy-cascader-tag"
|
||||
type="info"
|
||||
disable-transitions
|
||||
closable
|
||||
>
|
||||
<span> {{ item.label.join(separator) }}</span>
|
||||
</el-tag>
|
||||
</div>
|
||||
<div v-else class="lazy-cascader-label">
|
||||
<el-tooltip
|
||||
placement="top-start"
|
||||
:content="labelObject.label.join(separator)"
|
||||
>
|
||||
<span>{{ labelObject.label.join(separator) }}</span>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 禁用状态 -->
|
||||
<!-- 可选状态 -->
|
||||
<el-popover v-else ref="popover" trigger="click" placement="bottom-start">
|
||||
<!-- 搜索 -->
|
||||
<div class="lazy-cascader-search">
|
||||
<el-autocomplete
|
||||
v-if="filterable"
|
||||
v-model="keyword"
|
||||
:style="{ width: searchWidth || '100%' }"
|
||||
:popper-class="suggestionsPopperClass"
|
||||
class="inline-input"
|
||||
prefix-icon="el-icon-search"
|
||||
label="name"
|
||||
:fetch-suggestions="querySearch"
|
||||
:trigger-on-focus="false"
|
||||
placeholder="请输入"
|
||||
@select="handleSelect"
|
||||
@blur="isSearchEmpty = false"
|
||||
>
|
||||
<template slot-scope="{ item }">
|
||||
<div class="name" :class="isChecked(item[props.value])">
|
||||
{{ item[props.label].join(separator) }}
|
||||
</div>
|
||||
</template>
|
||||
</el-autocomplete>
|
||||
<div v-show="isSearchEmpty" class="empty">{{ searchEmptyText }}</div>
|
||||
</div>
|
||||
<!-- 搜索 -->
|
||||
<!-- 级联面板 -->
|
||||
<div class="lazy-cascader-panel">
|
||||
<el-cascader-panel
|
||||
ref="panel"
|
||||
v-model="current"
|
||||
:options="options"
|
||||
:props="currentProps"
|
||||
@change="change"
|
||||
/>
|
||||
</div>
|
||||
<!-- 级联面板 -->
|
||||
<!--内容区域-->
|
||||
<div
|
||||
slot="reference"
|
||||
class="el-input__inner lazy-cascader-input"
|
||||
:class="disabled ? 'lazy-cascader-input-disabled' : ''"
|
||||
>
|
||||
<span v-show="placeholderVisible" class="lazy-cascader-placeholder">
|
||||
{{ placeholder }}
|
||||
</span>
|
||||
<div v-if="props.multiple" class="lazy-cascader-tags">
|
||||
<el-tag
|
||||
v-for="(item, index) in labelArray"
|
||||
:key="index"
|
||||
class="lazy-cascader-tag"
|
||||
type="info"
|
||||
size="small"
|
||||
disable-transitions
|
||||
closable
|
||||
@close="handleClose(item)"
|
||||
>
|
||||
<span> {{ item.label.join(separator) }}</span>
|
||||
</el-tag>
|
||||
</div>
|
||||
<div v-else class="lazy-cascader-label">
|
||||
<el-tooltip
|
||||
placement="top-start"
|
||||
:content="labelObject.label.join(separator)"
|
||||
>
|
||||
<span>{{ labelObject.label.join(separator) }}</span>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<span
|
||||
v-if="clearable && current.length > 0"
|
||||
class="lazy-cascader-clear"
|
||||
@click.stop="clearBtnClick"
|
||||
>
|
||||
<i class="el-icon-close" />
|
||||
</span>
|
||||
</div>
|
||||
<!--内容区域-->
|
||||
</el-popover>
|
||||
<!-- 可选状态 -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
export default {
|
||||
props: {
|
||||
value: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
},
|
||||
separator: {
|
||||
type: String,
|
||||
default: '/'
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: '请选择'
|
||||
},
|
||||
|
||||
width: {
|
||||
type: String,
|
||||
default: '400px'
|
||||
},
|
||||
filterable: Boolean,
|
||||
clearable: Boolean,
|
||||
disabled: Boolean,
|
||||
props: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
suggestionsPopperClass: {
|
||||
type: String,
|
||||
default: 'suggestions-popper-class'
|
||||
},
|
||||
searchWidth: {
|
||||
type: String
|
||||
},
|
||||
searchEmptyText: {
|
||||
type: String,
|
||||
default: '暂无数据'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isSearchEmpty: false,
|
||||
keyword: '',
|
||||
options: [],
|
||||
current: [],
|
||||
labelObject: { label: [], value: [] },
|
||||
labelArray: [],
|
||||
currentProps: {
|
||||
multiple: this.props.multiple,
|
||||
checkStrictly: this.props.checkStrictly,
|
||||
value: this.props.value,
|
||||
label: this.props.label,
|
||||
leaf: this.props.leaf,
|
||||
lazy: true,
|
||||
lazyLoad: this.lazyLoad
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
placeholderVisible() {
|
||||
if (this.current) {
|
||||
return this.current.length == 0
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
current() {
|
||||
this.getLabelArray()
|
||||
},
|
||||
value(v) {
|
||||
this.current = v
|
||||
},
|
||||
keyword() {
|
||||
this.isSearchEmpty = false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initOptions()
|
||||
},
|
||||
methods: {
|
||||
// 搜索是否选中
|
||||
isChecked(value) {
|
||||
// 多选
|
||||
if (this.props.multiple) {
|
||||
const index = this.current.findIndex(item => {
|
||||
return item.join() == value.join()
|
||||
})
|
||||
if (index > -1) {
|
||||
return 'el-link el-link--primary'
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
} else {
|
||||
if (value.join() == this.current.join()) {
|
||||
return 'el-link el-link--primary'
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
},
|
||||
// 搜索
|
||||
querySearch(query, callback) {
|
||||
this.props.lazySearch(query, list => {
|
||||
callback(list)
|
||||
if (!list || !list.length) this.isSearchEmpty = true
|
||||
})
|
||||
},
|
||||
// 选中搜索下拉搜索项
|
||||
handleSelect(item) {
|
||||
if (this.props.multiple) {
|
||||
const index = this.current.findIndex(obj => {
|
||||
return obj.join() == item[this.props.value].join()
|
||||
})
|
||||
if (index == -1) {
|
||||
this.$refs.panel.clearCheckedNodes()
|
||||
this.current.push(item[this.props.value])
|
||||
this.$emit('change', this.current)
|
||||
}
|
||||
} else {
|
||||
// 选中下拉选变更值
|
||||
if (
|
||||
this.current == null ||
|
||||
item[this.props.value].join() !== this.current.join()
|
||||
) {
|
||||
this.$refs.panel.activePath = []
|
||||
this.current = item[this.props.value]
|
||||
this.$emit('change', this.current)
|
||||
}
|
||||
}
|
||||
this.keyword = ''
|
||||
},
|
||||
// 初始化数据
|
||||
async initOptions() {
|
||||
this.props.lazyLoad(0, list => {
|
||||
this.$set(this, 'options', list)
|
||||
if (this.props.multiple) {
|
||||
this.current = [...this.value]
|
||||
} else {
|
||||
this.current = this.value
|
||||
}
|
||||
})
|
||||
},
|
||||
async getLabelArray() {
|
||||
if (this.props.multiple) {
|
||||
const array = []
|
||||
for (let i = 0; i < this.current.length; i++) {
|
||||
const obj = await this.getObject(this.current[i])
|
||||
array.push(obj)
|
||||
}
|
||||
this.labelArray = array
|
||||
this.$emit('input', this.current)
|
||||
if (!this.disabled) {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.popover.updatePopper()
|
||||
})
|
||||
}
|
||||
} else {
|
||||
this.labelObject = await this.getObject(this.current || [])
|
||||
this.$emit('input', this.current)
|
||||
}
|
||||
},
|
||||
/** 格式化id=>object */
|
||||
async getObject(id) {
|
||||
try {
|
||||
let options = this.options
|
||||
const nameArray = []
|
||||
for (let i = 0; i < id.length; i++) {
|
||||
const index = options.findIndex(item => {
|
||||
return item[this.props.value] == id[i]
|
||||
})
|
||||
if (index < 0) {
|
||||
continue
|
||||
}
|
||||
nameArray.push(options[index][this.props.label])
|
||||
if (i < id.length - 1 && options[index].children == undefined) {
|
||||
const list = new Promise(resolve => {
|
||||
this.props.lazyLoad(id[i], list => {
|
||||
resolve(list)
|
||||
})
|
||||
})
|
||||
this.$set(options[index], 'children', await list)
|
||||
options = options[index].children
|
||||
} else {
|
||||
options = options[index].children
|
||||
}
|
||||
}
|
||||
return { value: id, label: nameArray }
|
||||
} catch (e) {
|
||||
this.current = []
|
||||
return { value: [], label: [] }
|
||||
}
|
||||
},
|
||||
// 懒加载数据
|
||||
async lazyLoad(node, resolve) {
|
||||
let current = this.current
|
||||
if (this.props.multiple) {
|
||||
current = [...this.current]
|
||||
}
|
||||
if (node.root) {
|
||||
resolve()
|
||||
} else if (node.data[this.props.leaf]) {
|
||||
resolve()
|
||||
} else if (node.data.children) {
|
||||
if (this.props.multiple) {
|
||||
this.current = current
|
||||
}
|
||||
resolve()
|
||||
} else {
|
||||
this.props.lazyLoad(node.value, list => {
|
||||
node.data.children = list
|
||||
if (this.props.multiple) {
|
||||
this.current = current
|
||||
}
|
||||
resolve(list)
|
||||
})
|
||||
}
|
||||
},
|
||||
// 删除多选值
|
||||
/** 删除**/
|
||||
handleClose(item) {
|
||||
const index = this.current.findIndex(obj => {
|
||||
return obj.join() == item.value.join()
|
||||
})
|
||||
if (index > -1) {
|
||||
this.$refs.panel.clearCheckedNodes()
|
||||
this.current.splice(index, 1)
|
||||
this.$emit('change', this.current)
|
||||
}
|
||||
},
|
||||
// 点击清空按钮
|
||||
clearBtnClick() {
|
||||
this.$refs.panel.clearCheckedNodes()
|
||||
this.current = []
|
||||
this.$emit('change', this.current)
|
||||
},
|
||||
change() {
|
||||
this.$emit('change', this.current)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.lazy-cascader {
|
||||
display: inline-block;
|
||||
width: 300px;
|
||||
.lazy-cascader-input {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
height: auto;
|
||||
min-height: 36px;
|
||||
padding: 5px;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
> .lazy-cascader-placeholder {
|
||||
padding: 0 2px;
|
||||
line-height: 28px;
|
||||
color: #999;
|
||||
font-size: 14px;
|
||||
}
|
||||
> .lazy-cascader-label {
|
||||
padding: 0 2px;
|
||||
line-height: 28px;
|
||||
color: #606266;
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
> .lazy-cascader-clear {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
display: inline-block;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
.lazy-cascader-input-disabled {
|
||||
background-color: #f5f7fa;
|
||||
border-color: #e4e7ed;
|
||||
color: #c0c4cc;
|
||||
cursor: not-allowed;
|
||||
> .lazy-cascader-label {
|
||||
color: #c0c4cc;
|
||||
}
|
||||
> .lazy-cascader-placeholder {
|
||||
color: #c0c4cc;
|
||||
}
|
||||
}
|
||||
}
|
||||
.lazy-cascader-tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
max-width: 100%;
|
||||
margin: 2px;
|
||||
text-overflow: ellipsis;
|
||||
background: #f0f2f5;
|
||||
> span {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
> .el-icon-close {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: none;
|
||||
flex: none;
|
||||
background-color: #c0c4cc;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.lazy-cascader-panel {
|
||||
margin-top: 10px;
|
||||
display: inline-block;
|
||||
}
|
||||
.suggestions-popper-class {
|
||||
width: auto !important;
|
||||
min-width: 200px;
|
||||
}
|
||||
.lazy-cascader-search {
|
||||
.empty {
|
||||
width: calc(100% - 24px);
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
z-index: 999;
|
||||
padding: 12px 0;
|
||||
margin-top: 12px;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -12px;
|
||||
left: 36px;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 6px solid transparent;
|
||||
border-right: 6px solid transparent;
|
||||
border-top: 6px solid transparent;
|
||||
border-bottom: 6px solid #fff;
|
||||
filter: drop-shadow(0 -1px 2px rgba(0, 0, 0, 0.02));
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,234 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-dialog :title="isEdit ? '编辑服务说明模板' : '添加服务说明模板'" :visible.sync="dialogVisible" width="1000px">
|
||||
<el-form ref="formValidate" class="formValidate mt20" :model="formValidate" :rules="ruleInline" label-width="100px" label-position="right">
|
||||
<el-form-item label="模板名称：" prop="template_name">
|
||||
<el-input v-model="formValidate.template_name" placeholder="请输入模板名称" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item label="服务条款：" prop="template_value">
|
||||
<div class="acea-row">
|
||||
<el-tag
|
||||
v-for="(tag, index) in termsService"
|
||||
:key="index"
|
||||
class="mr10"
|
||||
closable
|
||||
:disable-transitions="false"
|
||||
@close="handleCloseItems(tag)"
|
||||
>{{ tag.guarantee_name }}</el-tag>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input v-model="guarantee_name" placeholder="请输入服务条款名称搜索" class="selWidth" size="small" @keyup.enter.native="getServiceTerms">
|
||||
<el-button slot="append" icon="el-icon-search" size="small" class="el-button-solt" @click="getServiceTerms" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-checkbox-group v-model="formValidate.template_value" @change="handleCheckedTermsChange">
|
||||
<el-checkbox v-for="item in termsList" v-show="item.isShow" :key="item.guarantee_id" :label="item.guarantee_id" class="guarantee_checkbox">
|
||||
<span class="guarantee_name">{{ item.guarantee_name }}</span>
|
||||
<span class="guarantee_info">{{ item.guarantee_info }}</span></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序：">
|
||||
<el-input-number v-model="formValidate.sort" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button v-if="!isEdit" type="primary" :loading="loading" @click="createGuarantee('formValidate')">确 定</el-button>
|
||||
<el-button v-else type="primary" :loading="loading" @click="updateGuarantee('formValidate')">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import {
|
||||
guaranteeTemplateAddApi,
|
||||
guaranteeUpdateApi,
|
||||
guaranteeTemplateDetailApi,
|
||||
guaranteeTemplateSelectApi
|
||||
} from '@/api/product'
|
||||
|
||||
export default {
|
||||
name: 'CreatGuarantee',
|
||||
|
||||
data() {
|
||||
return {
|
||||
isEdit: false,
|
||||
dialogVisible: false,
|
||||
loading: false,
|
||||
guarantee_id: '',
|
||||
guarantee_name: '',
|
||||
termsService: [],
|
||||
termsList: [],
|
||||
formValidate: {
|
||||
template_name: '',
|
||||
template_value: [],
|
||||
sort: ''
|
||||
},
|
||||
ruleInline: {
|
||||
template_name: [
|
||||
{ required: true, message: '请输入模板名称', trigger: 'blur' }
|
||||
],
|
||||
template_value: [
|
||||
{ required: true, message: '请选择服务条款', trigger: 'change' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
this.getServiceTerms()
|
||||
},
|
||||
methods: {
|
||||
/** 获取服务条款 */
|
||||
getServiceTerms() {
|
||||
guaranteeTemplateSelectApi({ keyword: this.guarantee_name }).then((res) => {
|
||||
if (this.guarantee_name) {
|
||||
this.getSearchItem(res.data)
|
||||
} else {
|
||||
this.termsList = res.data
|
||||
this.termsList.forEach((item, index) => {
|
||||
item.isShow = true
|
||||
})
|
||||
}
|
||||
})
|
||||
.catch(({ message }) => {
|
||||
this.$message.error(message)
|
||||
})
|
||||
},
|
||||
/** 把搜索结果显示出来 */
|
||||
getSearchItem(arr) {
|
||||
this.termsList.forEach((item, index) => {
|
||||
if (arr.length > 0) {
|
||||
arr.forEach((itemn, indexn) => {
|
||||
if (itemn.guarantee_id == item.guarantee_id) {
|
||||
item.isShow = true
|
||||
} else {
|
||||
item.isShow = false
|
||||
}
|
||||
})
|
||||
} else {
|
||||
item.isShow = false
|
||||
}
|
||||
this.$set(this.termsList, index, item)
|
||||
console.log(this.termsList)
|
||||
})
|
||||
},
|
||||
handleCheckedTermsChange(value) {
|
||||
this.getSelectedItems(value)
|
||||
},
|
||||
handleCloseItems(tag) {
|
||||
this.termsService.splice(this.termsService.indexOf(tag), 1)
|
||||
this.formValidate.template_value = []
|
||||
this.termsService.map(item => {
|
||||
this.formValidate.template_value.push(item.guarantee_id)
|
||||
})
|
||||
},
|
||||
/** 取出选择的服务条款 */
|
||||
getSelectedItems(arr) {
|
||||
this.termsService = []
|
||||
this.termsList.forEach((item, index) => {
|
||||
arr.forEach((itemn, indexn) => {
|
||||
if (itemn == item.guarantee_id) {
|
||||
this.termsService.push(item)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// 编辑
|
||||
handleEdit(id) {
|
||||
this.isEdit = true
|
||||
this.dialogVisible = true
|
||||
this.loading = false
|
||||
this.guarantee_id = id
|
||||
guaranteeTemplateDetailApi(id).then((res) => {
|
||||
const data = res.data
|
||||
this.formValidate = {
|
||||
template_name: data.template_name,
|
||||
template_value: data.template_value,
|
||||
sort: data.sort
|
||||
}
|
||||
this.getSelectedItems(data.template_value)
|
||||
this.$refs['formValidate'].clearValidate()
|
||||
})
|
||||
.catch(({ message }) => {
|
||||
this.$message.error(message)
|
||||
})
|
||||
},
|
||||
add() {
|
||||
this.isEdit = false
|
||||
this.dialogVisible = true
|
||||
this.loading = false
|
||||
this.guarantee_name = ""
|
||||
this.formValidate = {
|
||||
template_name: '',
|
||||
template_value: [],
|
||||
sort: ''
|
||||
}
|
||||
this.getServiceTerms()
|
||||
},
|
||||
/** 添加 */
|
||||
createGuarantee(name) {
|
||||
this.$refs[name].validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
guaranteeTemplateAddApi(this.formValidate)
|
||||
.then(({ message }) => {
|
||||
this.$message.success(message)
|
||||
this.dialogVisible = false
|
||||
this.loading = false
|
||||
this.$emit('get-list', '')
|
||||
})
|
||||
.catch(({ message }) => {
|
||||
this.loading = false
|
||||
this.$message.error(message)
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 编辑 */
|
||||
updateGuarantee(name) {
|
||||
this.$refs[name].validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
guaranteeUpdateApi(this.guarantee_id, this.formValidate)
|
||||
.then(({ message }) => {
|
||||
this.$message.success(message)
|
||||
this.dialogVisible = false
|
||||
this.loading = false
|
||||
this.$emit('get-list', '')
|
||||
})
|
||||
.catch(({ message }) => {
|
||||
this.loading = false
|
||||
this.$message.error(message)
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
/deep/.selWidth{
|
||||
width: 300px!important;
|
||||
}
|
||||
.guarantee_info{
|
||||
display: block;
|
||||
}
|
||||
/deep/.el-checkbox__input{
|
||||
vertical-align: top;
|
||||
top: 3px;
|
||||
}
|
||||
/deep/.el-checkbox__label{
|
||||
white-space: normal; word-break: break-all;
|
||||
}
|
||||
.guarantee_name{
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,488 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-form ref="ruleForm" v-loading="loading" :model="ruleForm" label-width="120px" size="mini" :rules="rules">
|
||||
<el-form-item label="模板名称" prop="name">
|
||||
<el-input v-model="ruleForm.name" class="withs" placeholder="请输入模板名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="运费说明" prop="info">
|
||||
<el-input v-model="ruleForm.info" type="textarea" class="withs" placeholder="请输入运费说明" />
|
||||
</el-form-item>
|
||||
<el-form-item label="计费方式" prop="type">
|
||||
<el-radio-group v-model="ruleForm.type" @change="changeRadio(ruleForm.type)">
|
||||
<el-radio :label="0">按件数</el-radio>
|
||||
<el-radio :label="1">按重量</el-radio>
|
||||
<el-radio :label="2">按体积</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="配送区域及运费" prop="region">
|
||||
<el-table v-loading="listLoading" :data="ruleForm.region" border fit highlight-current-row style="width: 100%" size="mini" class="tempBox">
|
||||
<el-table-column align="center" label="可配送区域" min-width="260">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.$index === 0">默认全国 <span style="font-weight: bold;">(开启指定区域不配送时无效)</span></span>
|
||||
<LazyCascader
|
||||
v-else
|
||||
v-model="scope.row.city_ids"
|
||||
style="width: 98%"
|
||||
:props="props"
|
||||
collapse-tags
|
||||
clearable
|
||||
:filterable="false"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="130px" align="center" :label="columns.title">
|
||||
<template slot-scope="{row}">
|
||||
<el-input-number v-model="row.first" controls-position="right" :min="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="120px" align="center" label="运费（元）">
|
||||
<template slot-scope="{row}">
|
||||
<el-input-number v-model="row.first_price" controls-position="right" :min="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="120px" align="center" :label="columns.title2">
|
||||
<template slot-scope="{row}">
|
||||
<el-input-number v-model="row.continue" controls-position="right" :min="0.1" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column class-name="status-col" align="center" label="续费（元）" min-width="120">
|
||||
<template slot-scope="{row}">
|
||||
<el-input-number v-model="row.continue_price" controls-position="right" :min="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="操作" min-width="80" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-if="scope.$index > 0"
|
||||
type="text"
|
||||
size="small"
|
||||
@click="confirmEdit(ruleForm.region,scope.$index)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="mini" icon="el-icon-edit" @click="addRegion(ruleForm.region)">
|
||||
添加配送区域
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="指定包邮" prop="appoint">
|
||||
<el-radio-group v-model="ruleForm.appoint">
|
||||
<el-radio :label="1">开启</el-radio>
|
||||
<el-radio :label="0">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="ruleForm.appoint === 1" prop="free">
|
||||
<el-table v-loading="listLoading" :data="ruleForm.free" border fit highlight-current-row style="width: 100%" size="mini">
|
||||
<el-table-column align="center" label="选择地区" min-width="220">
|
||||
<template slot-scope="{row}">
|
||||
<LazyCascader
|
||||
v-model="row.city_ids"
|
||||
style="width: 95%"
|
||||
:props="props"
|
||||
collapse-tags
|
||||
clearable
|
||||
:filterable="false"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="180px" align="center" :label="columns.title3">
|
||||
<template slot-scope="{row}">
|
||||
<el-input-number v-model="row.number" controls-position="right" :min="1" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="120px" align="center" label="最低购买金额（元）">
|
||||
<template slot-scope="{row}">
|
||||
<el-input-number v-model="row.price" controls-position="right" :min="0.01" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="操作" min-width="120" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="confirmEdit(ruleForm.free,scope.$index)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="ruleForm.appoint === 1">
|
||||
<el-button type="primary" size="mini" icon="el-icon-edit" @click="addFree(ruleForm.free)">
|
||||
添加指定包邮区域
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="指定区域不配送" prop="undelivery">
|
||||
<el-radio-group v-model="ruleForm.undelivery">
|
||||
<el-radio :label="1">自定义</el-radio>
|
||||
<el-radio :label="2">开启</el-radio>
|
||||
<el-radio :label="0">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
<br>
|
||||
(说明: 选择"开启"时, 仅支持上表添加的配送区域)
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item v-if="ruleForm.undelivery === 1" class="noBox" prop="city_id3">
|
||||
<LazyCascader
|
||||
v-model="ruleForm.city_id3"
|
||||
placeholder="请选择不配送区域"
|
||||
style="width: 46%"
|
||||
:props="props"
|
||||
collapse-tags
|
||||
clearable
|
||||
:filterable="false"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="排序">
|
||||
<el-input v-model="ruleForm.sort" class="withs" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="footer acea-row">
|
||||
<el-button @click="resetForm('ruleForm')">取 消</el-button>
|
||||
<el-button type="primary" @click="onsubmit('ruleForm')">确 定</el-button>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { cityListV2, templateCreateApi, templateDetailApi, templateUpdateApi } from '@/api/freight'
|
||||
import LazyCascader from '../lazyCascader'
|
||||
const defaultRole = {
|
||||
name: '',
|
||||
type: 0,
|
||||
appoint: 0,
|
||||
sort: 0,
|
||||
info: '',
|
||||
region: [{
|
||||
first: 1,
|
||||
first_price: 0,
|
||||
continue: 1,
|
||||
continue_price: 0,
|
||||
city_id: [],
|
||||
city_ids: []
|
||||
}],
|
||||
undelivery: 0,
|
||||
free: [],
|
||||
undelives: {},
|
||||
city_id3: []
|
||||
}
|
||||
|
||||
const cacheAddress = {}
|
||||
|
||||
const kg = '重量（kg）'
|
||||
const m = '体积（m³）'
|
||||
const statusMap = [
|
||||
{
|
||||
title: '首件',
|
||||
title2: '续件',
|
||||
title3: '最低购买件数'
|
||||
},
|
||||
{
|
||||
title: `首件${kg}`,
|
||||
title2: `续件${kg}`,
|
||||
title3: `最低购买${kg}`
|
||||
},
|
||||
{
|
||||
title: `首件${m}`,
|
||||
title2: `续件${m}`,
|
||||
title3: `最低购买${m}`
|
||||
}
|
||||
]
|
||||
export default {
|
||||
name: 'CreatTemplates',
|
||||
components: {
|
||||
LazyCascader
|
||||
},
|
||||
props: {
|
||||
tempId: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
componentKey: {
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: '请输入模板名称', trigger: 'change' }
|
||||
],
|
||||
info: [
|
||||
{ required: true, message: '请输入运费说明', trigger: 'blur' },
|
||||
{ min: 3, max: 500, message: '长度在 3 到 500 个字符', trigger: 'blur' }
|
||||
],
|
||||
free: [
|
||||
{ type: 'array', required: true, message: '请至少添加一个地区', trigger: 'change' }
|
||||
],
|
||||
appoint: [
|
||||
{ required: true, message: '请选择是否指定包邮', trigger: 'change' }
|
||||
],
|
||||
undelivery: [
|
||||
{ required: true, message: '请选择是否指定区域不配送', trigger: 'change' }
|
||||
],
|
||||
type: [
|
||||
{ required: true, message: '请选择计费方式', trigger: 'change' }
|
||||
],
|
||||
region: [
|
||||
{ required: true, message: '请选择活动区域', trigger: 'change' }
|
||||
]
|
||||
// city_id3: [
|
||||
// { type: 'array', required: true, message: '请至少选择一个地区', trigger: 'remove-tag' }
|
||||
// ]
|
||||
},
|
||||
nodeKey: 'city_id',
|
||||
props: {
|
||||
children: 'children',
|
||||
label: 'name',
|
||||
value: 'id',
|
||||
multiple: true,
|
||||
lazy: true,
|
||||
lazyLoad: this.lazyLoad,
|
||||
checkStrictly: true
|
||||
},
|
||||
dialogVisible: false,
|
||||
ruleForm: Object.assign({}, defaultRole),
|
||||
listLoading: false,
|
||||
cityList: [],
|
||||
columns: {
|
||||
title: '首件',
|
||||
title2: '续件',
|
||||
title3: '最低购买件数'
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
componentKey: {
|
||||
handler: function(val, oldVal) {
|
||||
if (val) {
|
||||
this.getInfo()
|
||||
} else {
|
||||
this.ruleForm = {
|
||||
name: '',
|
||||
type: 0,
|
||||
appoint: 0,
|
||||
sort: 0,
|
||||
region: [{
|
||||
first: 1,
|
||||
first_price: 0,
|
||||
continue: 1,
|
||||
continue_price: 0,
|
||||
city_id: [],
|
||||
city_ids: []
|
||||
}],
|
||||
undelivery: 0,
|
||||
free: [],
|
||||
undelives: {},
|
||||
city_id3: []
|
||||
}
|
||||
}
|
||||
}
|
||||
// immediate: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// this.getCityList()
|
||||
if (this.tempId > 0) this.getInfo()
|
||||
},
|
||||
methods: {
|
||||
resetForm(formName) {
|
||||
this.$msgbox.close()
|
||||
this.$refs[formName].resetFields()
|
||||
},
|
||||
onClose(formName) {
|
||||
this.dialogVisible = false
|
||||
this.$refs[formName].resetFields()
|
||||
},
|
||||
confirmEdit(row, index) {
|
||||
row.splice(index, 1)
|
||||
},
|
||||
changeRadio(num) {
|
||||
this.columns = Object.assign({}, statusMap[num])
|
||||
},
|
||||
// 添加配送区域
|
||||
addRegion(region) {
|
||||
region.push(Object.assign({}, {
|
||||
first: 1,
|
||||
first_price: 1,
|
||||
continue: 1,
|
||||
continue_price: 0,
|
||||
city_id: [],
|
||||
city_ids: []
|
||||
}))
|
||||
},
|
||||
addFree(Free) {
|
||||
Free.push(Object.assign({}, {
|
||||
city_id: [],
|
||||
number: 1,
|
||||
price: 0.01,
|
||||
city_ids: []
|
||||
}))
|
||||
},
|
||||
lazyLoad(node, resolve) {
|
||||
if (cacheAddress[node]) {
|
||||
cacheAddress[node]().then(res => {
|
||||
resolve([...res.data])
|
||||
})
|
||||
} else {
|
||||
const p = cityListV2(node)
|
||||
cacheAddress[node] = () => p
|
||||
p.then(res => {
|
||||
res.data.forEach(item => {
|
||||
item.leaf = item.snum === 0
|
||||
})
|
||||
cacheAddress[node] = () => new Promise((resolve1) => {
|
||||
setTimeout(() => resolve1(res), 300)
|
||||
})
|
||||
resolve(res.data)
|
||||
}).catch(res => {
|
||||
this.$message.error(res.message)
|
||||
})
|
||||
}
|
||||
},
|
||||
// 详情
|
||||
getInfo() {
|
||||
this.loading = true
|
||||
templateDetailApi(this.tempId).then(res => {
|
||||
this.dialogVisible = true
|
||||
const info = res.data
|
||||
this.ruleForm = {
|
||||
name: info.name,
|
||||
type: info.type,
|
||||
info: info.info,
|
||||
appoint: info.appoint,
|
||||
sort: info.sort,
|
||||
region: info.region,
|
||||
undelivery: info.undelivery,
|
||||
free: info.free,
|
||||
undelives: info.undelives,
|
||||
city_id3: info.undelives.city_ids || []
|
||||
}
|
||||
this.ruleForm.region.map(item => {
|
||||
this.$set(item, 'city_id', item.city_ids[0])
|
||||
this.$set(item, 'city_ids', item.city_ids)
|
||||
})
|
||||
this.ruleForm.free.map(item => {
|
||||
this.$set(item, 'city_id', item.city_ids[0])
|
||||
this.$set(item, 'city_ids', item.city_ids)
|
||||
})
|
||||
this.changeRadio(info.type)
|
||||
// this.$refs.changeType.click(info.type)
|
||||
// this.$refs.refid.click();
|
||||
this.loading = false
|
||||
}).catch(res => {
|
||||
this.$message.error(res.message)
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// 列表
|
||||
// getCityList() {
|
||||
// cityListV2(0).then(res => {
|
||||
// this.cityList = res.data
|
||||
// }).catch(res => {
|
||||
// this.$message.error(res.message)
|
||||
// })
|
||||
// },
|
||||
change(idBox) {
|
||||
idBox.map(item => {
|
||||
const ids = []
|
||||
if (item.city_ids.length === 0) return
|
||||
item.city_ids.map(j => {
|
||||
// j.splice(0, 1)
|
||||
ids.push(j[j.length - 1])
|
||||
})
|
||||
item.city_id = ids
|
||||
})
|
||||
return idBox
|
||||
},
|
||||
changeOne(idBox) {
|
||||
const city_ids = []
|
||||
if (idBox.length === 0) return
|
||||
idBox.map(item => {
|
||||
// item.splice(0, 1)
|
||||
city_ids.push(item[item.length - 1])
|
||||
})
|
||||
return city_ids
|
||||
},
|
||||
onsubmit(formName) {
|
||||
// this.ruleForm.region = this.change(this.ruleForm.region)
|
||||
// this.ruleForm.free = this.change(this.ruleForm.free)
|
||||
// this.ruleForm.undelives.city_id = this.changeOne(this.ruleForm.city_id3)
|
||||
const data = {
|
||||
name: this.ruleForm.name,
|
||||
type: this.ruleForm.type,
|
||||
info: this.ruleForm.info,
|
||||
appoint: this.ruleForm.appoint,
|
||||
sort: this.ruleForm.sort,
|
||||
region: this.change(this.ruleForm.region),
|
||||
undelivery: this.ruleForm.undelivery,
|
||||
free: this.change(this.ruleForm.free),
|
||||
undelives: {
|
||||
city_id: this.changeOne(this.ruleForm.city_id3)
|
||||
}
|
||||
}
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
this.tempId === 0 ? templateCreateApi(data).then(res => {
|
||||
this.$message.success(res.message)
|
||||
setTimeout(() => {
|
||||
this.$msgbox.close()
|
||||
}, 500)
|
||||
setTimeout(() => {
|
||||
this.$emit('getList')
|
||||
this.$refs[formName].resetFields()
|
||||
}, 600)
|
||||
}).catch(res => {
|
||||
this.$message.error(res.message)
|
||||
}) : templateUpdateApi(this.tempId, data).then(res => {
|
||||
this.$message.success(res.message)
|
||||
setTimeout(() => {
|
||||
this.$msgbox.close()
|
||||
}, 500)
|
||||
setTimeout(() => {
|
||||
this.$emit('getList')
|
||||
this.$refs[formName].resetFields()
|
||||
}, 600)
|
||||
}).catch(res => {
|
||||
this.$message.error(res.message)
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.footer{
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.withs{
|
||||
width: 50%;
|
||||
}
|
||||
.noBox{
|
||||
/deep/.el-form-item__content{
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
.tempBox{
|
||||
/deep/.el-input-number--mini{
|
||||
width: 100px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
|
||||
export default function modalAttr(val, callback) {
|
||||
const h = this.$createElement
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$msgbox({
|
||||
title: '属性规格',
|
||||
customClass: 'upload-form',
|
||||
closeOnClickModal: false,
|
||||
showClose: false,
|
||||
message: h('div', { class: 'common-form-upload' }, [
|
||||
h('attrFrom', {
|
||||
props: {
|
||||
currentRow: val
|
||||
},
|
||||
on: {
|
||||
getList() {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
})
|
||||
]),
|
||||
showCancelButton: false,
|
||||
showConfirmButton: false
|
||||
}).then(() => {
|
||||
resolve()
|
||||
}).catch(() => {
|
||||
reject()
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消'
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
|
||||
export default function modalCoupon(couponData, handle, couponId, keyNum, callback) {
|
||||
const h = this.$createElement
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$msgbox({
|
||||
title: '优惠券列表',
|
||||
customClass: 'upload-form-coupon',
|
||||
closeOnClickModal: false,
|
||||
showClose: false,
|
||||
message: h('div', { class: 'common-form-upload' }, [
|
||||
h('couponList', {
|
||||
props: {
|
||||
couponData: couponData,
|
||||
handle: handle,
|
||||
couponId: couponId,
|
||||
keyNum: keyNum
|
||||
},
|
||||
on: {
|
||||
getCouponId(id) {
|
||||
callback(id)
|
||||
}
|
||||
}
|
||||
})
|
||||
]),
|
||||
showCancelButton: false,
|
||||
showConfirmButton: false
|
||||
}).then(() => {
|
||||
resolve()
|
||||
}).catch(() => {
|
||||
reject()
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消'
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
|
||||
export default function modalTemplates(id, callback, componentKey) {
|
||||
const h = this.$createElement
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$msgbox({
|
||||
title: '运费模板',
|
||||
customClass: 'upload-form-temp',
|
||||
closeOnClickModal: false,
|
||||
showClose: false,
|
||||
message: h('div', { class: 'common-form-upload' }, [
|
||||
h('templatesFrom', {
|
||||
props: {
|
||||
tempId: id,
|
||||
componentKey: componentKey
|
||||
},
|
||||
on: {
|
||||
getList() {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
})
|
||||
]),
|
||||
showCancelButton: false,
|
||||
showConfirmButton: false
|
||||
}).then(() => {
|
||||
resolve()
|
||||
}).catch(() => {
|
||||
reject()
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消'
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
12
src/main.js
12
src/main.js
|
|
@ -25,6 +25,9 @@ import FormCreate from "@form-create/element-ui";
|
|||
import uploadPicture from "./components/uploadPicture/uploadFrom";
|
||||
import VueUeditorWrap from "vue-ueditor-wrap";
|
||||
import newsCategory from "./components/newsCategory/newsCategoryFrom";
|
||||
import couponList from './components/couponList'
|
||||
import attrFrom from './components/attrFrom'
|
||||
import templatesFrom from './components/templatesFrom'
|
||||
import { getToken } from "./utils/auth";
|
||||
|
||||
import "./icons"; // icon
|
||||
|
|
@ -36,6 +39,9 @@ import { modalSure, deleteSure } from "@/libs/public";
|
|||
import { modalSureDelete } from "@/libs/public";
|
||||
import * as filters from "./filters";
|
||||
import notice from "@/libs/notice";
|
||||
import modalCoupon from '@/libs/modal-coupon'
|
||||
import modalAttr from '@/libs/modal-attr'
|
||||
import modalTemplates from '@/libs/modal-templates'
|
||||
import guidancePop from "@/components/guidancePop";
|
||||
// swiper
|
||||
import VueAwesomeSwiper from "vue-awesome-swiper";
|
||||
|
|
@ -45,6 +51,9 @@ Vue.use(uploadPicture);
|
|||
Vue.use(FormCreate);
|
||||
Vue.use(newsCategory);
|
||||
Vue.component("vue-ueditor-wrap", VueUeditorWrap);
|
||||
Vue.component('couponList', couponList)
|
||||
Vue.component('attrFrom', attrFrom)
|
||||
Vue.component('templatesFrom', templatesFrom)
|
||||
Vue.use(VueAwesomeSwiper);
|
||||
Vue.use(Viewer, {
|
||||
defaultOptions: {
|
||||
|
|
@ -72,6 +81,9 @@ Vue.prototype.$videoCloud = videoCloud;
|
|||
Vue.prototype.$modalSure = modalSure;
|
||||
Vue.prototype.$deleteSure = deleteSure;
|
||||
Vue.prototype.$modalSureDelete = modalSureDelete;
|
||||
Vue.prototype.$modalCoupon = modalCoupon
|
||||
Vue.prototype.$modalAttr = modalAttr
|
||||
Vue.prototype.$modalTemplates = modalTemplates
|
||||
Vue.prototype.moment = Moment;
|
||||
|
||||
Vue.component('guidancePop',guidancePop);
|
||||
|
|
|
|||
|
|
@ -123,7 +123,17 @@ const productRouter =
|
|||
noCache: true
|
||||
},
|
||||
component: () => import('@/views/product/productGuarantee/index.vue')
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'addProduct/:id?/:edit?',
|
||||
component: () => import('@/views/product/addProduct/index'),
|
||||
name: 'AddProduct',
|
||||
meta: {
|
||||
title: '商品添加',
|
||||
noCache: true
|
||||
},
|
||||
hidden: true
|
||||
},
|
||||
]
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -438,7 +438,7 @@ table .el-image{
|
|||
height: 46px!important;
|
||||
line-height: 46px!important;
|
||||
font-size: 13px;
|
||||
padding-left: 0!important;
|
||||
padding-left: 0!important;
|
||||
}
|
||||
|
||||
.styleTwo .el-submenu__title{
|
||||
|
|
@ -453,7 +453,7 @@ table .el-image{
|
|||
background: #77777D!important;
|
||||
.el-submenu__title{
|
||||
background: #77777D!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.styleTwo .router-link-active{
|
||||
background: #ffffff;
|
||||
|
|
@ -464,3 +464,10 @@ table .el-image{
|
|||
.el-slider__button-wrapper{
|
||||
z-index: 100
|
||||
}
|
||||
.upload-form-coupon{
|
||||
min-width: 1100px!important;
|
||||
max-height:700px!important;
|
||||
}
|
||||
.upload-form-temp{
|
||||
min-width: 1000px!important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,260 @@
|
|||
<template>
|
||||
<el-dialog
|
||||
:visible.sync="carMyShow"
|
||||
title="添加卡密"
|
||||
width="600px"
|
||||
>
|
||||
<div class="carMywrapper">
|
||||
<div class="type-radio">
|
||||
<el-form label-width="80px">
|
||||
<el-form-item label="卡密类型：">
|
||||
<el-radio-group v-model="fixedCar.is_type" size="large">
|
||||
<el-radio :label="0">固定卡密</el-radio>
|
||||
<!-- <el-radio :label="1">一次性卡密</el-radio> -->
|
||||
</el-radio-group>
|
||||
<div v-if="fixedCar.is_type == 0">
|
||||
<div class="stock-disk">
|
||||
<el-input
|
||||
v-model="fixedCar.key"
|
||||
size="small"
|
||||
type="textarea"
|
||||
:rows="4"
|
||||
placeholder="填写卡密信息"
|
||||
/>
|
||||
</div>
|
||||
<div class="stock-input">
|
||||
<!-- <el-input
|
||||
type="number"
|
||||
size="small"
|
||||
v-model="fixedCar.stock"
|
||||
:min="1"
|
||||
placeholder="填写库存数量"
|
||||
> -->
|
||||
<el-input-number v-model="fixedCar.stock" :min="1" label="填写库存数量" /> 件
|
||||
<!-- </el-input> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="scroll-virtual" v-if="fixedCar.is_type == 1">
|
||||
<div
|
||||
class="acea-row row-middle mb10"
|
||||
v-for="(item, index) in virtualList"
|
||||
:key="index"
|
||||
>
|
||||
<span class="mr10 virtual-title">卡号{{ index + 1 }}：</span>
|
||||
<el-input
|
||||
class="mr10 width15"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model.trim="item.key"
|
||||
placeholder="请输入卡号(非必填)"
|
||||
></el-input>
|
||||
<span class="mr10 virtual-title">卡密{{ index + 1 }}：</span>
|
||||
<el-input
|
||||
class="mr10 width15"
|
||||
type="text"
|
||||
v-model.trim="item.pwd"
|
||||
placeholder="请输入卡密"
|
||||
size="small"
|
||||
></el-input>
|
||||
<span class="deteal-btn" @click="removeVirtual(index)"
|
||||
>删除</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="fixedCar.is_type == 1" class="add-more">
|
||||
<el-button type="primary" size="mini" @click="handleAdd">添加卡密</el-button>
|
||||
<el-upload
|
||||
ref="upload"
|
||||
class="ml10"
|
||||
style="display: inline-block;"
|
||||
:action="cardUrl"
|
||||
:before-upload="beforeUpload"
|
||||
:headers="header"
|
||||
:on-success="upFile"
|
||||
:format="['xlsx']"
|
||||
:on-format-error="handleFormatError"
|
||||
>
|
||||
<!-- <el-button type="success" size="mini">导入卡密</el-button> -->
|
||||
</el-upload>
|
||||
<!-- <el-button class="download" type="default" size="small" @click="getCarMyList">下载卡密模板</el-button> -->
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<el-button type="primary" class="btns" size="small" @click="cancel">取消</el-button>
|
||||
<el-button type="primary" class="btns" size="small" @click="subBtn">确定</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
import SettingMer from "@/libs/settingMer";
|
||||
import { getToken } from "@/utils/auth";
|
||||
import exportExcel from "@/utils/newToExcel.js";
|
||||
import {
|
||||
importCard,
|
||||
exportProductCard
|
||||
} from "@/api/product";
|
||||
export default {
|
||||
name: "addCarMy",
|
||||
props:{
|
||||
virtualList: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
carMyShow: false,
|
||||
fixedCar:{
|
||||
is_type: 0,
|
||||
key:'',
|
||||
stock:0
|
||||
},
|
||||
cardUrl: SettingMer.https + "/file/upload/1",
|
||||
header: {} //请求头部信息
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// cardUrl() {
|
||||
// return (
|
||||
// SettingMer.https +
|
||||
// `/upload/image/file`
|
||||
// );
|
||||
// }
|
||||
},
|
||||
created() {
|
||||
// this.getToken();
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods:{
|
||||
// 下载卡密
|
||||
async getCarMyList() {
|
||||
let [th, filekey, data, fileName] = [[], [], [], ""];
|
||||
let lebData = await this.getExcelData();
|
||||
if (!fileName) fileName = lebData.filename;
|
||||
if (!filekey.length) {
|
||||
filekey = lebData.filekey;
|
||||
}
|
||||
if (!th.length) th = lebData.header;
|
||||
data = lebData.export;
|
||||
exportExcel(th, filekey, fileName, data);
|
||||
},
|
||||
getExcelData() {
|
||||
return new Promise((resolve, reject) => {
|
||||
exportProductCard().then((res) => {
|
||||
return resolve(res.data);
|
||||
});
|
||||
});
|
||||
},
|
||||
removeVirtual(index) {
|
||||
this.virtualList.splice(index, 1);
|
||||
},
|
||||
upFile(res) {
|
||||
importCard({ file: res.data.src }).then((res) => {
|
||||
this.$emit('changeVirtual',JSON.parse(JSON.stringify(res.data)))
|
||||
//this.$refs.upload.clearFiles();
|
||||
}).catch(err=>{
|
||||
return this.$Message.error(err.msg);
|
||||
})
|
||||
},
|
||||
handleFormatError(file){
|
||||
return this.$Message.error('必须上传xlsx格式文件');
|
||||
},
|
||||
// 上传头部token
|
||||
getToken() {
|
||||
this.header["Authori-zation"] = "Bearer " + getToken();
|
||||
},
|
||||
cancel(){
|
||||
this.$emit('closeCarMy')
|
||||
},
|
||||
handleAdd() {
|
||||
this.virtualList.push({
|
||||
key: "",
|
||||
pwd: "",
|
||||
});
|
||||
},
|
||||
beforeUpload() {
|
||||
let promise = new Promise((resolve) => {
|
||||
this.$nextTick(function () {
|
||||
resolve(true);
|
||||
});
|
||||
});
|
||||
return promise;
|
||||
},
|
||||
subBtn(){
|
||||
if(this.fixedCar.is_type==0){
|
||||
if(this.fixedCar.key == ''){
|
||||
return this.$message.error("请填写卡密信息");
|
||||
}
|
||||
if(!this.fixedCar.stock){
|
||||
return this.$message.error("请填写库存数量");
|
||||
}
|
||||
this.$emit('fixdBtn',JSON.parse(JSON.stringify(this.fixedCar)))
|
||||
}else{
|
||||
let data = {
|
||||
is_type:1,
|
||||
list:this.virtualList
|
||||
}
|
||||
for (let i = 0; i < this.virtualList.length; i++) {
|
||||
const element = this.virtualList[i];
|
||||
if (!element.pwd) {
|
||||
return this.$message.error("请输入所有卡密");
|
||||
}
|
||||
}
|
||||
this.$emit('fixdBtn',JSON.parse(JSON.stringify(data)))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.width15{
|
||||
width: 150px;
|
||||
}
|
||||
/deep/.el-radio__label{
|
||||
font-size: 13px;
|
||||
}
|
||||
.carMywrapper{
|
||||
.download{
|
||||
margin-left: 10px;
|
||||
}
|
||||
.stock-disk{
|
||||
margin: 10px 0 15px 0;
|
||||
}
|
||||
.scroll-virtual {
|
||||
max-height: 320px;
|
||||
overflow-y: auto;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.virtual-title {
|
||||
width: 50px;
|
||||
}
|
||||
.deteal-btn {
|
||||
color: #5179ea;
|
||||
cursor: pointer;
|
||||
}
|
||||
.add-more {
|
||||
margin-top: 20px;
|
||||
line-height: 32px;
|
||||
|
||||
}
|
||||
.footer{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 40px;
|
||||
button{
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
/deep/.el-input-group--append .el-input__inner{
|
||||
padding-right: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,102 @@
|
|||
<template>
|
||||
<el-dialog v-if="showRecord" title="复制记录" :visible.sync="showRecord" width="900px">
|
||||
<div v-loading="loading">
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="tableData.data"
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
class="table"
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column label="ID" prop="mer_id" min-width="50" />
|
||||
<el-table-column label="使用次数" prop="num" min-width="80" />
|
||||
<el-table-column label="复制商品平台名称" prop="type" min-width="120" />
|
||||
<el-table-column label="剩余次数" prop="number" min-width="80" />
|
||||
<el-table-column label="商品复制链接" prop="info" min-width="180" />
|
||||
<el-table-column label="操作时间" prop="create_time" min-width="120" />
|
||||
</el-table>
|
||||
<div class="block">
|
||||
<el-pagination
|
||||
:page-sizes="[10, 20]"
|
||||
:page-size="tableFrom.limit"
|
||||
:current-page="tableFrom.page"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="tableData.total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="pageChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { productCopyRecordApi } from '@/api/product'
|
||||
export default {
|
||||
name: 'CopyRecord',
|
||||
data() {
|
||||
return {
|
||||
showRecord: false,
|
||||
loading: false,
|
||||
tableData: {
|
||||
data: [],
|
||||
total: 0
|
||||
},
|
||||
tableFrom: {
|
||||
page: 1,
|
||||
limit: 10
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
getRecord() {
|
||||
this.showRecord = true
|
||||
this.loading = true
|
||||
productCopyRecordApi(this.tableFrom)
|
||||
.then((res) => {
|
||||
this.tableData.data = res.data.list
|
||||
this.tableData.total = res.data.count
|
||||
this.loading = false
|
||||
})
|
||||
.catch((res) => {
|
||||
this.$message.error(res.message)
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
pageChange(page) {
|
||||
this.tableFrom.page = page
|
||||
this.getRecord()
|
||||
},
|
||||
pageChangeLog(page) {
|
||||
this.tableFromLog.page = page
|
||||
this.getRecord()
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.tableFrom.limit = val
|
||||
this.getRecord()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.title {
|
||||
margin-bottom: 16px;
|
||||
color: #17233d;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
.description {
|
||||
&-term {
|
||||
display: table-cell;
|
||||
padding-bottom: 10px;
|
||||
line-height: 20px;
|
||||
width: 50%;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,800 @@
|
|||
<template>
|
||||
<div class="Box">
|
||||
<el-dialog
|
||||
v-if="modals"
|
||||
:visible.sync="modals"
|
||||
width="70%"
|
||||
title="商品采集"
|
||||
custom-class="dialog-scustom"
|
||||
>
|
||||
<el-card>
|
||||
<div>复制淘宝、天猫、京东、苏宁、1688；</div>
|
||||
生成的商品默认是没有上架的，请手动上架商品！
|
||||
<span style="color: rgb(237, 64, 20);">商品复制次数剩余：{{ count }}次</span>
|
||||
<router-link :to="{path: roterPre + '/setting/sms/sms_pay/index?type=copy'}">
|
||||
<el-button size="small" type="text">增加采集次数</el-button>
|
||||
</router-link>
|
||||
<el-button size="small" type="primary" style="margin-left: 15px;" @click="openRecords">查看商品复制记录</el-button>
|
||||
</el-card>
|
||||
<el-form
|
||||
ref="formValidate"
|
||||
class="formValidate mt20"
|
||||
:model="formValidate"
|
||||
:rules="ruleInline"
|
||||
label-width="130px"
|
||||
label-position="right"
|
||||
@submit.native.prevent
|
||||
>
|
||||
<el-form-item label="链接地址：">
|
||||
<el-input v-model="soure_link" search placeholder="请输入链接地址" class="numPut" />
|
||||
<el-button :loading="loading" size="small" type="primary" @click="add">确定</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
<!--商品复制记录-->
|
||||
<copy-record ref="copyRecord" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import {
|
||||
crawlFromApi,
|
||||
categoryListApi,
|
||||
shippingListApi,
|
||||
productCopyApi,
|
||||
categorySelectApi,
|
||||
categoryBrandListApi,
|
||||
productCopyCountApi,
|
||||
guaranteeTemplateListApi,
|
||||
productConfigApi,
|
||||
getProductLabelApi
|
||||
} from '@/api/product'
|
||||
import ueditorFrom from '@/components/ueditorFrom'
|
||||
import copyRecord from './copyRecord'
|
||||
import SettingMer from '@/libs/settingMer'
|
||||
import { getToken } from '@/utils/auth'
|
||||
import { roterPre } from "@/settings";
|
||||
|
||||
const defaultObj = {
|
||||
store_name: '',
|
||||
cate_id: '',
|
||||
temp_id: '',
|
||||
type: 0,
|
||||
guarantee_template_id: '',
|
||||
keyword: '',
|
||||
unit_name: '',
|
||||
store_info: '',
|
||||
image: '',
|
||||
slider_image: [],
|
||||
content: '',
|
||||
ficti: 0,
|
||||
once_count: 0,
|
||||
give_integral: 0,
|
||||
is_show: 0,
|
||||
price: 0,
|
||||
cost: 0,
|
||||
ot_price: 0,
|
||||
stock: 0,
|
||||
soure_link: '',
|
||||
attrs: [],
|
||||
items: [],
|
||||
delivery_way: [],
|
||||
mer_labels: [],
|
||||
delivery_free: 0,
|
||||
spec_type: 0,
|
||||
is_copoy: 1,
|
||||
attrValue: [{
|
||||
image: '',
|
||||
price: 0,
|
||||
cost: 0,
|
||||
ot_price: 0,
|
||||
stock: 0,
|
||||
bar_code: '',
|
||||
weight: 0,
|
||||
volume: 0
|
||||
}]
|
||||
}
|
||||
const objTitle = {
|
||||
price: {
|
||||
title: '售价'
|
||||
},
|
||||
cost: {
|
||||
title: '成本价'
|
||||
},
|
||||
ot_price: {
|
||||
title: '市场价'
|
||||
},
|
||||
stock: {
|
||||
title: '库存'
|
||||
},
|
||||
bar_code: {
|
||||
title: '商品编号'
|
||||
},
|
||||
weight: {
|
||||
title: '重量（KG）'
|
||||
},
|
||||
volume: {
|
||||
title: '体积(m³)'
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'CopyTaoBao',
|
||||
components: { ueditorFrom, copyRecord },
|
||||
data() {
|
||||
const url = SettingMer.https + '/upload/image/0/file?ueditor=1&token=' + getToken()
|
||||
return {
|
||||
roterPre: roterPre,
|
||||
modals: false,
|
||||
loading: false,
|
||||
loading1: false,
|
||||
BaseURL: SettingMer.https || 'http://localhost:8080',
|
||||
OneattrValue: [Object.assign({}, defaultObj.attrValue[0])], // 单规格
|
||||
ManyAttrValue: [Object.assign({}, defaultObj.attrValue[0])], // 多规格
|
||||
columnsBatch: [
|
||||
{
|
||||
title: '图片',
|
||||
slot: 'image',
|
||||
align: 'center',
|
||||
minWidth: 80
|
||||
},
|
||||
{
|
||||
title: '售价',
|
||||
slot: 'price',
|
||||
align: 'center',
|
||||
minWidth: 95
|
||||
},
|
||||
{
|
||||
title: '成本价',
|
||||
slot: 'cost',
|
||||
align: 'center',
|
||||
minWidth: 95
|
||||
},
|
||||
{
|
||||
title: '市场价',
|
||||
slot: 'ot_price',
|
||||
align: 'center',
|
||||
minWidth: 95
|
||||
},
|
||||
{
|
||||
title: '库存',
|
||||
slot: 'stock',
|
||||
align: 'center',
|
||||
minWidth: 95
|
||||
},
|
||||
{
|
||||
title: '商品编号',
|
||||
slot: 'bar_code',
|
||||
align: 'center',
|
||||
minWidth: 120
|
||||
},
|
||||
{
|
||||
title: '重量（KG）',
|
||||
slot: 'weight',
|
||||
align: 'center',
|
||||
minWidth: 95
|
||||
},
|
||||
{
|
||||
title: '体积(m³)',
|
||||
slot: 'volume',
|
||||
align: 'center',
|
||||
minWidth: 95
|
||||
}
|
||||
],
|
||||
manyTabDate: {},
|
||||
count: 0,
|
||||
modal_loading: false,
|
||||
images: '',
|
||||
soure_link: '',
|
||||
modalPic: false,
|
||||
isChoice: '',
|
||||
gridPic: {
|
||||
xl: 6,
|
||||
lg: 8,
|
||||
md: 12,
|
||||
sm: 12,
|
||||
xs: 12
|
||||
},
|
||||
gridBtn: {
|
||||
xl: 4,
|
||||
lg: 8,
|
||||
md: 8,
|
||||
sm: 8,
|
||||
xs: 8
|
||||
},
|
||||
columns: [],
|
||||
virtual: [
|
||||
{ tit: '普通商品', id: 0, tit2: '物流发货' },
|
||||
{ tit: '虚拟商品', id: 1, tit2: '虚拟发货' }
|
||||
],
|
||||
categoryList: [], // 平台
|
||||
merCateList: [], // 商户
|
||||
BrandList: [], // 品牌
|
||||
propsMer: { emitPath: false, multiple: true },
|
||||
tableFrom: {
|
||||
mer_cate_id: '',
|
||||
cate_id: '',
|
||||
keyword: '',
|
||||
type: '1',
|
||||
is_gift_bag: ''
|
||||
},
|
||||
ruleInline: {
|
||||
cate_id: [
|
||||
{ required: true, message: '请选择商品分类', trigger: 'change' }
|
||||
],
|
||||
mer_cate_id: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择商户分类',
|
||||
trigger: 'change',
|
||||
type: 'array',
|
||||
min: '1'
|
||||
}
|
||||
],
|
||||
temp_id: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择运费模板',
|
||||
trigger: 'change',
|
||||
type: 'number'
|
||||
}
|
||||
],
|
||||
brand_id: [
|
||||
{ required: true, message: '请选择品牌', trigger: 'change' }
|
||||
],
|
||||
store_info: [{ required: true, message: '请输入商品简介', trigger: 'blur' }],
|
||||
delivery_way: [{ required: true, message: '请选择送货方式', trigger: 'change' }]
|
||||
},
|
||||
grid: {
|
||||
xl: 8,
|
||||
lg: 8,
|
||||
md: 12,
|
||||
sm: 24,
|
||||
xs: 24
|
||||
},
|
||||
grid2: {
|
||||
xl: 12,
|
||||
lg: 12,
|
||||
md: 12,
|
||||
sm: 24,
|
||||
xs: 24
|
||||
},
|
||||
myConfig: {
|
||||
autoHeightEnabled: false, // 编辑器不自动被内容撑高
|
||||
initialFrameHeight: 500, // 初始容器高度
|
||||
initialFrameWidth: '100%', // 初始容器宽度
|
||||
UEDITOR_HOME_URL: '/UEditor/',
|
||||
'serverUrl': url,
|
||||
'imageUrl': url,
|
||||
'imageFieldName': 'file',
|
||||
imageUrlPrefix: '',
|
||||
'imageActionName': 'upfile',
|
||||
'imageMaxSize': 2048000,
|
||||
'imageAllowFiles': ['.png', '.jpg', '.jpeg', '.gif', '.bmp']
|
||||
},
|
||||
formThead: Object.assign({}, objTitle),
|
||||
formValidate: Object.assign({}, defaultObj),
|
||||
items: [
|
||||
{
|
||||
image: '',
|
||||
price: 0,
|
||||
cost: 0,
|
||||
ot_price: 0,
|
||||
stock: 0,
|
||||
bar_code: '',
|
||||
weight: 0,
|
||||
volume: 0
|
||||
}
|
||||
],
|
||||
shippingList: [],
|
||||
guaranteeList: [], // 服务保障模板
|
||||
isData: false,
|
||||
artFrom: {
|
||||
type: 'taobao',
|
||||
url: ''
|
||||
},
|
||||
tableIndex: 0,
|
||||
labelPosition: 'right',
|
||||
labelWidth: '120',
|
||||
isMore: '',
|
||||
taoBaoStatus: {},
|
||||
attrInfo: {},
|
||||
labelList: [],
|
||||
oneFormBatch: [
|
||||
{
|
||||
image: '',
|
||||
price: 0,
|
||||
cost: 0,
|
||||
ot_price: 0,
|
||||
stock: 0,
|
||||
bar_code: '',
|
||||
weight: 0,
|
||||
volume: 0
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
attrValue() {
|
||||
const obj = Object.assign({}, defaultObj.attrValue[0])
|
||||
delete obj.image
|
||||
return obj
|
||||
},
|
||||
// oneFormBatch() {
|
||||
// const obj = [Object.assign({}, defaultObj.attrValue[0])]
|
||||
// delete obj[0].bar_code
|
||||
// return obj
|
||||
// }
|
||||
},
|
||||
watch: {},
|
||||
created() {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
|
||||
this.getCopyCount()
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 获取标签项
|
||||
getLabelLst() {
|
||||
getProductLabelApi().then(res => {
|
||||
this.labelList = res.data
|
||||
})
|
||||
.catch(res => {
|
||||
this.$message.error(res.message)
|
||||
})
|
||||
},
|
||||
// 获取剩余复制次数
|
||||
getCopyCount() {
|
||||
productCopyCountApi().then((res) => {
|
||||
this.count = res.data.count
|
||||
})
|
||||
},
|
||||
// 查看复制记录
|
||||
openRecords() {
|
||||
this.$refs.copyRecord.getRecord()
|
||||
},
|
||||
batchDel() {
|
||||
this.oneFormBatch = [
|
||||
{
|
||||
image: '',
|
||||
price: 0,
|
||||
cost: 0,
|
||||
ot_price: 0,
|
||||
stock: 0,
|
||||
bar_code: '',
|
||||
weight: 0,
|
||||
volume: 0
|
||||
}
|
||||
]
|
||||
},
|
||||
batchAdd() {
|
||||
for (const val of this.ManyAttrValue) {
|
||||
this.$set(val, 'image', this.oneFormBatch[0].image)
|
||||
this.$set(val, 'price', this.oneFormBatch[0].price)
|
||||
this.$set(val, 'cost', this.oneFormBatch[0].cost)
|
||||
this.$set(val, 'ot_price', this.oneFormBatch[0].ot_price)
|
||||
this.$set(val, 'stock', this.oneFormBatch[0].stock)
|
||||
this.$set(val, 'bar_code', this.oneFormBatch[0].bar_code)
|
||||
this.$set(val, 'weight', this.oneFormBatch[0].weight)
|
||||
this.$set(val, 'volume', this.oneFormBatch[0].volume)
|
||||
this.$set(val, 'extension_one', this.oneFormBatch[0].extension_one)
|
||||
this.$set(val, 'extension_two', this.oneFormBatch[0].extension_two)
|
||||
}
|
||||
},
|
||||
// 删除表格中的属性
|
||||
delAttrTable(index) {
|
||||
this.ManyAttrValue.splice(index, 1)
|
||||
},
|
||||
// 获取运费模板；
|
||||
productGetTemplate() {
|
||||
shippingListApi().then((res) => {
|
||||
this.shippingList = res.data
|
||||
})
|
||||
},
|
||||
// 获取服务保障模板
|
||||
getGuaranteeList() {
|
||||
guaranteeTemplateListApi().then(res => {
|
||||
this.guaranteeList = res.data
|
||||
})
|
||||
},
|
||||
// 删除图片
|
||||
handleRemove(i) {
|
||||
this.formValidate.slider_image.splice(i, 1)
|
||||
},
|
||||
// 选择主图
|
||||
checked(item, index) {
|
||||
this.formValidate.image = item
|
||||
},
|
||||
// 商品分类；
|
||||
goodsCategory() {
|
||||
categoryListApi()
|
||||
.then((res) => {
|
||||
this.categoryList = res.data
|
||||
})
|
||||
.catch((res) => {
|
||||
this.$message.error(res.message)
|
||||
})
|
||||
},
|
||||
// 商户分类；
|
||||
getCategorySelect() {
|
||||
categorySelectApi()
|
||||
.then((res) => {
|
||||
this.merCateList = res.data
|
||||
})
|
||||
.catch((res) => {
|
||||
this.$message.error(res.message)
|
||||
})
|
||||
},
|
||||
// 品牌筛选；
|
||||
getBrandListApi() {
|
||||
categoryBrandListApi()
|
||||
.then((res) => {
|
||||
this.BrandList = res.data
|
||||
})
|
||||
.catch((res) => {
|
||||
this.$message.error(res.message)
|
||||
})
|
||||
},
|
||||
virtualbtn(id, type) {
|
||||
this.formValidate.type = id
|
||||
this.productCon()
|
||||
},
|
||||
watCh(val) {
|
||||
const tmp = {}
|
||||
const tmpTab = {}
|
||||
this.formValidate.attr.forEach((o, i) => {
|
||||
tmp['value' + i] = { title: o.value }
|
||||
tmpTab['value' + i] = ''
|
||||
})
|
||||
this.ManyAttrValue = this.attrFormat(val)
|
||||
console.log(this.ManyAttrValue)
|
||||
this.ManyAttrValue.forEach((val, index) => {
|
||||
const key = Object.values(val.detail).sort().join('/')
|
||||
if (this.attrInfo[key]) this.ManyAttrValue[index] = this.attrInfo[key]
|
||||
val.image = this.formValidate.image
|
||||
})
|
||||
this.attrInfo = {}
|
||||
this.ManyAttrValue.forEach((val) => {
|
||||
if (val.detail !== 'undefined' && val.detail !== null) {
|
||||
this.attrInfo[Object.values(val.detail).sort().join('/')] = val
|
||||
}
|
||||
})
|
||||
this.manyTabTit = tmp
|
||||
this.manyTabDate = tmpTab
|
||||
this.formThead = Object.assign({}, this.formThead, tmp)
|
||||
},
|
||||
attrFormat(arr) {
|
||||
let data = []
|
||||
const res = []
|
||||
return format(arr)
|
||||
function format(arr) {
|
||||
if (arr.length > 1) {
|
||||
arr.forEach((v, i) => {
|
||||
if (i === 0) data = arr[i]['detail']
|
||||
const tmp = []
|
||||
data.forEach(function(vv) {
|
||||
arr[i + 1] && arr[i + 1]['detail'] && arr[i + 1]['detail'].forEach(g => {
|
||||
const rep2 = (i !== 0 ? '' : arr[i]['value'] + '_$_') + vv + '-$-' + arr[i + 1]['value'] + '_$_' + g
|
||||
tmp.push(rep2)
|
||||
if (i === (arr.length - 2)) {
|
||||
const rep4 = {
|
||||
image: '',
|
||||
price: 0,
|
||||
cost: 0,
|
||||
ot_price: 0,
|
||||
stock: 0,
|
||||
bar_code: '',
|
||||
weight: 0,
|
||||
volume: 0,
|
||||
brokerage: 0,
|
||||
brokerage_two: 0
|
||||
}
|
||||
rep2.split('-$-').forEach((h, k) => {
|
||||
const rep3 = h.split('_$_')
|
||||
if (!rep4['detail']) rep4['detail'] = {}
|
||||
rep4['detail'][rep3[0]] = rep3.length > 1 ? rep3[1] : ''
|
||||
})
|
||||
Object.values(rep4.detail).forEach((v, i) => {
|
||||
rep4['value' + i] = v
|
||||
})
|
||||
res.push(rep4)
|
||||
}
|
||||
})
|
||||
})
|
||||
data = tmp.length ? tmp : []
|
||||
})
|
||||
} else {
|
||||
const dataArr = []
|
||||
arr.forEach((v, k) => {
|
||||
v['detail'].forEach((vv, kk) => {
|
||||
dataArr[kk] = v['value'] + '_' + vv
|
||||
res[kk] = {
|
||||
image: '',
|
||||
price: 0,
|
||||
cost: 0,
|
||||
ot_price: 0,
|
||||
stock: 0,
|
||||
bar_code: '',
|
||||
weight: 0,
|
||||
volume: 0,
|
||||
brokerage: 0,
|
||||
brokerage_two: 0,
|
||||
detail: { [v['value']]: vv }
|
||||
}
|
||||
Object.values(res[kk].detail).forEach((v, i) => {
|
||||
res[kk]['value' + i] = v
|
||||
})
|
||||
})
|
||||
})
|
||||
data.push(dataArr.join('$&'))
|
||||
}
|
||||
console.log(res)
|
||||
return res
|
||||
}
|
||||
},
|
||||
// 生成表单
|
||||
add() {
|
||||
if (this.soure_link) {
|
||||
var reg = /(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/
|
||||
if (!reg.test(this.soure_link)) {
|
||||
return this.$message.warning('请输入以http开头的地址！')
|
||||
}
|
||||
this.artFrom.url = this.soure_link
|
||||
this.loading = true
|
||||
crawlFromApi(this.artFrom)
|
||||
.then((res) => {
|
||||
const info = res.data
|
||||
this.modals = false
|
||||
this.$emit('info-data', info);
|
||||
})
|
||||
.catch((res) => {
|
||||
this.$message.error(res.message)
|
||||
this.loading = false
|
||||
})
|
||||
} else {
|
||||
this.$message.warning('请输入链接地址！')
|
||||
}
|
||||
},
|
||||
// 提交
|
||||
handleSubmit(name) {
|
||||
this.$refs[name].validate((valid) => {
|
||||
if (valid) {
|
||||
this.modal_loading = true
|
||||
this.formValidate.cate_id = this.formValidate.cate_id instanceof Array ? this.formValidate.cate_id.pop() : this.formValidate.cate_id
|
||||
this.formValidate.once_count = this.formValidate.once_count || 0
|
||||
if (this.formValidate.spec_type == 1) {
|
||||
this.formValidate.attrValue = this.ManyAttrValue
|
||||
} else {
|
||||
this.formValidate.attrValue = this.OneattrValue
|
||||
this.formValidate.attr = []
|
||||
}
|
||||
this.formValidate.is_copoy = 1
|
||||
// this.formValidate.attrValue = this.items
|
||||
this.loading1 = true
|
||||
productCopyApi(this.formValidate)
|
||||
.then((res) => {
|
||||
this.$message.success('商品默认为不上架状态请手动上架商品!')
|
||||
this.loading1 = false
|
||||
setTimeout(() => {
|
||||
this.modal_loading = false
|
||||
}, 500)
|
||||
setTimeout(() => {
|
||||
this.modals = false
|
||||
}, 600)
|
||||
this.$emit('getSuccess')
|
||||
})
|
||||
.catch((res) => {
|
||||
this.modal_loading = false
|
||||
this.$message.error(res.message)
|
||||
this.loading1 = false
|
||||
})
|
||||
} else {
|
||||
if (!this.formValidate.cate_id) {
|
||||
this.$message.warning('请填写商品分类！')
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 点击商品图
|
||||
modalPicTap(tit, num, index) {
|
||||
this.tableIndex = index
|
||||
const _this = this
|
||||
this.$modalUpload(function(img) {
|
||||
console.log(_this.formValidate.attr[_this.tableIndex])
|
||||
if (tit === '1') {
|
||||
if (index === 'pi') {
|
||||
_this.oneFormBatch[0].image = img[0]
|
||||
} else {
|
||||
_this.OneattrValue[0].image = img[0]
|
||||
}
|
||||
}
|
||||
if (tit === '2') {
|
||||
_this.ManyAttrValue[_this.tableIndex].image = img[0]
|
||||
}
|
||||
_this.modalPic = false
|
||||
// _this.formValidate.image = img[0];
|
||||
// _this.OneattrValue[0].image = img[0];
|
||||
}, tit)
|
||||
},
|
||||
// 获取单张图片信息
|
||||
getPic(pc) {
|
||||
this.callback(pc)
|
||||
this.formValidate.attr[this.tableIndex].pic = pc.att_dir
|
||||
this.modalPic = false
|
||||
},
|
||||
handleDragStart(e, item) {
|
||||
this.dragging = item
|
||||
},
|
||||
handleDragEnd(e, item) {
|
||||
this.dragging = null
|
||||
},
|
||||
// 首先把div变成可以放置的元素，即重写dragenter/dragover
|
||||
handleDragOver(e) {
|
||||
// e.dataTransfer.dropEffect="move";//在dragenter中针对放置目标来设置!
|
||||
e.dataTransfer.dropEffect = 'move'
|
||||
},
|
||||
handleDragEnter(e, item) {
|
||||
// 为需要移动的元素设置dragstart事件
|
||||
e.dataTransfer.effectAllowed = 'move'
|
||||
if (item === this.dragging) {
|
||||
return
|
||||
}
|
||||
const newItems = [...this.formValidate.slider_image]
|
||||
const src = newItems.indexOf(this.dragging)
|
||||
const dst = newItems.indexOf(item)
|
||||
newItems.splice(dst, 0, ...newItems.splice(src, 1))
|
||||
this.formValidate.slider_image = newItems
|
||||
},
|
||||
// 添加自定义弹窗
|
||||
addCustomDialog(editorId) {
|
||||
window.UE.registerUI(
|
||||
'test-dialog',
|
||||
function(editor, uiName) {
|
||||
const dialog = new window.UE.ui.Dialog({
|
||||
iframeUrl: '/admin/widget.images/index.html?fodder=dialog',
|
||||
editor: editor,
|
||||
name: uiName,
|
||||
title: '上传图片',
|
||||
cssRules: 'width:1200px;height:500px;padding:20px;'
|
||||
})
|
||||
this.dialog = dialog
|
||||
var btn = new window.UE.ui.Button({
|
||||
name: 'dialog-button',
|
||||
title: '上传图片',
|
||||
cssRules: `background-image: url(../../../assets/images/icons.png);background-position: -726px -77px;`,
|
||||
onclick: function() {
|
||||
dialog.render()
|
||||
dialog.open()
|
||||
}
|
||||
})
|
||||
return btn
|
||||
},
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
/deep/.el-cascader {
|
||||
display: block;
|
||||
}
|
||||
.dialog-scustom {
|
||||
width: 1200px;
|
||||
height: 600px;
|
||||
}
|
||||
.ela-btn {
|
||||
color: #2d8cf0;
|
||||
}
|
||||
.Box .ivu-radio-wrapper {
|
||||
margin-right: 25px;
|
||||
}
|
||||
.Box .numPut {
|
||||
width: 80% !important;
|
||||
}
|
||||
.lunBox {
|
||||
/* width 80px */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid #0bb20c;
|
||||
}
|
||||
.pictrueBox {
|
||||
display: inline-block;
|
||||
}
|
||||
.pictrue {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border: 1px dotted rgba(0, 0, 0, 0.1);
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.pictrueTab {
|
||||
width: 40px !important;
|
||||
height: 40px !important;
|
||||
}
|
||||
.upLoad {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border: 1px dotted rgba(0, 0, 0, 0.1);
|
||||
border-radius: 4px;
|
||||
background: rgba(0, 0, 0, 0.02);
|
||||
cursor: pointer;
|
||||
}
|
||||
.ft {
|
||||
color: red;
|
||||
}
|
||||
.buttonGroup {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
box-sizing: border-box;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
.buttonGroup .small-btn {
|
||||
position: relative;
|
||||
float: left;
|
||||
height: 24px;
|
||||
padding: 0 7px;
|
||||
font-size: 14px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.buttonGroup .small-btn:first-child {
|
||||
margin-left: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
.virtual_boder {
|
||||
border: 1px solid #1890FF;
|
||||
}
|
||||
.virtual_boder2 {
|
||||
border: 1px solid #E7E7E7;
|
||||
}
|
||||
.virtual_san {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-bottom: 26px solid #1890FF;
|
||||
border-left: 26px solid transparent;
|
||||
}
|
||||
.virtual_dui {
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
right: 2px;
|
||||
color: #FFFFFF;
|
||||
font-family: system-ui;
|
||||
}
|
||||
.virtual {
|
||||
width: 120px;
|
||||
height: 60px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
padding-top: 8px;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
line-height: 23px;
|
||||
.virtual_top {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
}
|
||||
.virtual_bottom {
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
.virtual:nth-child(2n) {
|
||||
margin: 0 12px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,6 +1,7 @@
|
|||
<template>
|
||||
<div class="divBox">
|
||||
<el-card class="box-card">
|
||||
<!--顶部内容-->
|
||||
<div slot="header" class="clearfix">
|
||||
<el-tabs v-model="tableFrom.type" @tab-click="getList(1),getLstFilterApi()">
|
||||
<el-tab-pane v-for="(item,index) in headeNum" :key="index" :name="item.type.toString()" :label="item.name +'('+item.count +')' " />
|
||||
|
|
@ -13,6 +14,7 @@
|
|||
</el-form-item>
|
||||
<el-form-item label="商户名称：">
|
||||
<el-select v-model="tableFrom.mer_id" clearable filterable placeholder="请选择" class="selWidth" @change="getList(1)">
|
||||
<el-option label="平台" :value="0" />
|
||||
<el-option v-for="item in merSelect" :key="item.mer_id" :label="item.mer_name" :value="item.mer_id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
|
@ -38,48 +40,49 @@
|
|||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="会员价设置：">
|
||||
<el-select v-model="tableFrom.svip_price_type" placeholder="请选择" class="selWidth" clearable @change="getList(1)">
|
||||
<el-option label="未设置" value="0" />
|
||||
<el-option label="默认设置" value="1" />
|
||||
<el-option label="自定义设置" value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品推荐：">
|
||||
<el-select v-model="tableFrom.hot_type" placeholder="请选择" class="filter-item selWidth" clearable filterable @change="getList(1)">
|
||||
<el-option v-for="item in recommendList" :key="item.value" :label="item.name" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品类型：">
|
||||
<el-select v-model="tableFrom.is_ficti" placeholder="请选择" class="filter-item selWidth" clearable @change="getList(1)">
|
||||
<el-option v-for="item in productTypeList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品搜索：">
|
||||
<el-input v-model="tableFrom.keyword" @keyup.enter.native="getList(1)" placeholder="请输入商品名称，关键字，产品编号" class="selWidth">
|
||||
<el-button slot="append" icon="el-icon-search" class="el-button-solt" @click="getList(1)" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-select v-model="tableFrom.svip_price_type" placeholder="请选择" class="selWidth" clearable @change="getList(1)">
|
||||
<el-option label="未设置" value="0" />
|
||||
<el-option label="默认设置" value="1" />
|
||||
<el-option label="自定义设置" value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品推荐：">
|
||||
<el-select v-model="tableFrom.hot_type" placeholder="请选择" class="filter-item selWidth" clearable filterable @change="getList(1)">
|
||||
<el-option v-for="item in recommendList" :key="item.value" :label="item.name" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品类型：">
|
||||
<el-select v-model="tableFrom.is_ficti" placeholder="请选择" class="filter-item selWidth" clearable @change="getList(1)">
|
||||
<el-option v-for="item in productTypeList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品搜索：">
|
||||
<el-input v-model="tableFrom.keyword" @keyup.enter.native="getList(1)" placeholder="请输入商品名称，关键字，产品编号" class="selWidth">
|
||||
<el-button slot="append" icon="el-icon-search" class="el-button-solt" @click="getList(1)" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<router-link :to="{ path:`${roterPre}` + '/product/addProduct' }">
|
||||
<el-button size="small" type="primary">添加商品</el-button>
|
||||
</router-link>
|
||||
<el-button v-show="tableFrom.type === '6'" size="mini" :disabled="multipleSelection.length==0" @click="batch">批量审核</el-button>
|
||||
<el-button size="mini" :disabled="multipleSelection.length==0 " @click="batchOff">批量强制下架</el-button>
|
||||
<el-button size="mini" :disabled="multipleSelection.length==0 " @click="batchShow(0)">批量不显示</el-button>
|
||||
<el-button size="mini" :disabled="multipleSelection.length==0 " @click="batchShow(1)">批量显示</el-button>
|
||||
<el-button :disabled="multipleSelection.length==0" size="mini" @click="batchLabel">批量设置标签</el-button>
|
||||
<el-button :disabled="multipleSelection.length==0" size="mini" @click="batchRecommend">批量设置推荐</el-button>
|
||||
</div>
|
||||
<el-button v-show="tableFrom.type === '6'" size="mini" :disabled="multipleSelection.length==0" @click="batch">批量审核</el-button>
|
||||
<el-button size="mini" :disabled="multipleSelection.length==0 " @click="batchOff">批量强制下架</el-button>
|
||||
<el-button size="mini" :disabled="multipleSelection.length==0 " @click="batchShow(0)">批量不显示</el-button>
|
||||
<el-button size="mini" :disabled="multipleSelection.length==0 " @click="batchShow(1)">批量显示</el-button>
|
||||
<el-button :disabled="multipleSelection.length==0" size="mini" @click="batchLabel">批量设置标签</el-button>
|
||||
<el-button :disabled="multipleSelection.length==0" size="mini" @click="batchRecommend">批量设置推荐</el-button>
|
||||
</div>
|
||||
<!--表格信息-->
|
||||
<el-table v-loading="listLoading" :data="tableData.data" style="width: 100%" size="mini" @selection-change="handleSelectionChange">
|
||||
<el-table-column v-if="Number(tableFrom.type)<7" key="2" type="selection" width="55" />
|
||||
<el-table-column type="expand">
|
||||
<el-table-column v-if="Number(tableFrom.type)<7" key="2" type="selection" width="30" />
|
||||
<el-table-column type="expand" align="center" width="50">
|
||||
<template slot-scope="props">
|
||||
<el-form label-position="left" inline class="demo-table-expand">
|
||||
<el-form-item label="平台分类：">
|
||||
<span>{{ props.row.storeCategory?props.row.storeCategory.cate_name:'-' }}</span>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="商户类别：">
|
||||
<span v-if="props.row.merchant" class="spBlock">{{ props.row.merchant .is_trader ? '自营' : '非自营' }}</span>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="商品分类：">
|
||||
<template v-if="props.row.merCateId.length">
|
||||
<span v-for="(item, index) in props.row.merCateId" :key="index" class="mr10">{{ item.category ? item.category.cate_name : '-' }}</span>
|
||||
|
|
@ -101,71 +104,53 @@
|
|||
<el-form-item label="已售数量：">
|
||||
<span>{{ props.row.ficti | filterEmpty }}</span>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="抵扣积分：">
|
||||
<span>{{ props.row.integral_total }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="积分抵扣金额：">
|
||||
<span>{{ props.row.integral_price_total }}</span>
|
||||
</el-form-item> -->
|
||||
</el-form>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="product_id" label="ID" min-width="80" />
|
||||
<el-table-column label="商品图" min-width="70">
|
||||
<el-table-column prop="product_id" label="ID" min-width="50" align="center"/>
|
||||
<el-table-column label="商品信息" min-width="230" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div class="demo-image__preview">
|
||||
<el-image style="width: 36px; height: 36px" :src="scope.row.image" :preview-src-list="[scope.row.image]" />
|
||||
<div class="user-content">
|
||||
<div class="user-avatar">
|
||||
<el-image class="logo" :src="scope.row.image" :preview-src-list="[scope.row.image]" />
|
||||
</div>
|
||||
<div class="user-info">
|
||||
<div class="nickname">{{ scope.row.store_name || '-' }}</div>
|
||||
<div :class="['agent-type-text','tags_name', 'name'+scope.row.spec_type]">{{ scope.row.spec_type==0 ? '[单规格]' : '[多规格]' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="store_name" label="商品名称" min-width="200">
|
||||
<template slot-scope="scope">
|
||||
<div><span class="tags_name" :class="'name'+scope.row.spec_type">{{ scope.row.spec_type==0 ? '[单规格]' : '[多规格]' }}</span>{{ scope.row.store_name || '-' }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商户名称" min-width="150">
|
||||
<el-table-column label="商户名称" min-width="150" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.merchant ? scope.row.merchant.mer_name : '' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="mer_name" label="商户类别" min-width="90">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.merchant" class="spBlock">{{ scope.row.merchant .is_trader ? '自营' : '非自营' }}</span>
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column prop="price" label="商品售价" min-width="80" />
|
||||
<!-- <el-table-column prop="svip_price" label="会员价" min-width="70">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.svip_price || '-' }}</span>
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column prop="sales" label="销量" min-width="70" />
|
||||
<!-- <el-table-column prop="integral_total" label="抵扣积分" min-width="90" />
|
||||
<el-table-column prop="integral_price_total" label="积分抵扣金额" min-width="90" /> -->
|
||||
<el-table-column prop="stock" label="库存" min-width="70" />
|
||||
<el-table-column label="推荐级别" min-width="150">
|
||||
<el-table-column prop="price" label="商品售价" min-width="80" align="center"/>
|
||||
<el-table-column prop="sales" label="销量" min-width="70" align="center"/>
|
||||
<el-table-column prop="stock" label="库存" min-width="70" align="center"/>
|
||||
<el-table-column label="推荐级别" min-width="130" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-rate disabled v-model="scope.row.star" :colors="colors">
|
||||
</el-rate>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="rank" label="排序" min-width="60" />
|
||||
<el-table-column prop="status" label="是否显示" min-width="80">
|
||||
<el-table-column prop="rank" label="排序" min-width="50" align="center"/>
|
||||
<el-table-column prop="status" label="是否显示" min-width="80" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-switch v-model="scope.row.is_used" :active-value="1" :inactive-value="0" active-text="显示" inactive-text="隐藏" @change="onchangeIsShow(scope.row)" />
|
||||
<div class="switch-content">
|
||||
<el-switch v-model="scope.row.is_used" :active-value="1" :inactive-value="0" active-text="显示" inactive-text="隐藏" @change="onchangeIsShow(scope.row)" />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stock" label="商品状态" min-width="90">
|
||||
<el-table-column prop="stock" label="商品状态" min-width="90" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.us_status | productStatusFilter }}</span>
|
||||
<div class="switch-content" v-if="scope.row.mer_id <= 0">
|
||||
<el-switch :value="Number(scope.row.us_status) == 1" active-text="上架" inactive-text="下架" @change="changeStatus(scope.row)" />
|
||||
</div>
|
||||
<span v-else>{{ scope.row.us_status | productStatusFilter }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="stock" label="标签" max-height="120" min-width="90" show-overflow-tooltip>
|
||||
<template slot-scope="scope">
|
||||
<span v-for="(item,index) in scope.row.sys_labels" :key="index" class="label-list">{{ item.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="create_time" label="创建时间" min-width="150" /> -->
|
||||
<el-table-column v-if="Number(tableFrom.type) < 7" key="8" label="操作" min-width="180" fixed="right" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" size="small" @click="onDetails(scope.row.product_id)">详情</el-button>
|
||||
|
|
@ -178,7 +163,7 @@
|
|||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<!-- <el-dropdown-item @click.native="onDetails(scope.row.product_id)">查看详情</el-dropdown-item> -->
|
||||
<el-dropdown-item v-if="Number(tableFrom.type) < 7" @click.native="onEdit(scope.row.product_id)">编辑商品</el-dropdown-item>
|
||||
<el-dropdown-item v-if="Number(tableFrom.type) < 7" @click.native="onEdit(scope.row)">编辑商品</el-dropdown-item>
|
||||
<el-dropdown-item v-if="tableFrom.type != 5">
|
||||
<router-link :to="{path: roterPre + '/product/comment/?product_id=' + scope.row.product_id}" style="font-size: 14px;">
|
||||
查看评价
|
||||
|
|
@ -306,7 +291,8 @@ import {
|
|||
updatetProductLabel,
|
||||
batchesLabelsApi,
|
||||
batchesRecommendApi,
|
||||
batchesOnOffApi
|
||||
batchesOnOffApi,
|
||||
changeProductStatus
|
||||
} from '@/api/product'
|
||||
import { roterPre } from '@/settings'
|
||||
import infoFrom from './info'
|
||||
|
|
@ -385,7 +371,7 @@ export default {
|
|||
store_name: '',
|
||||
rank: '',
|
||||
us_status: '',
|
||||
star: ''
|
||||
star: 0
|
||||
},
|
||||
productStatusList: [
|
||||
{ label: "上架显示", value: 1 },
|
||||
|
|
@ -454,15 +440,24 @@ export default {
|
|||
this.getLstFilterApi()
|
||||
},
|
||||
onchangeIsShow(row) {
|
||||
changeApi(row.product_id, row.is_used).then(({
|
||||
message
|
||||
}) => {
|
||||
changeApi(row.product_id, row.is_used).then(({message}) => {
|
||||
this.$message.success(message)
|
||||
this.getList('')
|
||||
this.getLstFilterApi()
|
||||
}).catch(({
|
||||
message
|
||||
}) => {
|
||||
}).catch(({message}) => {
|
||||
this.$message.error(message)
|
||||
})
|
||||
},
|
||||
// 修改商品状态
|
||||
changeStatus(row){
|
||||
// 状态取反
|
||||
let status = Number(row.us_status) == 1 ? 0 : 1;
|
||||
// 发起请求
|
||||
changeProductStatus(row.product_id, status).then(({message}) => {
|
||||
this.$message.success(message)
|
||||
this.getList('')
|
||||
this.getLstFilterApi()
|
||||
}).catch(({message}) => {
|
||||
this.$message.error(message)
|
||||
})
|
||||
},
|
||||
|
|
@ -573,10 +568,16 @@ export default {
|
|||
this.fullscreenLoading = false
|
||||
})
|
||||
},
|
||||
onEdit(id) {
|
||||
this.productId = id
|
||||
this.getInfo(id)
|
||||
this.dialogVisible = true
|
||||
onEdit(product) {
|
||||
let merId = product.mer_id || 0;
|
||||
// 判断：如果merId 大于0 则商品为商户添加商品，只能进行基本信息编辑；否则是平台添加商品 可以进行全部信息编辑
|
||||
if(merId <= 0){
|
||||
this.$router.push({path: this.roterPre + '/product/addProduct/' + product.product_id});
|
||||
}else{
|
||||
this.productId = product.product_id
|
||||
this.getInfo(product.product_id)
|
||||
this.dialogVisible = true
|
||||
}
|
||||
},
|
||||
// 编辑虚拟销量
|
||||
toVirtualSales(id) {
|
||||
|
|
@ -752,6 +753,22 @@ export default {
|
|||
/deep/.el-select-dropdown__item{
|
||||
max-width: 350px!important;
|
||||
}
|
||||
/deep/ .el-table__cell {
|
||||
.cell{
|
||||
padding: 0!important;
|
||||
.el-table__expand-icon{
|
||||
height: 50px!important;
|
||||
line-height: 50px!important;
|
||||
.el-icon.el-icon-arrow-right{
|
||||
font-size: 30px !important;
|
||||
height: 50px !important;
|
||||
line-height: 50px !important;
|
||||
text-align: center;
|
||||
position: unset!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.template{
|
||||
overflow: hidden;
|
||||
}
|
||||
|
|
@ -768,7 +785,7 @@ export default {
|
|||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
.tags_name{
|
||||
font-size: 10px;
|
||||
font-size: 13px;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
padding: 0 2px;
|
||||
|
|
@ -812,9 +829,78 @@ table .el-image {
|
|||
color: #409EFF;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-down {
|
||||
font-size: 12px;
|
||||
}
|
||||
.user-content{
|
||||
--user-content-height-: 80px;
|
||||
|
||||
height: var(--user-content-height-);
|
||||
width: 100%;
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
.user-avatar{
|
||||
height: var(--user-content-height-);
|
||||
width: var(--user-content-height-);
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.logo{
|
||||
height: 80%!important;
|
||||
width: 80%!important;
|
||||
}
|
||||
}
|
||||
.user-info{
|
||||
max-width: calc(100% - var(--user-content-height-));
|
||||
height: var(--user-content-height-);
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
.nickname{
|
||||
width: 100%;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
text-align: left;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
.user-id{
|
||||
color: #fff;
|
||||
background-color: #409eff;
|
||||
border-color: #409eff;
|
||||
height: 18px;
|
||||
line-height: 20px;
|
||||
font-size: 13px;
|
||||
padding: 0 5px;
|
||||
border-radius: 5px;
|
||||
margin-left: 10px;
|
||||
width: max-content!important;
|
||||
}
|
||||
}
|
||||
.user-id{
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
font-size: 13px;
|
||||
line-height: calc(var(--user-content-height- * 35%));
|
||||
}
|
||||
}
|
||||
}
|
||||
.switch-content{
|
||||
text-align: justify!important;
|
||||
display: inline-flex;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue