9 changed files with 1678 additions and 8 deletions
@ -0,0 +1,116 @@ |
|||
|
|||
import request from '@/plugins/request'; |
|||
|
|||
|
|||
|
|||
/** |
|||
* @description 文章列表 发布、上、下架 |
|||
* @param {Object} param data {Object} 传值参数 |
|||
*/ |
|||
export function setRelease (data) { |
|||
return request({ |
|||
url: 'cms/setRelease', |
|||
method: 'post', |
|||
params: data |
|||
}); |
|||
} |
|||
|
|||
export function setStatus (data) { |
|||
return request({ |
|||
url: 'cms/setStatus', |
|||
method: 'post', |
|||
data |
|||
}); |
|||
} |
|||
|
|||
/** |
|||
* @description 文章管理--列表 |
|||
* @param {Object} param data {Object} 传值参数 |
|||
*/ |
|||
export function cmsListApi (data) { |
|||
return request({ |
|||
url: 'cms/cms', |
|||
method: 'get', |
|||
params: data |
|||
}); |
|||
} |
|||
|
|||
/** |
|||
* @description 文章管理--新增编辑 |
|||
* @param {Object} param data {Object} 传值参数 |
|||
*/ |
|||
export function cmsAddApi (data) { |
|||
return request({ |
|||
url: 'cms/cms', |
|||
method: 'post', |
|||
data |
|||
}); |
|||
} |
|||
|
|||
/** |
|||
* @description 文章管理--文章详情 |
|||
* @param {Number} param id {Number} 文章id |
|||
*/ |
|||
export function createApi (id) { |
|||
return request({ |
|||
url: `cms/cms/${id}`, |
|||
method: 'get' |
|||
}); |
|||
} |
|||
|
|||
/** |
|||
* @description 文章分类--新增表单 |
|||
*/ |
|||
export function categoryAddApi () { |
|||
return request({ |
|||
url: `cms/category/create`, |
|||
method: 'GET' |
|||
}); |
|||
} |
|||
|
|||
/** |
|||
* @description 文章分类--列表 |
|||
* @param {Object} param params {Object} 传值 |
|||
*/ |
|||
export function categoryListApi (params) { |
|||
return request({ |
|||
url: `cms/category`, |
|||
method: 'GET', |
|||
params |
|||
}); |
|||
} |
|||
|
|||
/** |
|||
* @description 文章分类--编辑表单 |
|||
* @param {Number} param id {Number} 文章id |
|||
*/ |
|||
export function categoryEditApi (id) { |
|||
return request({ |
|||
url: `cms/category/${id}/edit`, |
|||
method: 'GET' |
|||
}); |
|||
} |
|||
|
|||
/** |
|||
* @description 文章分类--修改状态 |
|||
* @param {Object} param data {Object} 传值 |
|||
*/ |
|||
export function statusApi (data) { |
|||
return request({ |
|||
url: `cms/category/set_status/${data.id}/${data.status}`, |
|||
method: 'put' |
|||
}); |
|||
} |
|||
|
|||
/** |
|||
* @description 文章分类--关联商品 |
|||
* @param {Number} param id {Number} 文章id |
|||
* @param {Object} param data {Object} 传值 |
|||
*/ |
|||
export function relationApi (data, id) { |
|||
return request({ |
|||
url: `cms/cms/relation/${id}`, |
|||
method: 'put', |
|||
data |
|||
}); |
|||
} |
@ -0,0 +1,729 @@ |
|||
<template> |
|||
<div class="article-manager"> |
|||
<Card |
|||
:bordered="false" |
|||
dis-hover |
|||
class="ivu-mt" |
|||
> |
|||
|
|||
<PageHeader |
|||
style="padding: 10px 0; margin-bottom: 20px;" |
|||
hidden-breadcrumb |
|||
> |
|||
<div slot="title"> |
|||
<router-link :to="{ path: '/store/article/index' }"><Button |
|||
icon="ios-arrow-back" |
|||
size="small" |
|||
class="mr20" |
|||
>返回</Button></router-link> |
|||
<span |
|||
v-text="$route.params.id > 0 ? '编辑文章' : '添加文章'" |
|||
class="mr20" |
|||
></span> |
|||
</div> |
|||
</PageHeader> |
|||
|
|||
<Form |
|||
class="form" |
|||
ref="formValidate" |
|||
:model="formValidate" |
|||
:rules="ruleValidate" |
|||
:label-width="labelWidth" |
|||
:label-position="labelPosition" |
|||
@submit.native.prevent |
|||
> |
|||
<div class="goodsTitle acea-row"> |
|||
<div class="title">文章信息</div> |
|||
</div> |
|||
<Row |
|||
> |
|||
<Col |
|||
span='24' |
|||
v-bind="grid" |
|||
class="mr50" |
|||
> |
|||
<FormItem |
|||
label="标题:" |
|||
prop="title" |
|||
label-for="title" |
|||
> |
|||
<Input |
|||
v-model="formValidate.title" |
|||
placeholder="请输入" |
|||
maxlength="20" |
|||
element-id="title" |
|||
style="width:400px" |
|||
/> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
|
|||
<Row> |
|||
<Col v-bind="grid" class="mr50"> |
|||
<FormItem label="文章分类:" label-for="cid" prop="cid"> |
|||
<Select v-model="formValidate.cid" style="width:400px" > |
|||
<Option v-for="item in treeData" :value="item.id" :key="item.id">{{ item.title }}</Option> |
|||
</Select> |
|||
|
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
|
|||
<Row > |
|||
<Col class="mr50"> |
|||
<FormItem label="关联内容:"> |
|||
<Row :class="{'mb10':!(formValidate.relate.length==index+1)}" v-for="(item,index) in formValidate.relate" :key="index"> |
|||
<Select |
|||
@on-change="selectType" |
|||
placeholder="请选择关联类型" |
|||
v-model="formValidate.relate[index].type" |
|||
style="width:150px;margin-right: 10px;" > |
|||
<Option :value="1">首发活动</Option> |
|||
<Option :value="2">合成活动</Option> |
|||
<Option :value="3">流转市场(藏品)</Option> |
|||
<Option :value="4">流转市场(盲盒)</Option> |
|||
</Select> |
|||
|
|||
<template v-if="formValidate.relate[index].type==1"> |
|||
<Select ref="select_1" filterable @on-select="itemSelect($event,index)" :disabled='!formValidate.relate[index].type' placeholder="请搜索或选择关联的活动" v-model.lazy="formValidate.relate[index].active_id" style="width:240px" > |
|||
<Option v-for="item in activeList" :value="item.id" :key="item.id" :label="item.title">{{`${item.title}(${item.active_type==4? '秒杀活动':item.active_type==2? '盲拍活动':'抽签活动' })`}}</Option> |
|||
</Select> |
|||
</template> |
|||
|
|||
<template v-else-if="formValidate.relate[index].type==2"> |
|||
<Select filterable @on-select="itemSelect($event,index)" :disabled='!formValidate.relate[index].type' placeholder="请搜索或选择关联的活动" v-model.lazy="formValidate.relate[index].merge_id" style="width:240px" > |
|||
<Option v-for="item in mergeList" :value="item.id" :key="item.id">{{ item.title }}</Option> |
|||
</Select> |
|||
</template> |
|||
|
|||
<template v-else-if="formValidate.relate[index].type==3"> |
|||
<Select filterable @on-select="itemSelect($event,index)" :disabled='!formValidate.relate[index].type' placeholder="请搜索或选择关联的活动" v-model="formValidate.relate[index].goods_id" style="width:240px" > |
|||
<Option v-for="item in goodsList" :value="item.id" :key="item.id">{{ item.title }}</Option> |
|||
</Select> |
|||
</template> |
|||
|
|||
<template v-else-if="formValidate.relate[index].type==4"> |
|||
<Select filterable @on-select="itemSelect($event,index)" :disabled='!formValidate.relate[index].type' placeholder="请搜索或选择关联的活动" v-model.lazy="formValidate.relate[index].box_id" style="width:240px" > |
|||
<Option v-for="item in boxList" :value="item.id" :key="item.id">{{ item.title }}</Option> |
|||
</Select> |
|||
</template> |
|||
|
|||
<template v-else> |
|||
<Select :disabled='!formValidate.relate[index].type' placeholder="请搜索或选择关联的活动" v-model="formValidate.relate[index].goods_id" style="width:240px" > |
|||
<Option v-for="item in goodsList" :value="item.id" :key="item.id">{{ item.title }}</Option> |
|||
</Select> |
|||
</template> |
|||
|
|||
<a @click="RelateFn('del',index)" v-if="formValidate.relate.length>1" style="color: red; margin-left: 8px;">删除</a> |
|||
<a @click="RelateFn('add',index)" v-if="formValidate.relate.length==index+1" style="margin-left: 8px;">添加</a> |
|||
<a @click="RelateFn('clear',index)" v-if="index==0" style="margin-left: 8px;">清空</a> |
|||
</Row> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
|
|||
<Row > |
|||
<Col class="mr50"> |
|||
<FormItem label="推送时间:"> |
|||
<RadioGroup v-model="formValidate.send_type"> |
|||
<Radio :label="1">立即推送</Radio> |
|||
<Radio :label="2">定时推送</Radio> |
|||
</RadioGroup> |
|||
<DatePicker |
|||
v-model="formValidate.send_time" |
|||
v-if="formValidate.send_type==2" |
|||
type="datetime" |
|||
format="yyyy-MM-dd HH:mm:ss" |
|||
placeholder="请选择推送时间" |
|||
style="width: 200px;margin-left: 15px;" /> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
|
|||
<Row > |
|||
<Col class="mr50"> |
|||
<FormItem label="微信通知:"> |
|||
<RadioGroup v-model="formValidate.open_wechat_msg"> |
|||
<Radio :label="1">开</Radio> |
|||
<Radio :label="0">关</Radio> |
|||
</RadioGroup> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
|
|||
<Row > |
|||
<FormItem label="状态:" > |
|||
<Switch |
|||
:true-value="1" |
|||
:false-value="0" |
|||
v-model="formValidate.status" |
|||
size="large" |
|||
> |
|||
<template #open> |
|||
<span>上架</span> |
|||
</template> |
|||
<template #close> |
|||
<span>下架</span> |
|||
</template> |
|||
</Switch> |
|||
</FormItem> |
|||
</Row> |
|||
<Col |
|||
v-bind="grid" |
|||
class="mr50" |
|||
> |
|||
<FormItem |
|||
label="图文封面:" |
|||
> |
|||
<div |
|||
class="picBox" |
|||
@click="modalPicTap('单选')" |
|||
> |
|||
<div |
|||
class="pictrue" |
|||
v-if="formValidate.image_input" |
|||
><img :src="formValidate.image_input"></div> |
|||
<div |
|||
class="upLoad acea-row row-center-wrapper" |
|||
v-else |
|||
> |
|||
<Icon |
|||
type="ios-camera-outline" |
|||
size="26" |
|||
class="iconfont" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</FormItem> |
|||
</Col> |
|||
|
|||
<Row> |
|||
<Col |
|||
span="12" |
|||
class="mr50" |
|||
> |
|||
<FormItem |
|||
label="文章简介:" |
|||
prop="synopsis" |
|||
label-for="synopsis" |
|||
> |
|||
<Input |
|||
v-model="formValidate.synopsis" |
|||
type="textarea" |
|||
placeholder="请输入简介..." |
|||
style="width: 90%" |
|||
:rows="5" |
|||
/> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<div class="goodsTitle acea-row"> |
|||
<div class="title">文章内容</div> |
|||
</div> |
|||
<FormItem |
|||
label="文章内容:" |
|||
prop="content" |
|||
> |
|||
<vue-ueditor-wrap |
|||
v-model="formValidate.content" |
|||
@beforeInit="addCustomDialog" |
|||
:config="myConfig" |
|||
style="width: 90%;" |
|||
></vue-ueditor-wrap> |
|||
</FormItem> |
|||
|
|||
<Row |
|||
span='24' |
|||
style="justify-content: center;" |
|||
> |
|||
<Button |
|||
type="primary" |
|||
class="submission" |
|||
@click="onsubmit('formValidate')" |
|||
>提交</Button> |
|||
</Row> |
|||
</Form> |
|||
<Modal |
|||
v-model="modalPic" |
|||
width="950px" |
|||
scrollable |
|||
footer-hide |
|||
closable |
|||
title='上传商品图' |
|||
:mask-closable="false" |
|||
:z-index="1" |
|||
> |
|||
<uploadPictures |
|||
:isChoice="isChoice" |
|||
@getPic="getPic" |
|||
:gridBtn="gridBtn" |
|||
:gridPic="gridPic" |
|||
v-if="modalPic" |
|||
></uploadPictures> |
|||
</Modal> |
|||
<Spin fix v-show="spin"></Spin> |
|||
</Card> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState, mapActions } from 'vuex'; |
|||
import uploadPictures from '@/components/uploadPictures'; |
|||
import VueUeditorWrap from 'vue-ueditor-wrap'; |
|||
import { cmsAddApi, createApi, categoryListApi } from '@/api/cms'; |
|||
import {getList} from '@/api/merge' |
|||
import {getGoodsActiveList,getGoodsList} from '@/api/duandian/digitalStorage' |
|||
import {getBoxList} from "@/api/duandian/sell"; |
|||
export default { |
|||
name: 'addArticle', |
|||
components: { uploadPictures, VueUeditorWrap }, |
|||
data () { |
|||
const validateUpload = (rule, value, callback) => { |
|||
if (this.formValidate.image_input) { |
|||
callback() |
|||
} else { |
|||
callback(new Error('请上传图文封面')) |
|||
} |
|||
} |
|||
const validateUpload2 = (rule, value, callback) => { |
|||
if (!this.formValidate.cid) { |
|||
callback(new Error('请选择文章分类')) |
|||
} else { |
|||
callback() |
|||
} |
|||
} |
|||
return { |
|||
spin:false, |
|||
activeList:[],//首发活动列表 |
|||
mergeList:[],//合成活动列表 |
|||
goodsList:[],//流转市场藏品列表 |
|||
boxList:[],//流转市场盲盒列表 |
|||
dialog: {}, |
|||
isChoice: '单选', |
|||
grid: { |
|||
xl: 8, |
|||
lg: 8, |
|||
md: 12, |
|||
sm: 24, |
|||
xs: 24 |
|||
}, |
|||
gridPic: { |
|||
xl: 6, |
|||
lg: 8, |
|||
md: 12, |
|||
sm: 12, |
|||
xs: 12 |
|||
}, |
|||
gridBtn: { |
|||
xl: 4, |
|||
lg: 8, |
|||
md: 8, |
|||
sm: 8, |
|||
xs: 8 |
|||
}, |
|||
loading: false, |
|||
formValidate: { |
|||
id: 0, |
|||
title: '', |
|||
author: '', |
|||
image_input: '', |
|||
content: '', |
|||
synopsis: '', |
|||
url: '', |
|||
is_hot: 0, |
|||
is_banner: 0, |
|||
cid: '', |
|||
visit: 0, |
|||
status:1, |
|||
open_wechat_msg:1, |
|||
send_type:1, |
|||
formValidate:'', |
|||
relate:[ |
|||
{ |
|||
title:'', |
|||
type:'', |
|||
merge_id:'', |
|||
goods_id:'', |
|||
box_id:'', |
|||
active_id:'', |
|||
type:'', |
|||
} |
|||
] |
|||
}, |
|||
ruleValidate: { |
|||
title: [ |
|||
{ required: true, message: '请输入标题', trigger: 'blur' } |
|||
], |
|||
// author: [ |
|||
// { required: true, message: '请输入作者', trigger: 'blur' } |
|||
// ], |
|||
cid: [ |
|||
{ required: true, validator: validateUpload2, trigger: 'change', type: 'number' } |
|||
], |
|||
image_input: [ |
|||
{ required: true, validator: validateUpload, trigger: 'change' } |
|||
], |
|||
content: [ |
|||
{ required: true, message: '请输入文章内容', trigger: 'change' } |
|||
] |
|||
}, |
|||
value: '', |
|||
modalPic: false, |
|||
template: false, |
|||
treeData: [], |
|||
formValidate2: { |
|||
type: 1 |
|||
}, |
|||
myConfig: { |
|||
autoHeightEnabled: false, // 编辑器不自动被内容撑高 |
|||
initialFrameHeight: 500, // 初始容器高度 |
|||
initialFrameWidth: '100%', // 初始容器宽度 |
|||
UEDITOR_HOME_URL: '/store/UEditor/', |
|||
serverUrl: '' |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapState('admin/layout', [ |
|||
'isMobile' |
|||
]), |
|||
labelWidth () { |
|||
return this.isMobile ? undefined : 120; |
|||
}, |
|||
labelPosition () { |
|||
return this.isMobile ? 'top' : 'right'; |
|||
} |
|||
}, |
|||
watch: { |
|||
$route (to, from) { |
|||
if (this.$route.params.id) { |
|||
this.getDetails() |
|||
} else { |
|||
this.formValidate = { |
|||
id: 0, |
|||
title: '', |
|||
author: '', |
|||
image_input: '', |
|||
content: '', |
|||
synopsis: '', |
|||
url: '', |
|||
is_hot: 0, |
|||
is_banner: 0 |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
itemSelect(e,index){ |
|||
this.$set(this.formValidate.relate[index],'title',e.label); |
|||
}, |
|||
selectType(e){ |
|||
if(!e) return; |
|||
// this.spin=true; |
|||
// // 首发活动列表 |
|||
// if(e==1){ |
|||
// if(this.activeList.length==0) { |
|||
|
|||
// this.spin=false; |
|||
// } |
|||
// this.spin=false; |
|||
|
|||
// } |
|||
// // 合成活动列表 |
|||
// else if(e==2){ |
|||
// if(this.mergeList.length==0) { |
|||
|
|||
// } |
|||
// this.spin=false; |
|||
|
|||
// } |
|||
// // 藏品列表 |
|||
// else if(e==3) { |
|||
// if(this.goodsList.length==0) { |
|||
|
|||
// } |
|||
// } |
|||
// // 盲盒列表 |
|||
// else if(e==4) { |
|||
// if(this.boxList.length==0) { |
|||
|
|||
// } |
|||
// } |
|||
}, |
|||
RelateFn(value,index){ |
|||
console.log(value,index); |
|||
if(value=='add') { |
|||
console.log(this.formValidate.relate[index]); |
|||
if(!this.formValidate.relate[index].merge_id && !this.formValidate.relate[index].active_id && !this.formValidate.relate[index].goods_id&& !this.formValidate.relate[index].box_id) return this.$Message.error('请完善改行数据再添加') |
|||
this.formValidate.relate.push({ |
|||
type:'', |
|||
merge_id:0, |
|||
goods_id:0, |
|||
active_id:0, |
|||
box_id:0, |
|||
}) |
|||
} else if(value=='clear'){ |
|||
this.$set(this.formValidate,'relate',[]); |
|||
const item ={ |
|||
type:'', |
|||
merge_id:0, |
|||
goods_id:0, |
|||
active_id:0, |
|||
box_id:0, |
|||
} |
|||
this.$set(this.formValidate.relate,index,item); |
|||
setTimeout(res=>{ |
|||
this.$set(this.formValidate.relate[index],'goods_id',0); |
|||
},200) |
|||
} |
|||
else { |
|||
this.formValidate.relate.splice(index,1) |
|||
} |
|||
}, |
|||
...mapActions('admin/page', [ |
|||
'close' |
|||
]), |
|||
// getContent (val) { |
|||
// this.formValidate.content = val.content; |
|||
// }, |
|||
// 选择图片 |
|||
modalPicTap () { |
|||
this.modalPic = true |
|||
}, |
|||
// 选中图片 |
|||
getPic (pc) { |
|||
this.formValidate.image_input = pc.att_dir; |
|||
this.modalPic = false; |
|||
}, |
|||
// 分类 |
|||
getClass () { |
|||
categoryListApi(this.formValidate2).then(async res => { |
|||
this.treeData = res.data; |
|||
}).catch(res => { |
|||
this.$Message.error(res.msg); |
|||
}) |
|||
}, |
|||
//获取下拉列表活动 |
|||
getSelectData(){ |
|||
getGoodsActiveList({page:1,limit:999,is_show:1,active_type:''}).then(res=>{ |
|||
this.activeList=res.data.data; |
|||
}) |
|||
getList({status:[3,4,5],page:1,limit:999}).then(res=>{ |
|||
this.mergeList=[...res.data.data]; |
|||
this.spin=false; |
|||
}) |
|||
getGoodsList({page:1,limit:999,status:1}).then(res=>{ |
|||
this.goodsList=[...res.data.data]; |
|||
this.spin=false; |
|||
}) |
|||
getBoxList({page:1,limit:999,status:2}).then(res=>{ |
|||
this.boxList=[...res.data.data]; |
|||
this.spin=false; |
|||
}) |
|||
}, |
|||
// 提交数据 |
|||
onsubmit (name) { |
|||
const type =this.formValidate.relate[0].type; |
|||
this.$refs[name].validate((valid) => { |
|||
if (valid) { |
|||
if(this.formValidate.send_type==2 && this.formValidate.send_time=='') return this.$Message.error(`请选择定时推送时间`); |
|||
// if(!type) { |
|||
// this.formValidate.relate=[]; |
|||
// } |
|||
cmsAddApi(this.formValidate).then(async res => { |
|||
if(res.status != 200) return this.$Message.error(`${res.msg},不可修改`); |
|||
this.$Message.success('保存成功'); |
|||
setTimeout(() => { |
|||
this.$router.push({ path: '/store/article/index' }); |
|||
}, 500); |
|||
}).catch(res => { |
|||
this.$Message.error(res.msg); |
|||
}) |
|||
} else { |
|||
return false; |
|||
} |
|||
}) |
|||
}, |
|||
// 文章详情 |
|||
getDetails () { |
|||
createApi(this.$route.params.id ? this.$route.params.id : 0).then(async res => { |
|||
let data = res.data; |
|||
let news = data.info; |
|||
this.formValidate = { |
|||
id: news.id, |
|||
title: news.title, |
|||
author: news.author, |
|||
image_input: news.image_input, |
|||
content: news.content.content, |
|||
synopsis: news.synopsis, |
|||
status:news.status, |
|||
url: news.url, |
|||
is_hot: news.is_hot, |
|||
is_banner: news.is_banner, |
|||
cid: news.cid, |
|||
visit: news.visit, |
|||
relate:news.relate, |
|||
content:news.content.content, |
|||
send_type:news.send_type, |
|||
send_time:news.send_time, |
|||
open_wechat_msg:news.open_wechat_msg |
|||
} |
|||
if(this.formValidate.relate.length==0) { |
|||
this.formValidate.relate.push({ |
|||
type:'', |
|||
merge_id:'', |
|||
goods_id:'', |
|||
active_id:'', |
|||
type:'', |
|||
}) |
|||
} |
|||
}).catch(res => { |
|||
this.loading = false; |
|||
this.$Message.error(res.msg); |
|||
}) |
|||
}, |
|||
// 添加自定义弹窗 |
|||
addCustomDialog (editorId) { |
|||
window.UE.registerUI('test-dialog', function (editor, uiName) { |
|||
// 创建 dialog |
|||
let dialog = new window.UE.ui.Dialog({ |
|||
// 指定弹出层中页面的路径,这里只能支持页面,路径参考常见问题 2 |
|||
iframeUrl: '/admin/widget.images/index.html?fodder=dialog', |
|||
// 需要指定当前的编辑器实例 |
|||
editor: editor, |
|||
// 指定 dialog 的名字 |
|||
name: uiName, |
|||
// dialog 的标题 |
|||
title: '上传图片', |
|||
// 指定 dialog 的外围样式 |
|||
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 |
|||
dialog.render(); |
|||
dialog.open(); |
|||
} |
|||
}); |
|||
return btn; |
|||
}, 37); |
|||
window.UE.registerUI( |
|||
"video-dialog", |
|||
function (editor, uiName) { |
|||
let dialog = new window.UE.ui.Dialog({ |
|||
iframeUrl: "/admin/widget.video/index.html?fodder=video", |
|||
editor: editor, |
|||
name: uiName, |
|||
title: "上传视频", |
|||
cssRules: "width:1000px;height:500px;padding:20px;", |
|||
}); |
|||
this.dialog = dialog; |
|||
let btn = new window.UE.ui.Button({ |
|||
name: "video-button", |
|||
title: "上传视频", |
|||
cssRules: `background-image: url(../../../assets/images/icons.png);background-position: -320px -20px;`, |
|||
onclick: function () { |
|||
// 渲染dialog |
|||
dialog.render(); |
|||
dialog.open(); |
|||
}, |
|||
}); |
|||
return btn; |
|||
}, |
|||
38 |
|||
); |
|||
} |
|||
}, |
|||
mounted () { |
|||
if (this.$route.params.id) { |
|||
this.getDetails() |
|||
} |
|||
}, |
|||
created () { |
|||
this.getClass(); |
|||
this.getSelectData(); |
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
.picBox { |
|||
display: inline-block; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.form .goodsTitle { |
|||
border-bottom: 1px solid rgba(0, 0, 0, 0.09); |
|||
margin-bottom: 25px; |
|||
} |
|||
|
|||
.form .goodsTitle ~ .goodsTitle { |
|||
margin-top: 20px; |
|||
} |
|||
|
|||
.form .goodsTitle .title { |
|||
border-bottom: 2px solid #1890ff; |
|||
padding: 0 8px 12px 5px; |
|||
color: #000; |
|||
font-size: 14px; |
|||
} |
|||
|
|||
.form .goodsTitle .icons { |
|||
font-size: 15px; |
|||
margin-right: 8px; |
|||
color: #999; |
|||
} |
|||
|
|||
.form .add { |
|||
font-size: 12px; |
|||
color: #1890ff; |
|||
padding: 0 12px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.form .radio { |
|||
margin-right: 20px; |
|||
} |
|||
|
|||
.form .submission { |
|||
width: 10%; |
|||
margin-left: 27px; |
|||
} |
|||
|
|||
.form .upLoad { |
|||
width: 58px; |
|||
height: 58px; |
|||
line-height: 58px; |
|||
border: 1px dotted rgba(0, 0, 0, 0.1); |
|||
border-radius: 4px; |
|||
background: rgba(0, 0, 0, 0.02); |
|||
} |
|||
|
|||
.form .iconfont { |
|||
color: #898989; |
|||
} |
|||
|
|||
.form .pictrue { |
|||
width: 60px; |
|||
height: 60px; |
|||
border: 1px dotted rgba(0, 0, 0, 0.1); |
|||
margin-right: 10px; |
|||
} |
|||
|
|||
.form .pictrue img { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
|
|||
.Modals .address { |
|||
width: 90%; |
|||
} |
|||
|
|||
.Modals .address .iconfont { |
|||
font-size: 20px; |
|||
} |
|||
</style> |
|||
|
@ -0,0 +1,237 @@ |
|||
<template> |
|||
<div> |
|||
<Card :bordered="false" dis-hover class="ivu-mt"> |
|||
<Form ref="formValidate" :model="formValidate" :label-width="labelWidth" :label-position="labelPosition" @submit.native.prevent> |
|||
<Row type="flex" :gutter="24"> |
|||
<Col v-bind="grid"> |
|||
<FormItem label="是否显示:" label-for="status"> |
|||
<Select v-model="formValidate.status" placeholder="请选择" element-id="status" clearable @on-change="userSearchs"> |
|||
<Option value="all">全部</Option> |
|||
<Option value="1">显示</Option> |
|||
<Option value="0">不显示</Option> |
|||
</Select> |
|||
</FormItem> |
|||
</Col> |
|||
<Col v-bind="grid"> |
|||
<FormItem label="分类昵称:" prop="title" label-for="status2"> |
|||
<Input search enter-button placeholder="请输入分类昵称" v-model="formValidate.title" @on-search="userSearchs"/> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row type="flex"> |
|||
<Col v-bind="grid"> |
|||
<Button v-auth="['store-article-article_category']" type="primary" icon="md-add" @click="add">添加文章分类</Button> |
|||
</Col> |
|||
</Row> |
|||
</Form> |
|||
<Divider dashed/> |
|||
<vxe-table |
|||
class="vxeTable" |
|||
highlight-hover-row |
|||
:loading="loading" |
|||
header-row-class-name="false" |
|||
:tree-config="{children: 'children'}" |
|||
:data="categoryList"> |
|||
<vxe-table-column field="id" title="ID" tooltip width="80"></vxe-table-column> |
|||
<vxe-table-column field="title" title="分类昵称" min-width="130"></vxe-table-column> |
|||
<vxe-table-column field="image" title="分类图片" min-width="130"> |
|||
<template v-slot="{ row }"> |
|||
<viewer> |
|||
<div class="tabBox_img"> |
|||
<img v-lazy="row.image + $picSize(60)"> |
|||
</div> |
|||
</viewer> |
|||
</template> |
|||
</vxe-table-column> |
|||
<vxe-table-column field="status" title="状态" min-width="120"> |
|||
<template v-slot="{ row }"> |
|||
<i-switch v-model="row.status" :value="row.status" :true-value="1" :false-value="0" @on-change="onchangeIsShow(row)" size="large"> |
|||
<span slot="open">显示</span> |
|||
<span slot="close">隐藏</span> |
|||
</i-switch> |
|||
</template> |
|||
</vxe-table-column> |
|||
<vxe-table-column field="date" title="操作" align="center" width="250" fixed="right"> |
|||
<template v-slot="{ row }"> |
|||
<a @click="edit(row)">编辑</a> |
|||
<Divider type="vertical" /> |
|||
<a @click="del(row,'删除文章分类')">删除</a> |
|||
<Divider type="vertical" /> |
|||
<a @click="lookUp(row)">查看文章</a> |
|||
</template> |
|||
</vxe-table-column> |
|||
</vxe-table> |
|||
<!-- <div class="acea-row row-right page">--> |
|||
<!-- <Page :total="total" :current="formValidate.page" show-elevator show-total @on-change="pageChange"--> |
|||
<!-- :page-size="formValidate.limit"/>--> |
|||
<!-- </div>--> |
|||
</Card> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
import { mapState, mapMutations } from 'vuex'; |
|||
import { categoryAddApi, categoryEditApi, categoryListApi, statusApi } from '@/api/cms'; |
|||
export default { |
|||
name: 'articleCategory', |
|||
data () { |
|||
return { |
|||
grid: { |
|||
xl: 7, |
|||
lg: 7, |
|||
md: 12, |
|||
sm: 24, |
|||
xs: 24 |
|||
}, |
|||
loading: false, |
|||
formValidate: { |
|||
status: '', |
|||
page: 1, |
|||
limit: 20, |
|||
type: 0 |
|||
}, |
|||
total: 0, |
|||
columns1: [ |
|||
{ |
|||
title: 'ID', |
|||
key: 'id', |
|||
width: 80 |
|||
}, |
|||
{ |
|||
title: '分类昵称', |
|||
key: 'title', |
|||
minWidth: 130 |
|||
}, |
|||
{ |
|||
title: '分类图片', |
|||
slot: 'images', |
|||
minWidth: 130 |
|||
}, |
|||
{ |
|||
title: '状态', |
|||
slot: 'statuss', |
|||
minWidth: 130 |
|||
}, |
|||
{ |
|||
title: '操作', |
|||
slot: 'action', |
|||
fixed: 'right', |
|||
minWidth: 120 |
|||
} |
|||
], |
|||
FromData: null, |
|||
modalTitleSs: '', |
|||
categoryId: 0, |
|||
categoryList: [] |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapState('admin/layout', [ |
|||
'isMobile' |
|||
]), |
|||
labelWidth () { |
|||
return this.isMobile ? undefined : 75; |
|||
}, |
|||
labelPosition () { |
|||
return this.isMobile ? 'top' : 'right'; |
|||
} |
|||
}, |
|||
mounted () { |
|||
this.getList(); |
|||
}, |
|||
methods: { |
|||
...mapMutations('admin/userLevel', [ |
|||
'getCategoryId' |
|||
]), |
|||
// 添加 |
|||
add () { |
|||
this.$modalForm(categoryAddApi()).then(() => this.getList()); |
|||
// categoryAddApi().then(async res => { |
|||
// this.$refs.edits.modals = true; |
|||
// this.FromData = res.data; |
|||
// }).catch(res => { |
|||
// this.$Message.error(res.msg); |
|||
// }) |
|||
}, |
|||
// 编辑 |
|||
edit (row) { |
|||
this.$modalForm(categoryEditApi(row.id)).then(() => this.getList()); |
|||
// categoryEditApi(row.id).then(async res => { |
|||
// this.FromData = res.data; |
|||
// this.$refs.edits.modals = true; |
|||
// }).catch(res => { |
|||
// this.$Message.error(res.msg); |
|||
// }) |
|||
}, |
|||
// 删除 |
|||
del (row, tit) { |
|||
let delfromData = { |
|||
title: tit, |
|||
num: 0, |
|||
url: `cms/category/${row.id}`, |
|||
method: 'DELETE', |
|||
ids: '' |
|||
} |
|||
this.$modalSure(delfromData).then((res) => { |
|||
this.$Message.success(res.msg); |
|||
this.getList(); |
|||
}).catch(res => { |
|||
this.$Message.error(res.msg); |
|||
}); |
|||
}, |
|||
// 列表 |
|||
getList () { |
|||
this.loading = true; |
|||
categoryListApi(this.formValidate).then(async res => { |
|||
let data = res.data |
|||
this.categoryList = data.list; |
|||
this.total = data.count; |
|||
this.loading = false; |
|||
}).catch(res => { |
|||
this.loading = false; |
|||
this.$Message.error(res.msg); |
|||
}) |
|||
}, |
|||
pageChange (index) { |
|||
this.formValidate.page = index; |
|||
this.getList(); |
|||
}, |
|||
// 表格搜索 |
|||
userSearchs () { |
|||
this.formValidate.page = 1; |
|||
this.getList(); |
|||
}, |
|||
// 修改是否显示 |
|||
onchangeIsShow (row) { |
|||
let data = { |
|||
id: row.id, |
|||
status: row.status |
|||
} |
|||
statusApi(data).then(async res => { |
|||
this.$Message.success(res.msg); |
|||
}).catch(res => { |
|||
this.$Message.error(res.msg); |
|||
}) |
|||
}, |
|||
// 查看文章 |
|||
lookUp (row) { |
|||
this.$router.push({ path: '/store/article/index', |
|||
query: { |
|||
id: row.id |
|||
} }); |
|||
// xia mian chu cun mei yong; |
|||
this.getCategoryId(row.id) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="stylus"> |
|||
.tabBox_img |
|||
width 36px |
|||
height 36px |
|||
border-radius:4px |
|||
cursor pointer |
|||
img |
|||
width 100% |
|||
height 100% |
|||
</style> |
@ -0,0 +1,472 @@ |
|||
<template> |
|||
<div> |
|||
<Card |
|||
:bordered="false" |
|||
dis-hover |
|||
class="ivu-mt" |
|||
> |
|||
<Form |
|||
ref="artFrom" |
|||
:model="artFrom" |
|||
:label-width="labelWidth" |
|||
:label-position="labelPosition" |
|||
@submit.native.prevent |
|||
> |
|||
<Row |
|||
type="flex" |
|||
:gutter="24" |
|||
> |
|||
|
|||
<Col v-bind="grid"> |
|||
<FormItem |
|||
label="文章搜索:" |
|||
label-for="title" |
|||
> |
|||
<Input |
|||
search |
|||
enter-button |
|||
placeholder="请输入" |
|||
v-model="artFrom.title" |
|||
style="width:80%;" |
|||
@on-search="userSearchs" |
|||
/> |
|||
</FormItem> |
|||
</Col> |
|||
|
|||
<Col v-bind="grid"> |
|||
<FormItem label="状态:"> |
|||
|
|||
<Select v-model="artFrom.status" clearable style="width:250px" @on-change="handleCheckChange"> |
|||
<Option :value="1">已上架</Option> |
|||
<Option :value="0">未上架</Option> |
|||
</Select> |
|||
|
|||
</FormItem> |
|||
</Col> |
|||
|
|||
<Col v-bind="grid"> |
|||
<FormItem label="文章分类:"> |
|||
|
|||
<Select v-model="artFrom.pid" clearable style="width:250px" @on-change="handleCheckChange"> |
|||
<Option v-for="item in treeData" :value="item.id" :key="item.value">{{ item.title }}</Option> |
|||
</Select> |
|||
|
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
<Row type="flex"> |
|||
<Col v-bind="grid"> |
|||
<router-link |
|||
:to="'/store/article/add_article'" |
|||
v-auth="['store-article-index']" |
|||
><Button |
|||
type="primary" |
|||
class="bnt" |
|||
icon="md-add" |
|||
>添加文章</Button></router-link> |
|||
</Col> |
|||
</Row> |
|||
</Form> |
|||
<Table |
|||
:columns="columns1" |
|||
:data="cmsList" |
|||
ref="table" |
|||
class="mt25" |
|||
:loading="loading" |
|||
highlight-row |
|||
no-userFrom-text="暂无数据" |
|||
no-filtered-userFrom-text="暂无筛选结果" |
|||
> |
|||
|
|||
<template |
|||
slot-scope="{ row, index }" |
|||
slot="up_status" |
|||
> |
|||
<div> |
|||
<Switch |
|||
:true-value="1" |
|||
:false-value="0" |
|||
v-model="row.status" |
|||
size="large" |
|||
@on-change="isShow(row.id,row.status)" |
|||
> |
|||
<template #open> |
|||
<span>上架</span> |
|||
</template> |
|||
<template #close> |
|||
<span>下架</span> |
|||
</template> |
|||
</Switch> |
|||
</div> |
|||
</template> |
|||
|
|||
<template |
|||
slot-scope="{ row, index }" |
|||
slot="titles" |
|||
> |
|||
<span>{{ row.title}}</span> |
|||
</template> |
|||
<template |
|||
slot-scope="{ row, index }" |
|||
slot="image_inputs" |
|||
> |
|||
<!-- <viewer v-if="row.image_input.length!==0"> |
|||
<div class="tabBox_img" v-for="(item, index) in row.image_input" :key="index"> |
|||
<img v-lazy="item"> |
|||
</div> |
|||
</viewer> --> |
|||
<viewer> |
|||
<div class="tabBox_img"> |
|||
<img v-if="row.image_input" v-lazy="row.image_input + $picSize(60)"> |
|||
</div> |
|||
</viewer> |
|||
</template> |
|||
<template |
|||
slot-scope="{ row, index }" |
|||
slot="action" |
|||
> |
|||
<a @click="edit(row,'查看')">{{row.is_release==1? '查看':'编辑'}}</a> |
|||
<Divider type="vertical" /> |
|||
<!-- <a :class="{'dele' : row.is_release ==1}" @click="edit(row,'发布')">发布</a> |
|||
<Divider type="vertical" /> --> |
|||
<!-- <template> |
|||
<Divider type="vertical" /> |
|||
<a :class="{'dele' : row.is_release !=1}" v-if="row.status==1" @click="edit(row,'下架')">下架</a> |
|||
<a v-else @click="edit(row,'上架')">上架</a> |
|||
</template> --> |
|||
<a @click="del(row,'删除文章', index)">删除</a> |
|||
</template> |
|||
</Table> |
|||
<div class="acea-row row-right page"> |
|||
<Page |
|||
:total="total" |
|||
:current="artFrom.page" |
|||
show-elevator |
|||
show-total |
|||
@on-change="pageChange" |
|||
:page-size="artFrom.limit" |
|||
/> |
|||
</div> |
|||
</Card> |
|||
<!--关联--> |
|||
<Modal |
|||
v-model="modals" |
|||
title="商品列表" |
|||
footerHide |
|||
class="paymentFooter" |
|||
scrollable |
|||
width="900" |
|||
@on-cancel="cancel" |
|||
> |
|||
<goods-list |
|||
ref="goodslist" |
|||
@getProductId="getProductId" |
|||
v-if="modals" |
|||
></goods-list> |
|||
</Modal> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState } from 'vuex'; |
|||
import { cmsListApi, categoryListApi, relationApi,setStatus,setRelease} from '@/api/cms'; |
|||
import relationList from './relation'; |
|||
import { formatDate } from '@/utils/validate'; |
|||
import goodsList from '@/components/goodsList/index'; |
|||
export default { |
|||
name: 'addArticle', |
|||
data () { |
|||
return { |
|||
modalTitleSs: '', |
|||
currentTab: '', |
|||
grid: { |
|||
xl: 8, |
|||
lg: 8, |
|||
md: 12, |
|||
sm: 24, |
|||
xs: 24 |
|||
}, |
|||
loading: false, |
|||
artFrom: { |
|||
pid: 0, |
|||
title: '', |
|||
page: 1, |
|||
limit: 20, |
|||
status:'', |
|||
}, |
|||
total: 0, |
|||
columns1: [ |
|||
{ |
|||
title: 'ID', |
|||
key: 'id', |
|||
width: 80 |
|||
}, |
|||
// { |
|||
// title: '文章图片', |
|||
// slot: 'image_inputs', |
|||
// width: 130 |
|||
// }, |
|||
{ |
|||
title: '文章名称', |
|||
slot: 'titles', |
|||
minWidth: 130 |
|||
}, |
|||
{ |
|||
title: '分类', |
|||
key: 'catename', |
|||
minWidth: 130 |
|||
}, |
|||
// { |
|||
// title: '排序', |
|||
// key: 'sort', |
|||
// minWidth: 60 |
|||
// }, |
|||
{ |
|||
title: '状态', |
|||
slot: 'up_status', |
|||
minWidth: 80 |
|||
}, |
|||
{ |
|||
title: '浏览量', |
|||
key: 'visit', |
|||
minWidth: 80 |
|||
}, |
|||
{ |
|||
title: '时间', |
|||
key: 'add_time', |
|||
sortable: true, |
|||
render: (h, params) => { |
|||
return h('div', |
|||
formatDate(new Date(Number(params.row.add_time) * 1000), 'yyyy-MM-dd hh:mm') |
|||
) |
|||
}, |
|||
minWidth: 120 |
|||
}, |
|||
{ |
|||
title: '操作', |
|||
slot: 'action', |
|||
fixed: 'right', |
|||
minWidth: 120 |
|||
} |
|||
], |
|||
cmsList: [], |
|||
treeData: [], |
|||
list: [], |
|||
cid: 0, // 移动分类id |
|||
cmsId: 0, |
|||
formValidate: { |
|||
type: 1 |
|||
}, |
|||
rows: {}, |
|||
modal_loading: false, |
|||
modals: false |
|||
} |
|||
}, |
|||
components: { |
|||
relationList, |
|||
goodsList |
|||
}, |
|||
computed: { |
|||
...mapState('admin/layout', [ |
|||
'isMobile' |
|||
]), |
|||
labelWidth () { |
|||
return this.isMobile ? undefined : 75; |
|||
}, |
|||
labelPosition () { |
|||
return this.isMobile ? 'top' : 'right'; |
|||
} |
|||
}, |
|||
created () { |
|||
this.artFrom.pid = this.$route.query.id ? this.$route.query.id : 0; |
|||
this.getList(); |
|||
this.getClass(); |
|||
}, |
|||
methods: { |
|||
// 关联成功 |
|||
getProductId (row) { |
|||
let data = { |
|||
product_id: row.id |
|||
}; |
|||
relationApi(data, this.rows.id).then(async res => { |
|||
this.$Message.success(res.msg); |
|||
row.id = 0; |
|||
this.modal_loading = false; |
|||
this.modals = false; |
|||
setTimeout(() => { |
|||
this.getList(); |
|||
}, 500); |
|||
}).catch(res => { |
|||
this.modal_loading = false; |
|||
this.loading = false; |
|||
this.$Message.error(res.msg); |
|||
}) |
|||
}, |
|||
cancel () { |
|||
this.modals = false; |
|||
}, |
|||
// 等级列表 |
|||
getList () { |
|||
this.loading = true; |
|||
cmsListApi(this.artFrom).then(async res => { |
|||
let data = res.data |
|||
this.cmsList = data.list; |
|||
this.total = data.count; |
|||
this.loading = false; |
|||
}).catch(res => { |
|||
this.loading = false; |
|||
this.$Message.error(res.msg); |
|||
}) |
|||
}, |
|||
// 分类 |
|||
getClass () { |
|||
categoryListApi(this.formValidate).then(async res => { |
|||
let data = res.data |
|||
this.treeData = data; |
|||
let obj = { |
|||
id: 0, |
|||
title: '全部' |
|||
} |
|||
this.treeData.unshift(obj); |
|||
}).catch(res => { |
|||
this.$Message.error(res.msg); |
|||
}) |
|||
}, |
|||
pageChange (index) { |
|||
this.artFrom.page = index; |
|||
this.getList(); |
|||
}, |
|||
// 下拉树 |
|||
handleCheckChange (data) { |
|||
this.artFrom.page = 1; |
|||
this.getList(); |
|||
}, |
|||
isShow(id,status){ |
|||
setStatus({id,status}).then(res=>{ |
|||
if(res.status !=200) return this.$Message.error(res.msg); |
|||
this.$Message.success(res.msg); |
|||
this.getList(); |
|||
}) |
|||
}, |
|||
// 编辑 |
|||
async edit (row,value) { |
|||
|
|||
if(value=='查看') { |
|||
this.$router.push({ path: '/store/article/add_article/' + row.id }); |
|||
return |
|||
} |
|||
|
|||
if(value=='发布') { |
|||
this.$Modal.confirm({ |
|||
title: '温馨提示', |
|||
content: '<p>确定要发布该数据吗</p>', |
|||
onOk: () => { |
|||
setRelease({id:row.id}).then(res=>{ |
|||
if(res.status !=200) return this.$Message.error(res.msg); |
|||
this.$Message.success(res.msg); |
|||
this.getList(); |
|||
}) |
|||
}, |
|||
}); |
|||
} |
|||
|
|||
if(value=='上架') { |
|||
this.$Modal.confirm({ |
|||
title: '温馨提示', |
|||
content: '<p>确定要上架该数据吗</p>', |
|||
onOk: () => { |
|||
setStatus({id:row.id,status:1}).then(res=>{ |
|||
if(res.status !=200) return this.$Message.error(res.msg); |
|||
this.$Message.success(res.msg); |
|||
this.getList(); |
|||
}) |
|||
}, |
|||
}); |
|||
} |
|||
|
|||
if(value=='下架') { |
|||
this.$Modal.confirm({ |
|||
title: '温馨提示', |
|||
content: '<p>确定要下架该数据吗</p>', |
|||
onOk: () => { |
|||
setStatus({id:row.id,status:0}).then(res=>{ |
|||
if(res.status !=200) return this.$Message.error(res.msg); |
|||
this.$Message.success(res.msg); |
|||
this.getList(); |
|||
}) |
|||
}, |
|||
}); |
|||
} |
|||
console.log(row,value) |
|||
}, |
|||
// 关联 |
|||
artRelation (row, tit, num) { |
|||
this.rows = row; |
|||
if (row.product_id === 0) { |
|||
this.modals = true; |
|||
} else { |
|||
let delfromData = { |
|||
title: tit, |
|||
num: num, |
|||
url: `/cms/cms/unrelation/${row.id}`, |
|||
method: 'PUT', |
|||
ids: '' |
|||
} |
|||
this.$modalSure(delfromData).then((res) => { |
|||
this.$Message.success(res.msg); |
|||
this.getList() |
|||
}).catch(res => { |
|||
this.$Message.error(res.msg); |
|||
}); |
|||
} |
|||
}, |
|||
// 删除 |
|||
del (row, tit, num) { |
|||
let delfromData = { |
|||
title: tit, |
|||
num: num, |
|||
url: `cms/cms/${row.id}`, |
|||
method: 'DELETE', |
|||
ids: '' |
|||
}; |
|||
this.$modalSure(delfromData).then((res) => { |
|||
this.$Message.success(res.msg); |
|||
this.cmsList.splice(num, 1); |
|||
}).catch(res => { |
|||
this.$Message.error(res.msg); |
|||
}); |
|||
}, |
|||
// 表格搜索 |
|||
userSearchs () { |
|||
this.artFrom.page = 1; |
|||
this.getList(); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="stylus"> |
|||
.treeSel >>>.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%; |
|||
} |
|||
} |
|||
|
|||
.dele { |
|||
pointer-events:none; |
|||
color: #999; |
|||
} |
|||
|
|||
</style> |
|||
|
@ -0,0 +1,90 @@ |
|||
<template> |
|||
<Modal v-model="modals" scrollable footer-hide closable title="选择商品" :mask-closable="false" width="950" @on-cancel="handleReset"> |
|||
<Form ref="levelFrom" :model="levelFrom" :label-width="labelWidth" :label-position="labelPosition" @submit.native.prevent> |
|||
<Row type="flex" :gutter="24"> |
|||
<Col v-bind="grid"> |
|||
<FormItem label="商品名称:" prop="status2" label-for="status2"> |
|||
<Input search enter-button v-model="levelFrom.name" placeholder="请输入商品名称" @on-search="userSearchs" style="width: 100%"/> |
|||
</FormItem> |
|||
</Col> |
|||
</Row> |
|||
</Form> |
|||
<Divider dashed /> |
|||
<Table :columns="columns1" :data="levelLists" ref="table" |
|||
:loading="loading" |
|||
no-userFrom-text="暂无数据" |
|||
no-filtered-userFrom-text="暂无筛选结果"> |
|||
<template slot-scope="{ row, index }" slot="is_shows"> |
|||
<i-switch v-model="row.is_show" :value="row.is_show" :true-value="1" :false-value="0" size="large" @on-change="onchangeIsShow(row)"> |
|||
<span slot="open">显示</span> |
|||
<span slot="close">隐藏</span> |
|||
</i-switch> |
|||
</template> |
|||
<template slot-scope="{ row, index }" slot="is_musts"> |
|||
<i-switch v-model="row.is_must" :value="row.is_must" :true-value="1" :false-value="0" size="large" @on-change="onchangeIsMust(row)"> |
|||
<span slot="open">全部完成</span> |
|||
<span slot="close">达成其一</span> |
|||
</i-switch> |
|||
</template> |
|||
<template slot-scope="{ row, index }" slot="action"> |
|||
<a @click="edit(row)">编辑 | </a> |
|||
<a @click="del(row,'删除任务')"> 删除</a> |
|||
</template> |
|||
</Table> |
|||
<div class="acea-row row-right page"> |
|||
<Page :total="total" show-elevator show-total @on-change="pageChange" |
|||
:page-size="levelFrom.limit"/> |
|||
</div> |
|||
<!-- 新建 编辑表单--> |
|||
<edit-from ref="edits" :FromData="FromData" @submitFail="submitFail" :titleType="titleType"></edit-from> |
|||
</Modal> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'relation', |
|||
data () { |
|||
return { |
|||
modals: false, |
|||
grid: { |
|||
xl: 12, |
|||
lg: 12, |
|||
md: 12, |
|||
sm: 24, |
|||
xs: 24 |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
// 关闭模态框 |
|||
handleReset () { |
|||
this.modals = false; |
|||
}, |
|||
// 表格搜索 |
|||
userSearchs () { |
|||
this.getList(); |
|||
}, |
|||
// 任务列表 |
|||
getList () { |
|||
this.loading = true; |
|||
taskListApi(this.levelId, this.levelFrom).then(async res => { |
|||
let data = res.data |
|||
this.levelLists = data.list; |
|||
this.total = res.data.count; |
|||
this.loading = false; |
|||
}).catch(res => { |
|||
this.loading = false; |
|||
this.$Message.error(res.msg); |
|||
}) |
|||
}, |
|||
pageChange (index) { |
|||
this.levelFrom.page = index; |
|||
this.getList(); |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
|
|||
</style> |
Loading…
Reference in new issue