7 changed files with 1064 additions and 0 deletions
@ -0,0 +1,120 @@ |
||||
<template> |
||||
<div class="divBox"> |
||||
<el-card class="box-card"> |
||||
<div style="width :100%;height:45px;line-height: 45px;background: #f3f3f3; padding-left:20px"> |
||||
添加广告 |
||||
</div> |
||||
<el-form :rules="rules" ref="form" :model="advertisement" class="formValidate mt20 " label-width="100px"> |
||||
<el-row> |
||||
<el-col :span="13"> |
||||
<el-form-item label="广告名称" prop="storeName"> |
||||
<el-input v-model="advertisement.storeName" maxlength="249" placeholder="请输入商品名称" /> |
||||
</el-form-item> |
||||
</el-col> |
||||
|
||||
<el-col :span="13"> |
||||
<el-form-item label="开始时间" prop="startTime"> |
||||
<el-date-picker style="width:100%" v-model="advertisement.startTime" type="date" value-format="yyyy-MM-dd" placeholder="选择日期"> |
||||
</el-date-picker> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="13"> |
||||
<el-form-item label="结束时间" prop="endTime"> |
||||
<el-date-picker style="width:100%" v-model="advertisement.endTime" type="date" value-format="yyyy-MM-dd" placeholder="选择日期"> |
||||
</el-date-picker> |
||||
</el-form-item> |
||||
</el-col> |
||||
|
||||
<el-col :span="24"> |
||||
<el-form-item label="上线/下线" prop="specType"> |
||||
<el-radio-group v-model="advertisement.specType" @change="onChangeSpec(advertisement.specType)"> |
||||
<el-radio :label="false">上线</el-radio> |
||||
<el-radio :label="true">下线</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
</el-col> |
||||
|
||||
<el-col> |
||||
<el-form-item label="广告图片" prop="picture"> |
||||
<el-upload |
||||
:action="updateFileUrl" |
||||
:data="$store.state.global.headOss" |
||||
:before-upload="imgCompress" |
||||
:on-remove="headPhotoRemove" |
||||
:on-success="headPhotoSuccess" |
||||
:headers="headers" |
||||
:limit="1" |
||||
:on-exceed="handleExceed" |
||||
> |
||||
<el-button size="small" type="primary">点击上传</el-button> |
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过50kb</div> |
||||
</el-upload> |
||||
</el-form-item> |
||||
</el-col> |
||||
|
||||
<el-col :span="13"> |
||||
<el-form-item label="广告链接" prop="link"> |
||||
<el-input v-model="advertisement.link" placeholder="请输入广告链接" /> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
|
||||
<el-form-item> |
||||
<el-button type="primary" class="submission" @click="handleSubmit">提交</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</el-card> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
import { imgCompress } from '@/utils' |
||||
import { getToken } from '@/utils/auth' |
||||
import utils from '@/utils/encode' |
||||
const JSESSIONID = utils.uuid() |
||||
export default { |
||||
data() { |
||||
return { |
||||
advertisement: { specType: false }, |
||||
imgCompress, |
||||
updateFileUrl: process.env.VUE_APP_UPLOAD_URL, |
||||
headers: { |
||||
dataSources: 'WEB', |
||||
Authorization: getToken(), |
||||
JSESSIONID: JSESSIONID, |
||||
token: utils.bcrypt(JSESSIONID) |
||||
}, |
||||
|
||||
rules: { |
||||
storeName: [{ required: true, message: '请输入广告名称', trigger: 'blur' }], |
||||
startTime: [{ required: true, message: '请选择开始时间', trigger: 'change' }], |
||||
endTime: [{ required: true, message: '请选择结束时间', trigger: 'change' }], |
||||
picture: [{ required: true, message: '请上传广告图片', trigger: 'change' }], |
||||
link: [{ required: true, message: '请输入广告链接', trigger: 'blur' }] |
||||
} |
||||
} |
||||
}, |
||||
methods: { |
||||
onChangeSpec(num) {}, |
||||
headPhotoRemove(file, fileList) { |
||||
// 删除 |
||||
this.advertisement.businessLienceImg = undefined |
||||
}, |
||||
|
||||
headPhotoSuccess(res) { |
||||
// 头像上传成功 |
||||
this.advertisement.businessLienceImg = res.data.publicUrl |
||||
console.log(res) |
||||
}, |
||||
handleSubmit() { |
||||
this.$refs['form'].validate(valid => { |
||||
if (valid) { |
||||
this.save(this.advertisement) |
||||
} |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
<style scoped lang="stylus"> |
||||
|
||||
</style> |
@ -0,0 +1,246 @@ |
||||
<template> |
||||
<div class="article-manager"> |
||||
<el-card :bordered="false" shadow="never" class="ivu-mt-16"> |
||||
<div> |
||||
<el-form ref="artFrom" :model="artFrom" label-width="80px" label-position="right" inline @submit.native.prevent> |
||||
<el-form-item label="广告名称:" label-for="pid"> |
||||
<el-input clearable placeholder="广告名称" v-model="artFrom.name" class="form_content_width" /> |
||||
</el-form-item> |
||||
<el-form-item label="是否上线:" label-for="store_name"> |
||||
<el-select v-model="artFrom.type" placeholder="状态" clearable @keyup.enter.native="getByPage"> |
||||
<el-option label="是" value="0" /> |
||||
<el-option label="否" value="1" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="到期时间:" label-for="store_name"> |
||||
<el-date-picker v-model="artFrom.createTime" type="date" placeholder="选择日期"> </el-date-picker> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button type="primary" @click="userSearchs">查询</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
|
||||
<el-button type="primary" class="bnt" @click="addClass()">添加广告</el-button> |
||||
<el-table row-key="id" class="mt14" v-loading="loading" :data="tableData" empty-text="暂无数据"> |
||||
<el-table-column prop="categoryNum" label="编号"></el-table-column> |
||||
<el-table-column prop="categoryName" label="广告名称"></el-table-column> |
||||
<el-table-column prop="categoryName" label="广告位置"></el-table-column> |
||||
<el-table-column prop="icon" label="广告图片" min-width="80"> |
||||
<template slot-scope="scope"> |
||||
<el-image style="width: 50px; height: 50px" :src="scope.row.icon" :preview-src-list="[scope.row.icon]"> </el-image> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="时间" min-width="150"> |
||||
<template slot-scope="scope"> |
||||
<span>开始时间:{{ scope.row.createTime }}</span> |
||||
<br /> |
||||
<span>到期时间:{{ scope.row.updateTime }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column prop="showFlag" label="上线/下线"> |
||||
<template slot-scope="scope"> |
||||
<el-switch active-value="1" inactive-value="0" v-model="scope.row.showFlag" active-color="#13ce66" inactive-color="#ff4949"> </el-switch> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="sort" label="排序" min-width="100" tooltip="true"></el-table-column> |
||||
<el-table-column prop="date" label="操作" width="120" fixed="right"> |
||||
<template slot-scope="scope"> |
||||
<el-button type="text" @click="edit(scope.row)">编辑</el-button> |
||||
|
||||
<el-button @click="del(scope.row, scope)" type="text">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
</el-card> |
||||
<div class="acea-row row-right page"> |
||||
<el-pagination |
||||
@size-change="handleSizeChange" |
||||
@current-change="handleCurrentChange" |
||||
:current-page="page.currentPage" |
||||
:page-sizes="[10, 15, 20, 30]" |
||||
:page-size="page.pageSize" |
||||
layout="total, sizes, prev, pager, next, jumper" |
||||
:total="page.totalCount" |
||||
/> |
||||
</div> |
||||
|
||||
<!-- 添加 编辑表单--> |
||||
<edit-from ref="edits" :FromData="FromData" @submitFail="userSearchs"></edit-from> |
||||
<el-dialog title="添加分类" :visible.sync="editDialogConfig.visible" destroy-on-close :close-on-click-modal="false"> |
||||
<edit ref="edit" :parentOptions="tableData" /> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import edit from '@/components/Category/edit' |
||||
import editFrom from '../../../components/from/from' |
||||
import productApi from '@/api/product/productAttr.js' |
||||
import { loadingFn } from '@/utils/validate' |
||||
export default { |
||||
name: 'product_productClassify', |
||||
components: { |
||||
editFrom, |
||||
edit |
||||
}, |
||||
data() { |
||||
return { |
||||
editDialogConfig: { |
||||
visible: false |
||||
}, |
||||
treeSelect: [], |
||||
FromData: null, |
||||
grid: { |
||||
xl: 7, |
||||
lg: 7, |
||||
md: 12, |
||||
sm: 24, |
||||
xs: 24 |
||||
}, |
||||
loading: false, |
||||
artFrom: { |
||||
page: 1, |
||||
limit: 15 |
||||
}, |
||||
page: { |
||||
currentPage: 1, |
||||
pageSize: 10, |
||||
params: {}, |
||||
totalCount: 0 |
||||
}, |
||||
total: 0, |
||||
tableData: [] |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.getList() |
||||
}, |
||||
methods: { |
||||
handleCommand(e) {}, |
||||
handleSizeChange(val) { |
||||
this.page.pageSize = val |
||||
this.getList() |
||||
}, |
||||
handleCurrentChange(val) { |
||||
this.page.currentPage = val |
||||
this.getList() |
||||
}, |
||||
// 商品分类; |
||||
goodsCategory() {}, |
||||
// 列表 |
||||
getList() { |
||||
loadingFn.call( |
||||
this, |
||||
'loading', |
||||
productApi.classifyGetByPage(this.page).then(res => { |
||||
if ((res.code = 20000)) ({ list: this.tableData = [], totalCount: this.page.totalCount = 0 } = res.data) |
||||
}) |
||||
) |
||||
}, |
||||
pageChange(index) { |
||||
this.artFrom.page = index |
||||
this.getList() |
||||
}, |
||||
// 添加 |
||||
addClass(parent = null) { |
||||
this.editDialogConfig.visible = true |
||||
this.$refs.edit.model = 'classifySave' |
||||
// this.$nextTick(()=>{ |
||||
// this.$refs.edit.parent = parent; |
||||
// }); |
||||
if (parent) { |
||||
let { categoryName, id } = parent |
||||
this.$nextTick(() => { |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { parentCategoryName: categoryName, parentId: id, level: 2 }) |
||||
}) |
||||
} |
||||
}, |
||||
// 编辑 |
||||
edit(row) { |
||||
this.editDialogConfig.visible = true |
||||
this.$nextTick(() => { |
||||
let { level, icon, showFlag, categoryName, sort, parentId, id } = row |
||||
console.log(this.tableData.find(item => item == parentId), 'categoryName') |
||||
if (row.level == 1) { |
||||
this.$refs.edit.model = 'classifyUpdate' |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { level, icon, showFlag, categoryName, sort, parentId, id }) |
||||
} else { |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { |
||||
level, |
||||
icon, |
||||
showFlag, |
||||
parentCategoryName: this.tableData.find(item => item == parentId).categoryName, |
||||
categoryName, |
||||
sort, |
||||
parentId, |
||||
id |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
// 修改状态 |
||||
onchangeIsShow(row) { |
||||
let data = { |
||||
id: row.id, |
||||
is_show: row.is_show |
||||
} |
||||
setShowApi(data) |
||||
.then(async res => { |
||||
this.$message.success(res.msg) |
||||
}) |
||||
.catch(res => { |
||||
this.$message.error(res.msg) |
||||
}) |
||||
}, |
||||
|
||||
// 删除 |
||||
del(row, scope) { |
||||
console.log(scope) |
||||
this.$alert('请确定删除!', '提示', { |
||||
confirmButtonText: '确定', |
||||
callback: action => { |
||||
if (action == 'confirm') { |
||||
loadingFn.call( |
||||
this, |
||||
'loading', |
||||
productApi.classifyDelete(row).then(res => { |
||||
if ((res.code = 20000)) { |
||||
this.$message.success('操作成功!') |
||||
this.handleCurrentChange() |
||||
} |
||||
}) |
||||
) |
||||
} |
||||
} |
||||
}) |
||||
}, |
||||
// 表格搜索 |
||||
userSearchs() { |
||||
this.artFrom.page = 1 |
||||
this.getList() |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
<style scoped lang="stylus"> |
||||
.treeSel ::v-deep .ivu-select-dropdown-list { |
||||
padding: 0 10px !important; |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
.tabBox_img { |
||||
width: 36px; |
||||
height: 36px; |
||||
border-radius: 4px; |
||||
cursor: pointer; |
||||
|
||||
img { |
||||
width: 100%; |
||||
height: 100%; |
||||
|
||||
|
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,230 @@ |
||||
<template> |
||||
<div class="article-manager"> |
||||
<el-card :bordered="false" shadow="never" class="ivu-mt-16"> |
||||
<div> |
||||
<el-form ref="artFrom" :model="artFrom" label-width="80px" label-position="right" inline @submit.native.prevent> |
||||
<el-form-item label="商品名称:" label-for="pid"> |
||||
<el-input clearable placeholder="商品名称" v-model="artFrom.name" class="form_content_width" /> |
||||
</el-form-item> |
||||
<el-form-item label="推荐状态:" label-for="store_name"> |
||||
<el-select v-model="artFrom.type" placeholder="状态" clearable @keyup.enter.native="getByPage"> |
||||
<el-option label="是" value="0" /> |
||||
<el-option label="否" value="1" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-button type="primary" @click="userSearchs">查询</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
|
||||
<el-button type="primary" class="bnt" @click="addClass()">选择商品</el-button> |
||||
<el-table row-key="id" class="mt14" v-loading="loading" :data="tableData" empty-text="暂无数据"> |
||||
<el-table-column prop="categoryNum" label="编号"></el-table-column> |
||||
<el-table-column prop="categoryName" label="商品名称"></el-table-column> |
||||
|
||||
<el-table-column prop="showFlag" label="是否推荐"> |
||||
<template slot-scope="scope"> |
||||
<el-switch active-value="1" inactive-value="0" v-model="scope.row.showFlag" active-color="#13ce66" inactive-color="#ff4949"> </el-switch> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="date" label="操作" width="120" fixed="right"> |
||||
<template slot-scope="scope"> |
||||
<el-button type="text" @click="edit(scope.row)">置顶</el-button> |
||||
|
||||
<el-button @click="del(scope.row, scope)" type="text">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
</el-card> |
||||
<div class="acea-row row-right page"> |
||||
<el-pagination |
||||
@size-change="handleSizeChange" |
||||
@current-change="handleCurrentChange" |
||||
:current-page="page.currentPage" |
||||
:page-sizes="[10, 15, 20, 30]" |
||||
:page-size="page.pageSize" |
||||
layout="total, sizes, prev, pager, next, jumper" |
||||
:total="page.totalCount" |
||||
/> |
||||
</div> |
||||
|
||||
<!-- 添加 编辑表单--> |
||||
<edit-from ref="edits" :FromData="FromData" @submitFail="userSearchs"></edit-from> |
||||
<el-dialog title="添加分类" :visible.sync="editDialogConfig.visible" destroy-on-close :close-on-click-modal="false"> |
||||
<edit ref="edit" :parentOptions="tableData" /> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import edit from '@/components/Category/edit' |
||||
import editFrom from '../../../components/from/from' |
||||
import productApi from '@/api/product/productAttr.js' |
||||
import { loadingFn } from '@/utils/validate' |
||||
export default { |
||||
name: 'product_productClassify', |
||||
components: { |
||||
editFrom, |
||||
edit |
||||
}, |
||||
data() { |
||||
return { |
||||
editDialogConfig: { |
||||
visible: false |
||||
}, |
||||
treeSelect: [], |
||||
FromData: null, |
||||
grid: { |
||||
xl: 7, |
||||
lg: 7, |
||||
md: 12, |
||||
sm: 24, |
||||
xs: 24 |
||||
}, |
||||
loading: false, |
||||
artFrom: { |
||||
page: 1, |
||||
limit: 15 |
||||
}, |
||||
page: { |
||||
currentPage: 1, |
||||
pageSize: 10, |
||||
params: {}, |
||||
totalCount: 0 |
||||
}, |
||||
total: 0, |
||||
tableData: [] |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.getList() |
||||
}, |
||||
methods: { |
||||
handleCommand(e) {}, |
||||
handleSizeChange(val) { |
||||
this.page.pageSize = val |
||||
this.getList() |
||||
}, |
||||
handleCurrentChange(val) { |
||||
this.page.currentPage = val |
||||
this.getList() |
||||
}, |
||||
// 商品分类; |
||||
goodsCategory() {}, |
||||
// 列表 |
||||
getList() { |
||||
loadingFn.call( |
||||
this, |
||||
'loading', |
||||
productApi.classifyGetByPage(this.page).then(res => { |
||||
if ((res.code = 20000)) ({ list: this.tableData = [], totalCount: this.page.totalCount = 0 } = res.data) |
||||
}) |
||||
) |
||||
}, |
||||
pageChange(index) { |
||||
this.artFrom.page = index |
||||
this.getList() |
||||
}, |
||||
// 添加 |
||||
addClass(parent = null) { |
||||
this.editDialogConfig.visible = true |
||||
this.$refs.edit.model = 'classifySave' |
||||
// this.$nextTick(()=>{ |
||||
// this.$refs.edit.parent = parent; |
||||
// }); |
||||
if (parent) { |
||||
let { categoryName, id } = parent |
||||
this.$nextTick(() => { |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { parentCategoryName: categoryName, parentId: id, level: 2 }) |
||||
}) |
||||
} |
||||
}, |
||||
// 编辑 |
||||
edit(row) { |
||||
this.editDialogConfig.visible = true |
||||
this.$nextTick(() => { |
||||
let { level, icon, showFlag, categoryName, sort, parentId, id } = row |
||||
console.log(this.tableData.find(item => item == parentId), 'categoryName') |
||||
if (row.level == 1) { |
||||
this.$refs.edit.model = 'classifyUpdate' |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { level, icon, showFlag, categoryName, sort, parentId, id }) |
||||
} else { |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { |
||||
level, |
||||
icon, |
||||
showFlag, |
||||
parentCategoryName: this.tableData.find(item => item == parentId).categoryName, |
||||
categoryName, |
||||
sort, |
||||
parentId, |
||||
id |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
// 修改状态 |
||||
onchangeIsShow(row) { |
||||
let data = { |
||||
id: row.id, |
||||
is_show: row.is_show |
||||
} |
||||
setShowApi(data) |
||||
.then(async res => { |
||||
this.$message.success(res.msg) |
||||
}) |
||||
.catch(res => { |
||||
this.$message.error(res.msg) |
||||
}) |
||||
}, |
||||
|
||||
// 删除 |
||||
del(row, scope) { |
||||
console.log(scope) |
||||
this.$alert('请确定删除!', '提示', { |
||||
confirmButtonText: '确定', |
||||
callback: action => { |
||||
if (action == 'confirm') { |
||||
loadingFn.call( |
||||
this, |
||||
'loading', |
||||
productApi.classifyDelete(row).then(res => { |
||||
if ((res.code = 20000)) { |
||||
this.$message.success('操作成功!') |
||||
this.handleCurrentChange() |
||||
} |
||||
}) |
||||
) |
||||
} |
||||
} |
||||
}) |
||||
}, |
||||
// 表格搜索 |
||||
userSearchs() { |
||||
this.artFrom.page = 1 |
||||
this.getList() |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
<style scoped lang="stylus"> |
||||
.treeSel ::v-deep .ivu-select-dropdown-list { |
||||
padding: 0 10px !important; |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
.tabBox_img { |
||||
width: 36px; |
||||
height: 36px; |
||||
border-radius: 4px; |
||||
cursor: pointer; |
||||
|
||||
img { |
||||
width: 100%; |
||||
height: 100%; |
||||
|
||||
|
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,230 @@ |
||||
<template> |
||||
<div class="article-manager"> |
||||
<el-card :bordered="false" shadow="never" class="ivu-mt-16"> |
||||
<div> |
||||
<el-form ref="artFrom" :model="artFrom" label-width="80px" label-position="right" inline @submit.native.prevent> |
||||
<el-form-item label="商品名称:" label-for="pid"> |
||||
<el-input clearable placeholder="商品名称" v-model="artFrom.name" class="form_content_width" /> |
||||
</el-form-item> |
||||
<el-form-item label="推荐状态:" label-for="store_name"> |
||||
<el-select v-model="artFrom.type" placeholder="状态" clearable @keyup.enter.native="getByPage"> |
||||
<el-option label="是" value="0" /> |
||||
<el-option label="否" value="1" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-button type="primary" @click="userSearchs">查询</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
|
||||
<el-button type="primary" class="bnt" @click="addClass()">选择商品</el-button> |
||||
<el-table row-key="id" class="mt14" v-loading="loading" :data="tableData" empty-text="暂无数据"> |
||||
<el-table-column prop="categoryNum" label="编号"></el-table-column> |
||||
<el-table-column prop="categoryName" label="商品名称"></el-table-column> |
||||
|
||||
<el-table-column prop="showFlag" label="是否推荐"> |
||||
<template slot-scope="scope"> |
||||
<el-switch active-value="1" inactive-value="0" v-model="scope.row.showFlag" active-color="#13ce66" inactive-color="#ff4949"> </el-switch> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="date" label="操作" width="120" fixed="right"> |
||||
<template slot-scope="scope"> |
||||
<el-button type="text" @click="edit(scope.row)">置顶</el-button> |
||||
|
||||
<el-button @click="del(scope.row, scope)" type="text">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
</el-card> |
||||
<div class="acea-row row-right page"> |
||||
<el-pagination |
||||
@size-change="handleSizeChange" |
||||
@current-change="handleCurrentChange" |
||||
:current-page="page.currentPage" |
||||
:page-sizes="[10, 15, 20, 30]" |
||||
:page-size="page.pageSize" |
||||
layout="total, sizes, prev, pager, next, jumper" |
||||
:total="page.totalCount" |
||||
/> |
||||
</div> |
||||
|
||||
<!-- 添加 编辑表单--> |
||||
<edit-from ref="edits" :FromData="FromData" @submitFail="userSearchs"></edit-from> |
||||
<el-dialog title="添加分类" :visible.sync="editDialogConfig.visible" destroy-on-close :close-on-click-modal="false"> |
||||
<edit ref="edit" :parentOptions="tableData" /> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import edit from '@/components/Category/edit' |
||||
import editFrom from '../../../components/from/from' |
||||
import productApi from '@/api/product/productAttr.js' |
||||
import { loadingFn } from '@/utils/validate' |
||||
export default { |
||||
name: 'product_productClassify', |
||||
components: { |
||||
editFrom, |
||||
edit |
||||
}, |
||||
data() { |
||||
return { |
||||
editDialogConfig: { |
||||
visible: false |
||||
}, |
||||
treeSelect: [], |
||||
FromData: null, |
||||
grid: { |
||||
xl: 7, |
||||
lg: 7, |
||||
md: 12, |
||||
sm: 24, |
||||
xs: 24 |
||||
}, |
||||
loading: false, |
||||
artFrom: { |
||||
page: 1, |
||||
limit: 15 |
||||
}, |
||||
page: { |
||||
currentPage: 1, |
||||
pageSize: 10, |
||||
params: {}, |
||||
totalCount: 0 |
||||
}, |
||||
total: 0, |
||||
tableData: [] |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.getList() |
||||
}, |
||||
methods: { |
||||
handleCommand(e) {}, |
||||
handleSizeChange(val) { |
||||
this.page.pageSize = val |
||||
this.getList() |
||||
}, |
||||
handleCurrentChange(val) { |
||||
this.page.currentPage = val |
||||
this.getList() |
||||
}, |
||||
// 商品分类; |
||||
goodsCategory() {}, |
||||
// 列表 |
||||
getList() { |
||||
loadingFn.call( |
||||
this, |
||||
'loading', |
||||
productApi.classifyGetByPage(this.page).then(res => { |
||||
if ((res.code = 20000)) ({ list: this.tableData = [], totalCount: this.page.totalCount = 0 } = res.data) |
||||
}) |
||||
) |
||||
}, |
||||
pageChange(index) { |
||||
this.artFrom.page = index |
||||
this.getList() |
||||
}, |
||||
// 添加 |
||||
addClass(parent = null) { |
||||
this.editDialogConfig.visible = true |
||||
this.$refs.edit.model = 'classifySave' |
||||
// this.$nextTick(()=>{ |
||||
// this.$refs.edit.parent = parent; |
||||
// }); |
||||
if (parent) { |
||||
let { categoryName, id } = parent |
||||
this.$nextTick(() => { |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { parentCategoryName: categoryName, parentId: id, level: 2 }) |
||||
}) |
||||
} |
||||
}, |
||||
// 编辑 |
||||
edit(row) { |
||||
this.editDialogConfig.visible = true |
||||
this.$nextTick(() => { |
||||
let { level, icon, showFlag, categoryName, sort, parentId, id } = row |
||||
console.log(this.tableData.find(item => item == parentId), 'categoryName') |
||||
if (row.level == 1) { |
||||
this.$refs.edit.model = 'classifyUpdate' |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { level, icon, showFlag, categoryName, sort, parentId, id }) |
||||
} else { |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { |
||||
level, |
||||
icon, |
||||
showFlag, |
||||
parentCategoryName: this.tableData.find(item => item == parentId).categoryName, |
||||
categoryName, |
||||
sort, |
||||
parentId, |
||||
id |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
// 修改状态 |
||||
onchangeIsShow(row) { |
||||
let data = { |
||||
id: row.id, |
||||
is_show: row.is_show |
||||
} |
||||
setShowApi(data) |
||||
.then(async res => { |
||||
this.$message.success(res.msg) |
||||
}) |
||||
.catch(res => { |
||||
this.$message.error(res.msg) |
||||
}) |
||||
}, |
||||
|
||||
// 删除 |
||||
del(row, scope) { |
||||
console.log(scope) |
||||
this.$alert('请确定删除!', '提示', { |
||||
confirmButtonText: '确定', |
||||
callback: action => { |
||||
if (action == 'confirm') { |
||||
loadingFn.call( |
||||
this, |
||||
'loading', |
||||
productApi.classifyDelete(row).then(res => { |
||||
if ((res.code = 20000)) { |
||||
this.$message.success('操作成功!') |
||||
this.handleCurrentChange() |
||||
} |
||||
}) |
||||
) |
||||
} |
||||
} |
||||
}) |
||||
}, |
||||
// 表格搜索 |
||||
userSearchs() { |
||||
this.artFrom.page = 1 |
||||
this.getList() |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
<style scoped lang="stylus"> |
||||
.treeSel ::v-deep .ivu-select-dropdown-list { |
||||
padding: 0 10px !important; |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
.tabBox_img { |
||||
width: 36px; |
||||
height: 36px; |
||||
border-radius: 4px; |
||||
cursor: pointer; |
||||
|
||||
img { |
||||
width: 100%; |
||||
height: 100%; |
||||
|
||||
|
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,230 @@ |
||||
<template> |
||||
<div class="article-manager"> |
||||
<el-card :bordered="false" shadow="never" class="ivu-mt-16"> |
||||
<div> |
||||
<el-form ref="artFrom" :model="artFrom" label-width="80px" label-position="right" inline @submit.native.prevent> |
||||
<el-form-item label="商品名称:" label-for="pid"> |
||||
<el-input clearable placeholder="商品名称" v-model="artFrom.name" class="form_content_width" /> |
||||
</el-form-item> |
||||
<el-form-item label="推荐状态:" label-for="store_name"> |
||||
<el-select v-model="artFrom.type" placeholder="状态" clearable @keyup.enter.native="getByPage"> |
||||
<el-option label="是" value="0" /> |
||||
<el-option label="否" value="1" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-button type="primary" @click="userSearchs">查询</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
|
||||
<el-button type="primary" class="bnt" @click="addClass()">选择商品</el-button> |
||||
<el-table row-key="id" class="mt14" v-loading="loading" :data="tableData" empty-text="暂无数据"> |
||||
<el-table-column prop="categoryNum" label="编号"></el-table-column> |
||||
<el-table-column prop="categoryName" label="商品名称"></el-table-column> |
||||
|
||||
<el-table-column prop="showFlag" label="是否推荐"> |
||||
<template slot-scope="scope"> |
||||
<el-switch active-value="1" inactive-value="0" v-model="scope.row.showFlag" active-color="#13ce66" inactive-color="#ff4949"> </el-switch> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="date" label="操作" width="120" fixed="right"> |
||||
<template slot-scope="scope"> |
||||
<el-button type="text" @click="edit(scope.row)">置顶</el-button> |
||||
|
||||
<el-button @click="del(scope.row, scope)" type="text">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
</el-card> |
||||
<div class="acea-row row-right page"> |
||||
<el-pagination |
||||
@size-change="handleSizeChange" |
||||
@current-change="handleCurrentChange" |
||||
:current-page="page.currentPage" |
||||
:page-sizes="[10, 15, 20, 30]" |
||||
:page-size="page.pageSize" |
||||
layout="total, sizes, prev, pager, next, jumper" |
||||
:total="page.totalCount" |
||||
/> |
||||
</div> |
||||
|
||||
<!-- 添加 编辑表单--> |
||||
<edit-from ref="edits" :FromData="FromData" @submitFail="userSearchs"></edit-from> |
||||
<el-dialog title="添加分类" :visible.sync="editDialogConfig.visible" destroy-on-close :close-on-click-modal="false"> |
||||
<edit ref="edit" :parentOptions="tableData" /> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import edit from '@/components/Category/edit' |
||||
import editFrom from '../../../components/from/from' |
||||
import productApi from '@/api/product/productAttr.js' |
||||
import { loadingFn } from '@/utils/validate' |
||||
export default { |
||||
name: 'product_productClassify', |
||||
components: { |
||||
editFrom, |
||||
edit |
||||
}, |
||||
data() { |
||||
return { |
||||
editDialogConfig: { |
||||
visible: false |
||||
}, |
||||
treeSelect: [], |
||||
FromData: null, |
||||
grid: { |
||||
xl: 7, |
||||
lg: 7, |
||||
md: 12, |
||||
sm: 24, |
||||
xs: 24 |
||||
}, |
||||
loading: false, |
||||
artFrom: { |
||||
page: 1, |
||||
limit: 15 |
||||
}, |
||||
page: { |
||||
currentPage: 1, |
||||
pageSize: 10, |
||||
params: {}, |
||||
totalCount: 0 |
||||
}, |
||||
total: 0, |
||||
tableData: [] |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.getList() |
||||
}, |
||||
methods: { |
||||
handleCommand(e) {}, |
||||
handleSizeChange(val) { |
||||
this.page.pageSize = val |
||||
this.getList() |
||||
}, |
||||
handleCurrentChange(val) { |
||||
this.page.currentPage = val |
||||
this.getList() |
||||
}, |
||||
// 商品分类; |
||||
goodsCategory() {}, |
||||
// 列表 |
||||
getList() { |
||||
loadingFn.call( |
||||
this, |
||||
'loading', |
||||
productApi.classifyGetByPage(this.page).then(res => { |
||||
if ((res.code = 20000)) ({ list: this.tableData = [], totalCount: this.page.totalCount = 0 } = res.data) |
||||
}) |
||||
) |
||||
}, |
||||
pageChange(index) { |
||||
this.artFrom.page = index |
||||
this.getList() |
||||
}, |
||||
// 添加 |
||||
addClass(parent = null) { |
||||
this.editDialogConfig.visible = true |
||||
this.$refs.edit.model = 'classifySave' |
||||
// this.$nextTick(()=>{ |
||||
// this.$refs.edit.parent = parent; |
||||
// }); |
||||
if (parent) { |
||||
let { categoryName, id } = parent |
||||
this.$nextTick(() => { |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { parentCategoryName: categoryName, parentId: id, level: 2 }) |
||||
}) |
||||
} |
||||
}, |
||||
// 编辑 |
||||
edit(row) { |
||||
this.editDialogConfig.visible = true |
||||
this.$nextTick(() => { |
||||
let { level, icon, showFlag, categoryName, sort, parentId, id } = row |
||||
console.log(this.tableData.find(item => item == parentId), 'categoryName') |
||||
if (row.level == 1) { |
||||
this.$refs.edit.model = 'classifyUpdate' |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { level, icon, showFlag, categoryName, sort, parentId, id }) |
||||
} else { |
||||
this.$refs.edit.editPram = Object.assign(this.$refs.edit.editPram, { |
||||
level, |
||||
icon, |
||||
showFlag, |
||||
parentCategoryName: this.tableData.find(item => item == parentId).categoryName, |
||||
categoryName, |
||||
sort, |
||||
parentId, |
||||
id |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
// 修改状态 |
||||
onchangeIsShow(row) { |
||||
let data = { |
||||
id: row.id, |
||||
is_show: row.is_show |
||||
} |
||||
setShowApi(data) |
||||
.then(async res => { |
||||
this.$message.success(res.msg) |
||||
}) |
||||
.catch(res => { |
||||
this.$message.error(res.msg) |
||||
}) |
||||
}, |
||||
|
||||
// 删除 |
||||
del(row, scope) { |
||||
console.log(scope) |
||||
this.$alert('请确定删除!', '提示', { |
||||
confirmButtonText: '确定', |
||||
callback: action => { |
||||
if (action == 'confirm') { |
||||
loadingFn.call( |
||||
this, |
||||
'loading', |
||||
productApi.classifyDelete(row).then(res => { |
||||
if ((res.code = 20000)) { |
||||
this.$message.success('操作成功!') |
||||
this.handleCurrentChange() |
||||
} |
||||
}) |
||||
) |
||||
} |
||||
} |
||||
}) |
||||
}, |
||||
// 表格搜索 |
||||
userSearchs() { |
||||
this.artFrom.page = 1 |
||||
this.getList() |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
<style scoped lang="stylus"> |
||||
.treeSel ::v-deep .ivu-select-dropdown-list { |
||||
padding: 0 10px !important; |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
.tabBox_img { |
||||
width: 36px; |
||||
height: 36px; |
||||
border-radius: 4px; |
||||
cursor: pointer; |
||||
|
||||
img { |
||||
width: 100%; |
||||
height: 100%; |
||||
|
||||
|
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,8 @@ |
||||
<template> |
||||
<div> |
||||
<router-view /> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
export default {} |
||||
</script> |
Loading…
Reference in new issue