Skip to content

E
ElectricitySheep
Commit f9ee85a3 authored by 黄媛媛's avatar 黄媛媛
Browse files
Options

update

parent 20b39726
Hide whitespace changes
Inline Side-by-side
Showing with 931 additions and 31 deletions
src/components/CommodityMan/addGoodsClass.vue 0 → 100644
View file @ f9ee85a3
<template>
<div class="addGoodsClass usersList usersListEdit">
<div class="head-title">
<span @click="goUrl" class="blue point">分类</span> / 分类编辑
</div>
<div class="content">
<el-form style="width:50%" :model="userInfo" :rules="rules" ref="userInfo" label-width="120px">
<el-form-item label="选择分类级别" prop="Tier">
<el-radio :disabled="editState" v-model="userInfo.Tier" :label="1">一级分类</el-radio>
<div @click="SelectTier(2)" style="display:inline-block;margin-right:18px">
<el-radio :disabled="editState" v-model="userInfo.Tier" :label="2">二级分类</el-radio>
</div>
<div @click="SelectTier(3)" style="display:inline-block">
<el-radio :disabled="editState" v-model="userInfo.Tier" :label="3">三级分类</el-radio>
</div>
</el-form-item>
<el-form-item v-if="userInfo.Parent1Name && (userInfo.Tier==2 || userInfo.Tier==3)" label="一级分类">
<span>{{userInfo.Parent1Name}}</span>
<span @click="SelectTier(2)" v-if="userInfo.Tier==2" style="margin-left:10px" class="blue point">修改</span>
</el-form-item>
<el-form-item v-if="userInfo.Parent2Name && userInfo.Tier==3" label="二级分类">
<span>{{userInfo.Parent2Name}}</span>
<span @click="SelectTier(3)" style="margin-left:10px" class="blue point">修改</span>
</el-form-item>
<el-form-item label="分类名称" prop="Name">
<el-input v-model="userInfo.Name" size="small"></el-input>
</el-form-item>
<el-form-item class="commonLabel discount" label="排序" prop="Sort">
<el-tooltip class="item" effect="dark" content="排序值越小排序越靠前" placement="top-start">
<i class=" elzk el-tooltip el-icon-info"></i>
</el-tooltip>
<el-input type="number" min="1" size="small" placeholder="请输入" v-model="userInfo.Sort">
</el-input>
</el-form-item>
<el-form-item label="分类图标">
<el-tooltip class="item" effect="dark" content="建议尺寸200*200" placement="top">
<el-button @click="openChangeDig(1)" size="small">选择文件</el-button>
</el-tooltip>
<div class="app-gallery-item">
<el-button @click="userInfo.IconPath='',userInfo.Icon=''" v-if="userInfo.IconPath!=''" type="danger" icon="el-icon-close" circle></el-button>
<img style="width:100px;height:100px" :src="'http://viitto-1301420277.cos.ap-chengdu.myqcloud.com'+userInfo.IconPath" alt="">
</div>
</el-form-item>
<el-form-item class="commonLabel discount" label="分类大图">
<el-tooltip class="item" effect="dark" content="显示在分类页面" placement="top-start">
<i class="elzk el-tooltip el-icon-info"></i>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="建议尺寸702*212" placement="top">
<el-button @click="openChangeDig(2)" size="small">选择文件</el-button>
</el-tooltip>
<div class="app-gallery-item">
<el-button @click="userInfo.BigIconPath='',userInfo.BigIcon=''" v-if="userInfo.BigIconPath!=''" type="danger" icon="el-icon-close" circle></el-button>
<img style="width:100px;height:100px" :src="'http://viitto-1301420277.cos.ap-chengdu.myqcloud.com'+userInfo.BigIconPath" alt="">
</div>
<p class="blue f12">
<span @click="czjfDig=true,imgDig=1" class="point">查看图例</span>
</p>
</el-form-item>
<el-form-item class="commonLabel discount" label="分类广告图">
<el-tooltip class="item" effect="dark" content="小图标模式下显示" placement="top-start">
<i class="elzk el-tooltip el-icon-info"></i>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="建议尺寸500*184" placement="top">
<el-button @click="openChangeDig(3)" size="small">选择文件</el-button>
</el-tooltip>
<div class="app-gallery-item">
<el-button @click="userInfo.AdvertisingImagePath='',userInfo.AdvertisingImage=''" v-if="userInfo.AdvertisingImagePath!=''" size="mini" type="danger" icon="el-icon-close" circle></el-button>
<img style="width:100px;height:100px" :src="'http://viitto-1301420277.cos.ap-chengdu.myqcloud.com'+userInfo.AdvertisingImagePath" alt="">
</div>
<p class="blue f12">
<span @click="czjfDig=true,imgDig=2" class="point">查看图例</span>
</p>
</el-form-item>
<el-form-item label="分类广告链接">
<el-input v-model="userInfo.AdvertisingAddress" size="small" :disabled="true" placeholder="请输入">
<el-button slot="append">选择链接</el-button>
</el-input>
</el-form-item>
<el-form-item label="是否启用">
<el-switch
v-model="userInfo.Enabled"
active-color="#409EFF"
:active-value="1"
:inactive-value="0">
</el-switch>
</el-form-item>
<el-form-item label="是否显示">
<el-switch
v-model="userInfo.IsShow"
active-color="#409EFF"
:active-value="1"
:inactive-value="0">
</el-switch>
</el-form-item>
</el-form>
</div>
<div style="margin-top:20px">
<el-button size="small" type="primary" @click="Save('userInfo')">保存</el-button>
</div>
<!-- 查看图例 -->
<el-dialog title="查看" :visible.sync="czjfDig" width="600px">
<div class="center">
<img v-if="imgDig==1" style="width:280px" src="../../assets/img/userman/example-1.png" alt="">
<img v-if="imgDig==2" style="width:280px" src="../../assets/img/userman/example-2.png" alt="">
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" size="small" @click="czjfDig = false">我知道了</el-button>
</span>
</el-dialog>
<!-- 选择文件 -->
<el-dialog title="选择文件" :visible.sync="changeState" width="1240px">
<ChooseImg @SelectId="SelectId"></ChooseImg>
</el-dialog>
<!-- 分类弹窗 -->
<el-dialog :destroy-on-close="true" :title="titleDig" :visible.sync="tierDig" :width="tierWidth">
<div v-loading="loading">
<div style="margin-bottom:20px">
<div class="searchInput" style="width:250px">
<el-input style="display:inline-block;width:225px;height:30px"
placeholder="请输入搜索内容"
v-model="msg1.Name"
size="small"
clearable>
</el-input>
<span @click="getList" class="el-icon-search" style="color:#979dad;font-size:14px;position:relative;top:1px"></span>
</div>
</div>
<ul class="tierUl">
<li :class="active1==index ? 'SelectLi' :''" @click="SelectTier1(item,index)" v-for="(item,index) in tableData" :key="index">
<span>{{item.Name}}</span>
<span v-if="item.ChildList.length>0" style="float:right">
<i class="el-icon-arrow-right"></i>
</span>
</li>
<div v-show="tableData.length==0" class="empty-text">
暂无数据
</div>
</ul>
<ul v-if="userInfo.Tier==3" class="tierUl" style="margin-left:10px">
<li :class="active2==index ? 'SelectLi' :''" v-show="tableData2 && tableData2.ChildList" @click="SelectTier2(item,index)" v-for="(item,index) in tableData2.ChildList" :key="index">
<span>{{item.Name}}</span>
</li>
<div v-show="tableData2.ChildList && tableData2.ChildList.length==0" class="empty-text">
暂无数据
</div>
</ul>
<div style="text-align:right;margin-top:20px" slot="footer" class="dialog-footer">
<el-button size="small" @click="ExitTier">取消</el-button>
<el-button type="primary" size="small" @click="tierDig = false">我知道了</el-button>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import ChooseImg from "@/components/global/ChooseImg.vue";
export default {
components: {
ChooseImg
},
data() {
return {
tableData: [],
tableData2: [],
changeState:false,
imgDig:1,
czjfDig:false,
userInfo:{
Id:0,
Tier:1,
Name:'',
Sort:1,
ParentId:0,
Icon:'',
IconPath:'',
BigIcon:'',
BigIconPath:'',
AdvertisingImage:'',
AdvertisingImagePath:'',
AdvertisingAddress:'',
Enabled:1,
IsShow:1,
},
val:'',
value:'',
total:0,
rules: {
Name: [
{ required: true, message: '请填写分类名称', trigger: 'blur' }
],
Sort: [
{ required: true, message: '请填写排序', trigger: 'blur' }
],
},
UserId:'',
imgType:1,
editState:false,
titleDig:'选择归属的一级分类',
tierDig:false,
tierWidth:'31%',
msg1:{
Id:0,
Name:'',
Tier:0,
ParentId:0,
Enabled:1,
IsShow:1,
},
loading:false,
active1:-1,
active2:-1,
keepData:{},
};
},
created() {
if(this.$route.query.UserId){
this.UserId=this.$route.query.UserId;
this.getData()
this.editState=true;
}
this.getList();
},
methods: {
ExitTier(){
this.userInfo.ParentId=0;
this.userInfo.Parent1Name=this.keepData.Parent1Name;
this.userInfo.Parent2Name=this.keepData.Parent2Name;
this.tierDig =false;
},
SelectTier2(item,index){
this.active2=index;
this.userInfo.ParentId=this.tableData2.Id;
this.userInfo.Parent2Name=item.Name;
this.userInfo.Tier=3;
},
SelectTier1(item,index){
this.tableData2=this.tableData[index];
this.active1=index;
this.userInfo.ParentId=0;
this.userInfo.Parent1Name=item.Name;
this.userInfo.Tier=2;
},
SelectTier(num){
this.tierDig=true;
if(num==2){
this.titleDig='选择归属的一级分类';
this.tierWidth='20%'
}
if(num==3){
this.titleDig='选择归属的二级分类';
this.tierWidth='600px'
}
},
openChangeDig(val){
this.changeState=true;
this.imgType=val;
},
SelectId(msg){
if(this.imgType==1){
this.userInfo.Icon=msg.selectId;
this.userInfo.IconPath=msg.url;
}
if(this.imgType==2){
this.userInfo.BigIcon=msg.selectId;
this.userInfo.BigIconPath=msg.url;
}
if(this.imgType==3){
this.userInfo.AdvertisingImage=msg.selectId;
this.userInfo.AdvertisingImagePath=msg.url;
}
this.changeState=false;
},
Save(){
this.apipost("/api/product/SetProductCategoryInfo",this.userInfo, res => {
if(res.data.resultCode==1){
this.goUrl();
}else {
this.Error(res.data.message);
}
})
},
goUrl(){
this.$router.push({
name: 'goodsClassification',
query: {
blank: "y"
}
});
},
getList(){
this.loading=true;
this.apipost("/api/product/GetProductCategoryTreeList", this.msg1, res => {
this.loading=false;
if(res.data.resultCode==1){
let pageData=res.data.data;
this.tableData=pageData;
}
})
},
getData(){
this.apipost("/api/product/GetProductCategoryInfo",{CategoryId:this.UserId}, res => {
this.userInfo=res.data.data;
this.keepData=re.data.data;
})
},
},
mounted() {
}
};
</script>
<style>
.addGoodsClass .searchInput{
border: 1px solid #DCDFE6;
border-radius: 4px;
}
.addGoodsClass .searchInput .el-input__inner{
border:none;outline:none;
height: 30px;
line-height: 30px;
}
.addGoodsClass .searchInput{
line-height: normal;
display: inline-table;
width: 100%;
border-collapse: separate;
border-spacing: 0;
width:250px;
margin-right: 20px;
}
.addGoodsClass .tierUl .empty-text{
line-height: 60px;
color: #909399;
text-align: center;
border-bottom: 1px solid #EBEEF5;
}
.addGoodsClass .tierUl .SelectLi{
background-color: #ecf5ff!important;
}
.addGoodsClass .tierUl li:hover{
background-color: #F5F7FA;
}
.addGoodsClass .tierUl {
border: 1px solid #E3E3E3;
height: 250px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
width: 260px;
overflow-y: auto;
display: inline-block;
}
.addGoodsClass .tierUl li{
border-bottom: 1px solid #EBEEF5;
padding: 8px;
box-sizing: border-box;
}
li{
list-style: none;
}
.addGoodsClass .app-gallery-item .el-button{
position: absolute;
right: -8px;
top: -8px;
padding: 4px 4px!important;
}
.addGoodsClass .app-gallery-item{
width: 100px;
height: 100px;
border: 1px solid #e3e3e3;
border-radius: 2px;
margin-right: 10px;
margin-top: 10px;
position: relative;
}
.usersListEdit .tip {
margin-left: 10px;
display: inline-block;
height: 30px;
line-height: 30px;
color: #ff4544;
background-color: #FEF0F0;
padding: 0 20px;
border-radius: 5px;
}
.usersListEdit .app-image{
background-size: cover; background-position: center center; width: 80px; height: 80px; border-radius: 0%;
}
.addGoodsClass .setTable .el-table__body .cell{
display: flex;
align-items: center;
}
.addGoodsClass .discount .el-form-item__label{
padding-right: 30px;
}
.addGoodsClass .el-form-item .elzk{
position: absolute;
left: -25px;
top:12px;
}
.setMember .el-form-item{
position: relative;
}
.usersList .blue{
color:#409EFF;
}
.usersList .content{
background: #fff;
margin-top:10px;
padding: 20px;
box-sizing: border-box;
}
</style>
src/components/CommodityMan/goodsClassification.vue
View file @ f9ee85a3
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="head-title"> <div class="head-title">
分类列表 分类列表
<el-button style="float:right;margin-top: -5px;margin-left:20px;" size="small" type="primary">分类导出</el-button> <el-button style="float:right;margin-top: -5px;margin-left:20px;" size="small" type="primary">分类导出</el-button>
<el-button style="float:right;margin-top: -5px;" size="small" type="primary">批量导出</el-button> <el-button @click="goUrl" style="float:right;margin-top: -5px;" size="small" type="primary">添加分类</el-button>
</div> </div>
<div style="margin-top:10px;background:#fff;padding:20px"> <div style="margin-top:10px;background:#fff;padding:20px">
<el-tabs v-model="activeName" @tab-click="handleClick"> <el-tabs v-model="activeName" @tab-click="handleClick">
...@@ -55,7 +55,8 @@ ...@@ -55,7 +55,8 @@
</el-tooltip> </el-tooltip>
</el-col> </el-col>
<el-col :span="11" flex="cross:center"> <el-col :span="11" flex="cross:center">
<div class="app-image cat-icon" :style="{backgroundImage:'url(http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + item.IconPath + ')',backgroundSize:'cover'}"></div> <div v-if="item.IconPath==''" class="app-image cat-icon noIcon"></div>
<div v-else class="app-image cat-icon" :style="{backgroundImage:'url(http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + item.IconPath + ')',backgroundSize:'cover'}"></div>
<div class="cat-name-info"> <div class="cat-name-info">
<el-tooltip class="item" effect="dark" :content="item.Name" placement="top"> <el-tooltip class="item" effect="dark" :content="item.Name" placement="top">
<span>{{item.Name}}</span> <span>{{item.Name}}</span>
...@@ -65,10 +66,10 @@ ...@@ -65,10 +66,10 @@
<el-col :span="7"> <el-col :span="7">
<template v-if="!dragState"> <template v-if="!dragState">
<el-tooltip class="item" effect="dark" content="编辑" placement="top"> <el-tooltip class="item" effect="dark" content="编辑" placement="top">
<img style="margin-right:9px" src="../../assets/img/userman/edit.png" alt=""> <img @click="goUrl(item)" style="margin-right:9px" src="../../assets/img/userman/edit.png" alt="">
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="删除" placement="top"> <el-tooltip class="item" effect="dark" content="删除" placement="top">
<img src="../../assets/img/userman/del.png" alt=""> <img @click="Delete(item)" src="../../assets/img/userman/del.png" alt="">
</el-tooltip> </el-tooltip>
</template> </template>
</el-col> </el-col>
...@@ -89,10 +90,7 @@ ...@@ -89,10 +90,7 @@
:no-transition-on-drag="false" :no-transition-on-drag="false"
draggable= ".draggable" draggable= ".draggable"
> >
<!-- @change="change" <div @click="getChild2(index,item)" :class="{'draggable':dragState,'itemActive':activeIndex2==index}" v-for="(item,index) in tableData2" :key="item.Id">
@start="start"
@end="end" -->
<div @click="getChild2(index)" :class="{'draggable':dragState,'itemActive':activeIndex2==index}" v-for="(item,index) in tableData2" :key="item.Id">
<el-row style="padding:7px 0;height:50px;box-sizing:border-box"> <el-row style="padding:7px 0;height:50px;box-sizing:border-box">
<el-col :span="2" flex="main:center" style="padding-top:6px"> <el-col :span="2" flex="main:center" style="padding-top:6px">
<el-checkbox v-model="val"></el-checkbox> <el-checkbox v-model="val"></el-checkbox>
...@@ -103,7 +101,8 @@ ...@@ -103,7 +101,8 @@
</el-tooltip> </el-tooltip>
</el-col> </el-col>
<el-col :span="11" flex="cross:center"> <el-col :span="11" flex="cross:center">
<div class="app-image cat-icon" :style="{backgroundImage:'url(http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + item.IconPath + ')',backgroundSize:'cover'}"></div> <div v-if="item.IconPath==''" class="app-image cat-icon noIcon"></div>
<div v-else class="app-image cat-icon" :style="{backgroundImage:'url(http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + item.IconPath + ')',backgroundSize:'cover'}"></div>
<div class="cat-name-info"> <div class="cat-name-info">
<el-tooltip class="item" effect="dark" :content="item.Name" placement="top"> <el-tooltip class="item" effect="dark" :content="item.Name" placement="top">
<span>{{item.Name}}</span> <span>{{item.Name}}</span>
...@@ -113,10 +112,10 @@ ...@@ -113,10 +112,10 @@
<el-col :span="7"> <el-col :span="7">
<template v-if="!dragState"> <template v-if="!dragState">
<el-tooltip class="item" effect="dark" content="编辑" placement="top"> <el-tooltip class="item" effect="dark" content="编辑" placement="top">
<img style="margin-right:9px" src="../../assets/img/userman/edit.png" alt=""> <img @click="goUrl(item)" style="margin-right:9px" src="../../assets/img/userman/edit.png" alt="">
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="删除" placement="top"> <el-tooltip class="item" effect="dark" content="删除" placement="top">
<img src="../../assets/img/userman/del.png" alt=""> <img @click="Delete(item)" src="../../assets/img/userman/del.png" alt="">
</el-tooltip> </el-tooltip>
</template> </template>
</el-col> </el-col>
...@@ -142,10 +141,10 @@ ...@@ -142,10 +141,10 @@
<el-col :span="7"> <el-col :span="7">
<template v-if="!dragState"> <template v-if="!dragState">
<el-tooltip class="item" effect="dark" content="编辑" placement="top"> <el-tooltip class="item" effect="dark" content="编辑" placement="top">
<img style="margin-right:9px" src="../../assets/img/userman/edit.png" alt=""> <img @click="goUrl(item)" style="margin-right:9px" src="../../assets/img/userman/edit.png" alt="">
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="删除" placement="top"> <el-tooltip class="item" effect="dark" content="删除" placement="top">
<img src="../../assets/img/userman/del.png" alt=""> <img @click="Delete(item)" src="../../assets/img/userman/del.png" alt="">
</el-tooltip> </el-tooltip>
</template> </template>
...@@ -154,7 +153,50 @@ ...@@ -154,7 +153,50 @@
</draggable> </draggable>
</el-card> </el-card>
<el-card class="card-item-box" shadow="never"> <el-card class="card-item-box" shadow="never">
<div v-if="tableData3.length>0" slot="header" class="clearfix">
<el-checkbox v-model="val"></el-checkbox>
<span>三级分类</span>
</div>
<draggable v-if="tableData3.length>0"
class="syllable_ul"
element="ul"
:list="tableData2"
:options="{ animation:150}"
:no-transition-on-drag="false"
draggable= ".draggable"
>
<div @click="getChild3(index)" :class="{'draggable':dragState,'itemActive':activeIndex3==index}" v-for="(item,index) in tableData3" :key="item.Id">
<el-row style="padding:7px 0;height:50px;box-sizing:border-box">
<el-col :span="2" flex="main:center" style="padding-top:6px">
<el-checkbox v-model="val"></el-checkbox>
</el-col>
<el-col :span="4" style="padding-top:6px">
<el-tooltip class="item" effect="dark" :content="item.Id+''" placement="top">
<div class="cat-id">{{item.Id}}</div>
</el-tooltip>
</el-col>
<el-col :span="11" flex="cross:center">
<div v-if="item.IconPath==''" class="app-image cat-icon noIcon"></div>
<div v-else class="app-image cat-icon" :style="{backgroundImage:'url(http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + item.IconPath + ')',backgroundSize:'cover'}"></div>
<div class="cat-name-info">
<el-tooltip class="item" effect="dark" :content="item.Name" placement="top">
<span>{{item.Name}}</span>
</el-tooltip>
</div>
</el-col>
<el-col :span="7">
<template v-if="!dragState">
<el-tooltip class="item" effect="dark" content="编辑" placement="top">
<img @click="goUrl(item)" style="margin-right:9px" src="../../assets/img/userman/edit.png" alt="">
</el-tooltip>
<el-tooltip class="item" effect="dark" content="删除" placement="top">
<img @click="Delete(item)" src="../../assets/img/userman/del.png" alt="">
</el-tooltip>
</template>
</el-col>
</el-row>
</div>
</draggable>
</el-card> </el-card>
</div> </div>
</el-tab-pane> </el-tab-pane>
...@@ -163,34 +205,118 @@ ...@@ -163,34 +205,118 @@
<div flex="dir:left"> <div flex="dir:left">
<el-card shadow="never" class="transfer"> <el-card shadow="never" class="transfer">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<span>分类</span> <span @click="getnoChangeData(1)" :class="transChild1!='' ? 'blue' :''" class="point">分类</span>
<span v-if="transChild1!=''">/{{transChild1}}</span>
</div> </div>
<div class="cat-body"> <div class="cat-body">
<div class="searchInput" style="width:240px"> <div class="searchInput" style="width:240px">
<el-input style="display:inline-block;width:219px;height:30px" <el-input style="display:inline-block;width:219px;height:30px"
placeholder="请输入搜索内容" placeholder="请输入搜索内容"
v-model="Name" v-model="msg1.Name"
size="small" size="small"
clearable> clearable>
</el-input> </el-input>
<span @click="getSearch" class="el-icon-search" style="color:#979dad;font-size:14px;position:relative;top:1px"></span> <span @click="getList1(1)" class="el-icon-search" style="color:#979dad;font-size:14px;position:relative;top:1px"></span>
</div> </div>
<div v-for="item in 4" flex="dir:left box:first" style="width:100%;margin-top:10px"> <div v-for="(item,index) in transData1" :key="index" flex="dir:left box:first" style="width:100%;margin-top:16px">
<div class="app-ellipsis"> <div class="app-ellipsis">
<div class="vue-line-clamp" style="word-break: break-all; -webkit-line-clamp: 1;"> <div class="vue-line-clamp" style="word-break: break-all; -webkit-line-clamp: 1;">
<el-radio v-model="radio" label="1">备选项</el-radio> <el-radio @change="radioChange" v-model="transMsg.CategoryId" :label="item.Id">{{item.Name}}</el-radio>
</div> </div>
</div> </div>
<button type="button" class="el-button cat-next el-button--text"> <button @click="nextData(1,item)" v-if="item.ChildList.length>0" type="button" class="el-button cat-next el-button--text">
<i class="el-icon-arrow-right"></i>
</button>
</div>
</div>
</el-card>
<div flex="dir:left cross:center">
<el-button size="mini" class="middle" :type="transActive" icon="el-icon-arrow-right" circle></el-button>
</div>
<el-card shadow="never" class="transfer">
<div slot="header" class="clearfix">
<span @click="getnoChangeData(2)" :class="transChild2!='' ? 'blue' :''" class="point">分类</span>
<span v-if="transChild2!=''">/{{transChild2}}</span>
</div>
<div class="cat-body">
<div class="searchInput" style="width:240px">
<el-input style="display:inline-block;width:219px;height:30px"
placeholder="请输入搜索内容"
v-model="msg1.Name"
size="small"
clearable>
</el-input>
<span @click="getList1(2)" class="el-icon-search" style="color:#979dad;font-size:14px;position:relative;top:1px"></span>
</div>
<div v-for="(item,index) in transData2" :key="index" flex="dir:left box:first" style="width:100%;margin-top:16px">
<div class="app-ellipsis">
<div class="vue-line-clamp" style="word-break: break-all; -webkit-line-clamp: 1;">
<el-radio @change="radioChange" v-model="transMsg.ParentId" :label="item.Id">{{item.Name}}</el-radio>
</div>
</div>
<button @click="nextData(2,item)" v-if="item.ChildList.length>0" type="button" class="el-button cat-next el-button--text">
<i class="el-icon-arrow-right"></i> <i class="el-icon-arrow-right"></i>
</button> </button>
</div> </div>
</div> </div>
</el-card> </el-card>
</div> </div>
<el-button :loading="saveBtnLoad" @click="transClass" style="margin-top:10px" size="mini" type="primary">开始转移</el-button>
</div>
</el-tab-pane>
<el-tab-pane label="分类样式" name="third">
<div class="app-style">
<div flex="dir:left" class="tab-box">
<div @click="changeImg(typeList,1)" :class="changestyle.Type==1 ? 'active' : ''" class="btn">一级分类样式</div>
<div @click="changeImg(typeList2,2)" :class="changestyle.Type==2 ? 'active' : ''" class="btn">二级分类样式</div>
<div @click="changeImg(typeList3,3)" :class="changestyle.Type==3 ? 'active' : ''" class="btn">三级分类样式</div>
</div>
<div>
<div flex="dir:left">
<div :class="(styleData.Type!=changestyle.Type || changestyle.Style!=item.Style) ? 'hoverClass' :''" v-for="(item,index) in styleList" :key="index" flex="main:center">
<div flex="main:center" class="image-box" style="border: 1px solid rgb(242, 244, 245);"><div>
<div class="cat-style-model"></div>
<img :src="item.src"></div>
<div v-if="styleData.Type==changestyle.Type && changestyle.Style==item.Style" class="style-img active"></div>
<div @click="SelectStyle(item.Style)" class="text">
启用该样式
</div>
</div>
</div>
</div>
</div>
<div>
<div style="padding: 18px 20px;border-bottom: 1px solid #EBEEF5;box-sizing: border-box;">
显示设置
</div>
<el-form :model="changestyle" style="padding:0 30px;margin:20px 0" :rules="changestylerules" ref="changestyle" label-width="180px">
<el-form-item label="每个分类商品显示总数" prop="CategoryNum" class="is-required">
<el-tooltip class="item" effect="dark" content="每个分类板块显示的商品最大数(0~100)" placement="top"
style="position: absolute;left: -10px;top:10px">
<i class="el-tooltip el-icon-info"></i>
</el-tooltip>
<el-input v-model="changestyle.CategoryNum" style="width:393px;margin-left:15px" type="number" min="1" size="small" placeholder="请输入内容" class="input-with-select">
<el-button slot="append">个</el-button>
</el-input>
</el-form-item>
<el-form-item label="商品每行显示数量" prop="RowNum" class="is-required">
<el-tooltip class="item" effect="dark" content="默认首页显示" placement="top"
style="position: absolute;left: -10px;top:10px">
<i class="el-tooltip el-icon-info"></i>
</el-tooltip>
<el-select style="margin-left:15px" v-model="changestyle.RowNum" placeholder="请选择" size="small">
<el-option label="1" :value="1"> </el-option>
<el-option label="2" :value="2"> </el-option>
<el-option label="3" :value="3"> </el-option>
</el-select>
</el-form-item>
</el-form>
<el-button :loading="saveBtnLoad" @click="SaveStyle('changestyle')" style="margin-left: 10px;" size="small" type="primary">保存</el-button>
</div>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="分类样式" name="third">商品分类</el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
<!-- 商品分类搜索 --> <!-- 商品分类搜索 -->
...@@ -229,10 +355,10 @@ ...@@ -229,10 +355,10 @@
label="操作"> label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tooltip class="item" effect="dark" content="编辑" placement="top"> <el-tooltip class="item" effect="dark" content="编辑" placement="top">
<img style="margin-right:9px" src="../../assets/img/userman/edit.png" alt=""> <img @click="goUrl(scope.row)" style="margin-right:9px" src="../../assets/img/userman/edit.png" alt="">
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="删除" placement="top"> <el-tooltip class="item" effect="dark" content="删除" placement="top">
<img src="../../assets/img/userman/del.png" alt=""> <img @click="Delete(scope.row)" src="../../assets/img/userman/del.png" alt="">
</el-tooltip> </el-tooltip>
</template> </template>
</el-table-column> </el-table-column>
...@@ -250,10 +376,13 @@ export default { ...@@ -250,10 +376,13 @@ export default {
}, },
data(){ data(){
return{ return{
transChild1:'',
transChild2:'',
transActive:'',
loading:false, loading:false,
searchDig:false, searchDig:false,
val:'', val:'',
activeName:'second', activeName:'first',
dragState:false, dragState:false,
msg1:{ msg1:{
Id:0, Id:0,
...@@ -275,18 +404,240 @@ export default { ...@@ -275,18 +404,240 @@ export default {
}, },
tableData1:[], tableData1:[],
tableData2:[], tableData2:[],
tableData3:[],
activeIndex:0, activeIndex:0,
activeIndex2:-1, activeIndex2:-1,
activeIndex3:-1,
sortList:[], sortList:[],
saveBtnLoad:false, saveBtnLoad:false,
searchList:[], searchList:[],
Name:'', Name:'',
transMsg:{
CategoryId:-1,
ParentId:-1,
},
transData1:[],
transData2:[],
noChangeData:[],
typeList:[
{
Style:1,
src:this.domainManager().ImageUrl + '/Static/one-a.png',
},
{
Style:2,
src:this.domainManager().ImageUrl + '/Static/one-b.png',
},
{
Style:3,
src:this.domainManager().ImageUrl + '/Static/one-c.png',
},
{
Style:4,
src:this.domainManager().ImageUrl + '/Static/one-d.png',
},
],
typeList2:[
{
Style:1,
src:this.domainManager().ImageUrl + '/Static/two-a.png',
},
{
Style:2,
src:this.domainManager().ImageUrl + '/Static/two-c.png',
},
{
Style:3,
src:this.domainManager().ImageUrl + '/Static/two-b.png',
},
{
Style:4,
src:this.domainManager().ImageUrl + '/Static/two-d.png',
},
],
typeList3:[
{
Style:1,
src:this.domainManager().ImageUrl + '/Static/three-a.png',
},
{
Style:2,
src:this.domainManager().ImageUrl + '/Static/three-b.png',
},
{
Style:3,
src:this.domainManager().ImageUrl + '/Static/three-c.png',
},
],
styleData:{},
styleList:[],
changestyle:{
Id:-1,
Type:-1,
Style:-1,
CategoryNum:1,
RowNum:1,
},
changestylerules:{
},
} }
}, },
created(){ created(){
this.getList1(); this.getList1();
this.getStyle();
}, },
methods:{ methods:{
goUrl(item){
console.log("111",item);
if(item){
this.$router.push({
name: 'addGoodsClass',
query: {
UserId:item.Id
}
});
}
else{
this.$router.push({
name: 'addGoodsClass'
});
}
},
SaveStyle(formName){
this.$refs[formName].validate((valid) => {
if (valid) {
this.saveBtnLoad=true;
this.apipost("/api/product/SetProductCategoryStyleInfo",this.changestyle,
res => {
this.saveBtnLoad=false;
if (res.data.resultCode === 1) {
this.getStyle();
this.Success(res.data.message);
} else {
this.Error(res.data.message);
}
},
null
);
} else {
return false;
}
});
},
SelectStyle(Style){
this.changestyle.Style=Style;
this.styleData.Type= this.changestyle.Type
},
changeImg(list,type){
this.styleList=list;
this.changestyle.Type=type;
},
getStyle(){
this.loading=true;
this.apipost("/api/product/GetProductCategoryStyleInfo",{}, res => {
if(res.data.resultCode==1){
let data=res.data.data;
this.styleData=res.data.data;
this.changestyle={
Id:data.Id,
Type:data.Type,
Style:data.Style,
CategoryNum:data.CategoryNum,
RowNum:data.RowNum,
}
if(this.styleData.Type==1){
this.styleList=this.typeList;
}
if(this.styleData.Type==2){
this.styleList=this.typeList2;
}
if(this.styleData.Type==3){
this.styleList=this.typeList3;
}
}
})
},
getnoChangeData(num){
if(num==1){
this.transData1=this.noChangeData;
this.transChild1=''
}
else{
this.transData2=this.noChangeData;
this.transChild2=''
}
},
radioChange(){
if(this.transMsg.CategoryId > 0 && this.transMsg.ParentId > 0){
this.transActive="primary"
}
},
// 转移分类
transClass(){
if(this.transMsg.CategoryId<0){
this.Error("必须选择转移前的分类！");
return;
}
if(this.transMsg.ParentId<0){
this.Error("必须选择转移后的分类！");
return;
}
this.saveBtnLoad=true;
this.apipost("/api/product/SetProductCategoryTransfer",this.transMsg, res => {
this.saveBtnLoad=false;
if(res.data.resultCode==1){
this.Success(res.data.message)
this.getList1();
this.transMsg={
CategoryId:-1,
ParentId:-1,
}
}
})
},
nextData(num,item){
if(num==1){
this.transData1=item.ChildList;
this.transChild1=item.Name;
}else{
this.transData2=item.ChildList;
this.transChild2=item.Name;
}
},
// 删除分类
Delete(item){
let that=this;
that.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.apipost('/api/product/DelProductCategoryInfo',{CategoryId:item.Id},
res => {
if (res.data.resultCode === 1) {
this.getList1();
this.Success(res.data.message)
this.searchDig=false;
} else {
this.Error(res.data.message);
}
},
null
);
}).catch(() => {
});
},
getSearch(){ getSearch(){
if(this.Name==''){ if(this.Name==''){
this.msg1.Name=this.Name; this.msg1.Name=this.Name;
...@@ -325,26 +676,56 @@ export default { ...@@ -325,26 +676,56 @@ export default {
} }
}) })
}, },
getChild3(index){
this.activeIndex3=index;
},
getChild2(index){ getChild2(index){
this.activeIndex2=index; this.activeIndex2=index;
this.tableData3=this.tableData2[index].ChildList;
}, },
getChild(item,index){ getChild(item,index){
this.activeIndex=item.Id; this.activeIndex=item.Id;
this.tableData2=this.tableData1[index].ChildList; this.tableData2=this.tableData1[index].ChildList;
if(this.tableData2.length>0){
this.tableData3=this.tableData2[0].ChildList;
}
}, },
handleClick(val){ handleClick(val){
}, },
getList1(){ getList1(num){
this.loading=true; this.loading=true;
this.apipost("/api/product/GetProductCategoryTreeList", this.msg1, res => { this.apipost("/api/product/GetProductCategoryTreeList", this.msg1, res => {
this.loading=false; this.loading=false;
if(res.data.resultCode==1){ if(res.data.resultCode==1){
let pageData=res.data.data; let pageData=res.data.data;
this.tableData1=pageData; if(!num){
if(this.tableData1.length>0){ this.tableData1=pageData;
this.tableData2=this.tableData1[0].ChildList this.noChangeData=pageData;
if(this.tableData1.length>0){
let index=this.activeIndex;
this.tableData2=this.tableData1[index].ChildList
if(this.tableData2.length>0){
let index2=0;
if(this.activeIndex2>-1){
index2=this.activeIndex2;
}
this.tableData3=this.tableData2[index].ChildList
}
}
this.transData1=pageData;
this.transData2=pageData;
} }
if(num && num==1){
this.transData1=pageData;
}
if(num && num==2){
this.transData2=pageData;
}
} }
}) })
...@@ -356,7 +737,6 @@ export default { ...@@ -356,7 +737,6 @@ export default {
if(res.data.resultCode==1){ if(res.data.resultCode==1){
let pageData=res.data.data.pageData; let pageData=res.data.data.pageData;
this.searchList=pageData; this.searchList=pageData;
console.log("searchList",this.searchList)
} }
}) })
...@@ -366,6 +746,96 @@ export default { ...@@ -366,6 +746,96 @@ export default {
</script> </script>
<style> <style>
.goodsClass .noIcon{
background-image: url('../../assets/img/default.png');
background-size: cover;
background-position: center center;
width: 30px;
height: 30px;
border-radius: 0%;
}
.goodsClass .el-form-item__label{
position: relative;
top: -3px;
}
.goodsClass .app-style .hoverClass:hover .text{
display: block;
}
.goodsClass .app-style .hoverClass:hover .cat-style-model{
display: block;
}
.goodsClass .app-style .style-img{
background-image: url('../../assets/img/userman/select.png');
background-size: cover;
background-position: center center;
width: 80px;
height: 80px;
border-radius: 0%;
}
.goodsClass .app-style .image-box .active {
position: absolute;
top: 0;
left: 0;
z-index: 99;
}
.goodsClass .app-style .image-box .text {
cursor: pointer;
background: #409eff;
text-align: center;
position: absolute;
top: 245px;
left: auto;
line-height: 30px;
width: 90px;
color: #fff;
z-index: 999;
display: none;
}
.goodsClass .app-style .cat-style-model {
background-color: rgba(0, 0, 0, 0.5);
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
z-index: 1;
display: none;
}
.goodsClass .app-style .image-box {
width: 340px;
border: 1px solid #f2f4f5;
cursor: pointer;
border-radius: 25px;
margin-right: 5px;
padding: 30px 0;
position: relative;
}
.goodsClass .app-style .tab-box .active {
background: #409eff;
color: #FFFFFF;
}
.goodsClass .app-style .tab-box .btn {
cursor: pointer;
padding: 7px 15px;
margin-right: 10px;
border: 1px solid #E3E3E3;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.goodsClass .app-style .tab-box {
margin-bottom: 20px;
}
.goodsClass .app-transfer .middle {
border-radius: 36px;
width: 36px;
height: 36px;
margin: 0 30px;
font-size: 10px;
}
.goodsClass .app-transfer .transfer .cat-next { .goodsClass .app-transfer .transfer .cat-next {
color: #353535; color: #353535;
text-align: right; text-align: right;
......
src/components/UserMan/usersListEdit.vue
View file @ f9ee85a3
...@@ -35,8 +35,8 @@ ...@@ -35,8 +35,8 @@
<el-switch <el-switch
v-model="userInfo.Blacklist" v-model="userInfo.Blacklist"
active-color="#409EFF" active-color="#409EFF"
active-value="100" :active-value="1"
inactive-value="0"> :inactive-value="0">
</el-switch> </el-switch>
<span class="tip">加入黑名单后，用户将无法下单</span> <span class="tip">加入黑名单后，用户将无法下单</span>
</el-form-item> </el-form-item>
......
src/router/index.js
View file @ f9ee85a3
...@@ -170,6 +170,12 @@ export default new Router({ ...@@ -170,6 +170,12 @@ export default new Router({
name: 'goodsClassification', name: 'goodsClassification',
component: resolve => require(['@/components/CommodityMan/goodsClassification'], resolve), component: resolve => require(['@/components/CommodityMan/goodsClassification'], resolve),
}, },
// 商品管理 添加商品分类
{
path: '/addGoodsClass',
name: 'addGoodsClass',
component: resolve => require(['@/components/CommodityMan/addGoodsClass'], resolve),
},
//设置 基础设置 //设置 基础设置
{ {
path: '/basicSetUp', path: '/basicSetUp',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment