Skip to content

E
ElectricitySheep
Commit 5ed2721a authored by zhengke's avatar zhengke
Browse files
Options

增加组件

parent b25d236a
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1266 additions and 3 deletions
src/App.vue
View file @ 5ed2721a
......@@ -11,7 +11,7 @@ export default {
</script>
<style>
@import "//at.alicdn.com/t/font_1769104_8xxy5gj3qzr.css";
@import "//at.alicdn.com/t/font_1769104_t7ngfhl994d.css";
@import "./assets/css/common.css";
@import "./assets/css/zkcss.css";
html,
......
src/components/common/choiceStoreGood.vue 0 → 100644
View file @ 5ed2721a
<template>
<div>
<el-input size="mini" v-model="msg.Name" placeholder="根据名称搜索" :clearable="true" @clear="msg.pageIndex=1,getList()"
@keyup.enter.native="msg.pageIndex=1,getList()">
<el-button slot="append" @click="msg.pageIndex=1,getList()">搜索</el-button>
</el-input>
<el-table ref="multipleTable" :data="dataList" tooltip-effect="dark" height="450" style="width: 100%"
@selection-change="handleSelectionChange">
<template v-if="isSingle">
<el-table-column width="50px" label="">
<template slot-scope="scope">
<el-radio v-model="scope.row.IsChecked" @change.native="getTemplateRow(scope.$index,scope.row)">&nbsp;
</el-radio>
</template>
</el-table-column>
</template>
<template v-else>
<el-table-column type="selection" width="50px">
</el-table-column>
</template>
<el-table-column label="ID" width="80px">
<template slot-scope="scope">{{ scope.row.Id }}</template>
</el-table-column>
<el-table-column prop="CategoryList" label="分类" width="150px">
<template slot-scope="scope">
<div v-for="(subItem,SubIndex) in scope.row.CategoryList" :key="SubIndex">
{{subItem.CategoryName}}
</div>
</template>
</el-table-column>
<el-table-column prop="name" label="名称">
<template slot-scope="scope">
<div flex="cross:center dir:left">
<img style="width:50px;height:50px;margin-right:10px;" :src="getIconLink(scope.row.CoverImage)" />
<div>{{ scope.row.Name }}</div>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination style="text-align:center" background @current-change="handleCurrentChange" :page-size="msg.pageSize"
layout="prev, pager, next" :total="total">
</el-pagination>
</div>
</template>
<script>
export default {
props: ['ckGoods', "isSingle", "IsGetSpec"],
data() {
return {
dataList: [],
msg: {
pageIndex: 1,
pageSize: 15,
Name: '',
GoodsStatus: 1, //上架中
IsGetSpec: 0
},
total: 0,
selectRow: [],
};
},
created() {
if (this.IsGetSpec) {
this.msg.IsGetSpec = this.IsGetSpec;
}
},
methods: {
//获取所有菜单
getList() {
this.apipost("/api/product/GetProductGoodsDialogList_V3", this.msg, res => {
if (res.data.resultCode == 1) {
this.total = res.data.data.count;
var tempArray = res.data.data.pageData;
if (tempArray && tempArray.length > 0) {
tempArray.forEach(item => {
item.IsChecked = false;
});
}
this.dataList = JSON.parse(JSON.stringify(tempArray));
} else {
this.Info(res.data.message);
}
})
},
handleSelectionChange(val) {
this.selectRow = JSON.parse(JSON.stringify(val));
},
getTemplateRow(index, row) {
this.selectRow = [];
if (this.dataList && this.dataList.length > 0) {
this.dataList.forEach(item => {
if (item.Id != row.Id) {
item.IsChecked = false;
}
})
}
this.selectRow.push(JSON.parse(JSON.stringify(row)));
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
//父组件调用方法
getChoicedGoods() {
return this.selectRow;
},
//清空多选方法
toggleSelection(rows) {
if (rows) {
rows.forEach(row => {
this.$refs.multipleTable.toggleRowSelection(row);
});
} else {
this.$refs.multipleTable.clearSelection();
}
},
},
mounted() {
this.getList();
}
};
</script>
src/components/sallCenter/plugin/reservestore.vue 0 → 100644
View file @ 5ed2721a
<style>
.reserStore {
min-height: 200px;
background: #fff;
overflow: hidden;
}
.reserStoreImg{
width:100%;
height:150px;
overflow: hidden;
}
.reserStoreImg img{
width:100%;
margin-top:-100px;
}
.reserBtmStore{
padding:30px;
}
.reserBtmOne{
display: flex;
justify-content: space-between;
align-items: center;
}
</style>
<template>
<div :class="{'active':reserData.isCked}">
<div class="diy-component-options" v-if="reserData.isCked">
<el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
<el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
<el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
style="right: -25px; top: 0;"></el-button>
<el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
style="right: -25px; top: 30px;"></el-button>
</div>
<div class="diy-component-preview">
<div class="reserStore" :style="{marginLeft:data.PaddingLeft+'px',
marginRight:data.PaddingRight+'px',marginTop:data.PaddingTop+'px',
marginBottom:data.PaddingBottom+'px','borderRadius':data.SearchFilletPX+'px'}">
<div class="reserStoreImg" v-if="data.IsShowStoreImg">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/hire.jpg" alt=""/>
</div>
<div class="reserBtmStore">
<div class="reserBtmOne">
<div style="color:#000000;font-size:14px;">月星环球港门店</div>
<div style="color:#111111;font-size:12px;">距离：20m</div>
</div>
<div style="color:#727272;font-size:12px;margin:20px 0;">成都市锦江区阳光新业中心2号楼2302</div>
<div class="reserBtmOne">
<div style="color:#555555;font-size:12px;">
<i style="color:#FF4048;margin-right:5px;position:relative;top:-4px;" class="iconfont icon-tel"></i>023-12345678</div>
<div style="color:#FFC86D;font-size:12px;">上次消费的店铺</div>
</div>
</div>
</div>
</div>
<div class="diy-component-edit" v-if="reserData.isCked">
<el-form label-width="120px" @submit.native.prevent>
<el-form-item label="上边距">
<el-input type="number" size="small" :min="0" v-model="data.PaddingTop">
<template slot="append">px</template>
</el-input>
</el-form-item>
<el-form-item label="下边距">
<el-input type="number" size="small" :min="0" v-model="data.PaddingBottom">
<template slot="append">px</template>
</el-input>
</el-form-item>
<el-form-item label="左边距">
<el-input type="number" size="small" :min="0" v-model="data.PaddingLeft">
<template slot="append">px</template>
</el-input>
</el-form-item>
<el-form-item label="右边距">
<el-input type="number" size="small" :min="0" v-model="data.PaddingRight">
<template slot="append">px</template>
</el-input>
</el-form-item>
<el-form-item label="圆角">
<el-input type="number" size="small" :min="0" v-model="data.SearchFilletPX">
<template slot="append">px</template>
</el-input>
</el-form-item>
<el-form-item label="是否显示封面图">
<el-switch
v-model="data.IsShowStoreImg"
active-color="#409EFF"
:active-value="true"
:inactive-value="false">
</el-switch>
</el-form-item>
</el-form>
</div>
</div>
</template>
<script>
export default {
props: ["reserData", "index", "dataLeng"],
components: {},
data() {
return {
data: this.reserData.data,
checkIndex: 0
};
},
created() {
},
methods: {
//向父组件传值 并调用排序
resetSord(IsUp) {
this.$emit('getSord', this.index, IsUp);
},
//点击触发父组件删除
delPlugin() {
this.$emit('comDelPlugin', this.index);
}
},
computed: {
},
mounted() {
}
};
</script>
src/components/sallCenter/plugin/storeGoods.vue 0 → 100644
View file @ 5ed2721a
This diff is collapsed.
src/components/sallCenter/templateEdit.vue
View file @ 5ed2721a
......@@ -290,6 +290,10 @@
:index="index" :dataLeng="dataList.length"></educationArticle>
<educationCustom v-if="item.Id=='educationCustom'" :cusData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
:index="index" :dataLeng="dataList.length"></educationCustom>
<reservestore v-if="item.Id=='reservestore'" :reserData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
:index="index" :dataLeng="dataList.length"></reservestore>
<storeGoods v-if="item.Id=='storeGoods'" :storeData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
:index="index" :dataLeng="dataList.length"></storeGoods>
</div>
</div>
</div>
......@@ -401,6 +405,9 @@
import education from "../sallCenter/plugin/education"
import educationArticle from "../sallCenter/plugin/educationArticle"
import educationCustom from "../sallCenter/plugin/educationCustom"
import reservestore from "../sallCenter/plugin/reservestore"
import storeGoods from "../sallCenter/plugin/storeGoods"
import ChooseImg from "@/components/global/ChooseImg.vue";
export default {
......@@ -473,7 +480,9 @@
sidao,
education,
educationArticle,
educationCustom
educationCustom,
reservestore,
storeGoods
},
methods: {
//选择图片
......@@ -1362,7 +1371,62 @@
}
}
this.dataList.push(customObj);
break;
break;
case 'reservestore':
let reserObj = {
Id:'reservestore',
isCked:false,
data:{
PaddingTop:0, //上边距
PaddingBottom:0, //下边距
PaddingLeft:0, //左边距
PaddingRight:0, //右边距
IsShowStoreImg:true, //是否显示商店图片
SearchFilletPX:0 //圆角像素
}
}
this.dataList.push(reserObj);
break;
case 'storeGoods':
let storeGoodObj = {
Id:'storeGoods',
isCked:false,
data:{
showCat: false, //显示分类
catPosition: 'top', //分类栏位置
catStyle: 1, //分类样式
catList: [], //分类列表
list: [], //商品列表
addGoodsType: 0, //商品添加方式
goodsLength: 10, //商品数量
listStyle: 1, //列表样式
goodsCoverProportion: '1-1', //商品封面图宽高比例
fill: 1, //商品封面图填充
goodsStyle: 1, //商品样式
textStyle: 1, //文本样式
showGoodsName: true, //显示商品名称
showGoodsPrice: true, //显示商品价格
showBuyBtn: true, //显示购买按钮
buyBtn: 'cart', //购买按钮样式
buyBtnStyle: 1, //购买按钮文字样式
buyBtnText: '购买', //购买按钮文字
buttonColor: '#ff4544', //购买按钮颜色
showGoodsTag: false, //显示商品角标
customizeGoodsTag: false, //商品角标自定义
goodsTagPicUrl: '', //商品角标链接
showImg: false, //
backgroundColor: '#fff', //背景颜色
backgroundPicUrl: '', //背景链接
position: 5,
mode: 1,
backgroundHeight: 100, //背景高
backgroundWidth: 100, //背景宽
showScore: true, //显示打星星
scoreColor: '' //星星颜色
}
}
this.dataList.push(storeGoodObj);
break;
}
},
//给子组件调用 重新排序上移下移
......
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