Skip to content

E
ElectricitySheep
Commit 841e4d69 authored by zhengke's avatar zhengke
Browse files
Options

Merge branch 'master' of http://gitlab.oytour.com/huangyuanyuan/electricitysheep

parents 4fdc2730 d17472ad
Hide whitespace changes
Inline Side-by-side
Showing with 425 additions and 367 deletions
src/components/sallCenter/plugin/link.vue
View file @ 841e4d69
...@@ -107,6 +107,7 @@ ...@@ -107,6 +107,7 @@
border-radius: 14px; border-radius: 14px;
border: 2px solid #353535; border: 2px solid #353535;
} }
.link-gallery-item { .link-gallery-item {
width: 100px; width: 100px;
height: 100px; height: 100px;
...@@ -163,8 +164,7 @@ ...@@ -163,8 +164,7 @@
</div> </div>
<div style="font-weight: 600">{{data.title?data.title:'这里是标题示例'}}</div> <div style="font-weight: 600">{{data.title?data.title:'这里是标题示例'}}</div>
</div> </div>
<img class="arrow" :src="domainManager().ImageUrl+'/Static/icon-jiantou-r.png'" <img class="arrow" :src="domainManager().ImageUrl+'/Static/icon-jiantou-r.png'" v-if="data.arrowsSwitch">
v-if="data.arrowsSwitch">
</div> </div>
</div> </div>
</div> </div>
...@@ -172,11 +172,11 @@ ...@@ -172,11 +172,11 @@
<el-form label-width="100px" @submit.native.prevent> <el-form label-width="100px" @submit.native.prevent>
<el-form-item label="标题"> <el-form-item label="标题">
<label slot="label">标题 <label slot="label">标题
<el-tooltip class="item" effect="dark" content="标题长度不超过10个字" placement="top"> <el-tooltip class="item" effect="dark" content="标题长度不超过30个字" placement="top">
<i class="el-icon-info"></i> <i class="el-icon-info"></i>
</el-tooltip> </el-tooltip>
</label> </label>
<el-input size="small" v-model="data.title" maxlength="10"></el-input> <el-input size="small" v-model="data.title" maxlength="30"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="字体大小"> <el-form-item label="字体大小">
<el-radio v-model="data.fontSize" label="36">大</el-radio> <el-radio v-model="data.fontSize" label="36">大</el-radio>
...@@ -210,7 +210,7 @@ ...@@ -210,7 +210,7 @@
<el-form-item label="链接页面"> <el-form-item label="链接页面">
<el-input size="small" class="link-page" v-model="data.link.name" :disabled="true"> <el-input size="small" class="link-page" v-model="data.link.name" :disabled="true">
<template slot="append"> <template slot="append">
<el-button @click="isShowLink=true">选择链接</el-button> <el-button @click="isShowLink=true">选择链接</el-button>
</template> </template>
</el-input> </el-input>
</el-form-item> </el-form-item>
...@@ -226,7 +226,7 @@ ...@@ -226,7 +226,7 @@
</label> </label>
<el-button size="mini" @click="choicImg=true">选择图标</el-button> <el-button size="mini" @click="choicImg=true">选择图标</el-button>
<div flex="main:center cross:center" class="link-gallery-item"> <div flex="main:center cross:center" class="link-gallery-item">
<img v-if="data.picUrl!=''" style="max-width:100%;max-height: 100%;" :src="getIconLink(data.picUrl)"/> <img v-if="data.picUrl!=''" style="max-width:100%;max-height: 100%;" :src="getIconLink(data.picUrl)" />
</div> </div>
</el-form-item> </el-form-item>
</template> </template>
...@@ -285,8 +285,8 @@ ...@@ -285,8 +285,8 @@
getChoiceLink() { getChoiceLink() {
//调用子组件方法 //调用子组件方法
var obj = this.$refs.chooseMenu.getChooseMenu(); var obj = this.$refs.chooseMenu.getChooseMenu();
this.data.link.name=obj.PageName; this.data.link.name = obj.PageName;
this.data.link.url=obj.PageUrl; this.data.link.url = obj.PageUrl;
this.isShowLink = false; this.isShowLink = false;
}, },
......
src/components/sallCenter/plugin/navigationIcon.vue
View file @ 841e4d69
<style> <style>
.diynav-container { .diynav-container {
min-height: 100px; min-height: 100px;
width: 100%; width: 100%;
background-size: 100% 100%; background-size: 100% 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
.Headernav-item {
text-align: center; .Headernav-item {
font-size: 24px; text-align: center;
padding: 20px 0; font-size: 24px;
} padding: 20px 0;
.Navabout-text { }
color: #909399;
font-size: 12px; .Navabout-text {
margin-top: -10px; color: #909399;
} font-size: 12px;
.navigation_pic_boxDiv { margin-top: -10px;
width: 70px; }
height: 70px;
border: 1px solid #ccc; .navigation_pic_boxDiv {
cursor: pointer; width: 70px;
background-color: #fff; height: 70px;
background-size: contain; border: 1px solid #ccc;
background-position: center; cursor: pointer;
background-repeat: no-repeat; background-color: #fff;
position: relative; background-size: contain;
} background-position: center;
.navigation_pic_boxDiv i { background-repeat: no-repeat;
font-size: 22px; position: relative;
color: #909399; }
}
.divbg_position { .navigation_pic_boxDiv i {
width: 170px; font-size: 22px;
height: 180px; color: #909399;
} }
.divbg_position > div {
height: 50px; .divbg_position {
width: 50px; width: 170px;
margin-bottom: 10px; height: 180px;
cursor: pointer; }
background-color: #F5F7F9;
} .divbg_position>div {
.bg_active{ height: 50px;
background-color: #E6F4FF; width: 50px;
border: 2px dashed #5CB3FD; margin-bottom: 10px;
} cursor: pointer;
.edit-nav-item { background-color: #F5F7F9;
border: 1px solid #e2e2e2; }
line-height: normal;
padding: 5px; .bg_active {
margin-bottom: 5px; background-color: #E6F4FF;
} border: 2px dashed #5CB3FD;
.nav-edit-options { }
position: relative;
} .edit-nav-item {
.navapp-image-upload{ border: 1px solid #e2e2e2;
display: inline-block; line-height: normal;
margin-right: 5px; padding: 5px;
} margin-bottom: 5px;
.nav-edit-options .el-button { }
height: 25px;
line-height: 25px; .nav-edit-options {
width: 25px; position: relative;
padding: 0; }
text-align: center;
border: none; .navapp-image-upload {
border-radius: 0; display: inline-block;
position: absolute; margin-right: 5px;
margin-left: 0; }
}
.navapp-image-upload .pic-box { .nav-edit-options .el-button {
width: 70px; height: 25px;
height: 70px; line-height: 25px;
border: 1px solid #ccc; width: 25px;
cursor: pointer; padding: 0;
background-color: #fff; text-align: center;
background-size: contain; border: none;
background-position: center; border-radius: 0;
background-repeat: no-repeat; position: absolute;
position: relative; margin-left: 0;
} }
.navapp-image-upload .pic-box i {
font-size: 22px; .navapp-image-upload .pic-box {
color: #909399; width: 70px;
} height: 70px;
.navapp-image-upload .pic-box .size-tip { border: 1px solid #ccc;
line-height: 1.35; cursor: pointer;
text-align: center; background-color: #fff;
position: absolute; background-size: contain;
bottom: 0; background-position: center;
left: 0; background-repeat: no-repeat;
width: 100%; position: relative;
white-space: nowrap; }
overflow: hidden;
text-overflow: ellipsis; .navapp-image-upload .pic-box i {
font-size: 12px; font-size: 22px;
color: #fff; color: #909399;
background: rgba(0, 0, 0, 0.2); }
letter-spacing: -1px;
} .navapp-image-upload .pic-box .size-tip {
.navapp-image-upload .image-delete { line-height: 1.35;
position: absolute; text-align: center;
top: -10px; position: absolute;
right: -10px; bottom: 0;
padding: 5px; left: 0;
visibility: hidden; width: 100%;
z-index: 1; white-space: nowrap;
} overflow: hidden;
.navapp-image-upload .image-delete i{ text-overflow: ellipsis;
font-size: 12px; font-size: 12px;
color: #fff; color: #fff;
} background: rgba(0, 0, 0, 0.2);
.navapp-image-upload:hover .image-delete { letter-spacing: -1px;
visibility: visible; }
}
.Headernav-item img { .navapp-image-upload .image-delete {
display: block; position: absolute;
width: 88px; top: -10px;
height: 88px; right: -10px;
margin: 0 auto 5px auto; padding: 5px;
} visibility: hidden;
.Headernav-item > div { z-index: 1;
height: 25px; }
line-height: 25px;
} .navapp-image-upload .image-delete i {
.navigation_pic_boxDiv .image-delete { font-size: 12px;
position: absolute; color: #fff;
top: -10px; }
right: -10px;
padding: 5px; .navapp-image-upload:hover .image-delete {
visibility: hidden; visibility: visible;
z-index: 1; }
}
.navigation_pic_boxDiv:hover .image-delete{ .Headernav-item img {
visibility: visible; display: block;
} width: 88px;
.navigation_pic_boxDiv .image-delete i{ height: 88px;
font-size: 12px; margin: 0 auto 5px auto;
color: #fff; }
}
.Headernav-item>div {
height: 25px;
line-height: 25px;
}
.navigation_pic_boxDiv .image-delete {
position: absolute;
top: -10px;
right: -10px;
padding: 5px;
visibility: hidden;
z-index: 1;
}
.navigation_pic_boxDiv:hover .image-delete {
visibility: visible;
}
.navigation_pic_boxDiv .image-delete i {
font-size: 12px;
color: #fff;
}
</style> </style>
<template> <template>
<div :class="{'active':navData.isCked}"> <div :class="{'active':navData.isCked}">
<div class="diy-component-options" v-if="navData.isCked"> <div class="diy-component-options" v-if="navData.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-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-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-up" v-if="index>0" @click="resetSord(0)"
<el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)" style="right: -25px; top: 30px;"></el-button> style="right: -25px; top: 0;"></el-button>
</div> <el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
<div class="diy-component-preview"> style="right: -25px; top: 30px;"></el-button>
<div class="diynav-container" :style="{backgroundColor:navData.data.backgroundColor,overflowX:navData.data.scroll?'auto':'hidden',backgroundPosition:bgPostion, </div>
<div class="diy-component-preview">
<div class="diynav-container" :style="{backgroundColor:navData.data.backgroundColor,overflowX:navData.data.scroll?'auto':'hidden',backgroundPosition:bgPostion,
backgroundImage:'url(' + getIconLink(navData.data.backgroundPicUrl) + ')'}"> backgroundImage:'url(' + getIconLink(navData.data.backgroundPicUrl) + ')'}">
<div flex="dir:left" style="width:750px;flex-wrap:wrap;"> <div flex="dir:left" style="width:750px;flex-wrap:wrap;">
<div class="Headernav-item" v-for="(item,index) in navData.data.navs" :key="index" :style="{width:getNavWidth(navData.data.columns)}"> <div class="Headernav-item" v-for="(item,index) in navData.data.navs" :key="index"
<img :src="getIconLink(item.icon)"/> :style="{width:getNavWidth(navData.data.columns)}">
<div :style="{color:navData.data.color}">{{item.name}}</div> <img :src="getIconLink(item.icon)" />
</div> <div :style="{color:navData.data.color}">{{item.name}}</div>
</div> </div>
</div>
</div> </div>
<div class="diy-component-edit" v-if="navData.isCked"> </div>
<el-form label-width="100px"> </div>
<el-form-item label="每页行数" size="small"> <div class="diy-component-edit" v-if="navData.isCked">
<el-input type="number" :min="1" :max="100" v-model="navData.data.rows"></el-input> <el-form label-width="100px">
</el-form-item> <el-form-item label="每页行数" size="small">
<el-form-item label="每行个数"> <el-input type="number" :min="1" :max="100" v-model="navData.data.rows"></el-input>
<el-radio-group v-model="navData.data.columns"> </el-form-item>
<el-radio :label="3">3</el-radio> <el-form-item label="每行个数">
<el-radio :label="4">4</el-radio> <el-radio-group v-model="navData.data.columns">
<el-radio :label="5">5</el-radio> <el-radio :label="3">3</el-radio>
</el-radio-group> <el-radio :label="4">4</el-radio>
</el-form-item> <el-radio :label="5">5</el-radio>
<el-form-item label="左右滑动"> </el-radio-group>
<el-switch v-model="navData.data.scroll"></el-switch> </el-form-item>
</el-form-item> <el-form-item label="左右滑动">
<el-form-item label="拉取商城导航"> <el-switch v-model="navData.data.scroll"></el-switch>
<el-button size="small" @click="isShowNavLink=true">选择</el-button> </el-form-item>
</el-form-item> <el-form-item label="拉取商城导航">
<el-form-item label="导航图标"> <el-button size="small" @click="isShowNavLink=true">选择</el-button>
<div flex="dir:top"> </el-form-item>
<div class="edit-nav-item" v-for="(item,index) in navData.data.navs" :key="index"> <el-form-item label="导航图标">
<div class="nav-edit-options"> <div flex="dir:top">
<el-button type="primary" icon="el-icon-delete" @click="delIcon(index)" style="top: -6px; right: -31px;"></el-button> <div class="edit-nav-item" v-for="(item,index) in navData.data.navs" :key="index">
</div> <div class="nav-edit-options">
<div flex="dir:left box:first cross:center"> <el-button type="primary" icon="el-icon-delete" @click="delIcon(index)"
<div> style="top: -6px; right: -31px;"></el-button>
<div class="navapp-image-upload"> </div>
<div flex="main:center cross:center" @click="choiceMyImg(index)" class="pic-box" :style="{backgroundImage:'url(' + getIconLink(item.icon) + ')'}"> <div flex="dir:left box:first cross:center">
<i class="el-icon-picture-outline" v-if="item.icon==''"></i> <div>
<div class="size-tip">88 × 88</div> <div class="navapp-image-upload">
<el-button type="danger" v-if="item.icon!=''" class="image-delete" size="mini" icon="el-icon-close" @click.stop="item.icon=''" circle></el-button> <div flex="main:center cross:center" @click="choiceMyImg(index)" class="pic-box"
</div> :style="{backgroundImage:'url(' + getIconLink(item.icon) + ')'}">
</div> <i class="el-icon-picture-outline" v-if="item.icon==''"></i>
</div> <div class="size-tip">88 × 88</div>
<div> <el-button type="danger" v-if="item.icon!=''" class="image-delete" size="mini"
<div style="margin-bottom:5px;"> icon="el-icon-close" @click.stop="item.icon=''" circle></el-button>
<el-input type="text" placeholder="名称" v-model="item.name" size="small"></el-input>
</div>
<div>
<el-input type="text" v-model="item.url" placeholder="点击选择链接" size="small">
<el-button slot="append" @click="getMyChoice(index)">选择链接</el-button>
</el-input>
</div>
</div>
</div>
</div>
</div>
<el-button size="small" @click="addNavigatiton()">添加图标</el-button>
</el-form-item>
<el-form-item label="背景颜色">
<el-color-picker v-model="navData.data.backgroundColor" size="small"></el-color-picker>
<el-input type="text" v-model="navData.data.backgroundColor" size="small" style="width: 80px; margin-right: 25px;"></el-input>
</el-form-item>
<el-form-item label="背景图片">
<el-switch v-model="navData.data.showImg"></el-switch>
<div class="Navabout-text">当前组件高度为156px,宽750px</div>
</el-form-item>
<el-form-item label="上传背景" v-if="navData.data.showImg">
<div style="line-height:normal;display:inline-block;">
<div class="navigation_pic_boxDiv" @click="choicImg=true,selectType=1" flex="main:center cross:center" :style="{backgroundImage:'url(' + getIconLink(navData.data.backgroundPicUrl) + ')'}">
<i class="el-icon-picture-outline" v-if="navData.data.backgroundPicUrl==''"></i>
<el-button type="danger" class="image-delete" v-if="navData.data.backgroundPicUrl!=''" size="mini" icon="el-icon-close" @click.stop="navData.data.backgroundPicUrl=''" circle></el-button>
</div>
</div>
</el-form-item>
<el-form-item label="图片位置" v-if="navData.data.showImg">
<div flex="main:justify wrap:wrap" class="divbg_position">
<div :class="{'bg_active':navData.data.position==1}" @click="navData.data.position=1,selectPosition('left top')"></div>
<div :class="{'bg_active':navData.data.position==2}" @click="navData.data.position=2,selectPosition('center top')"></div>
<div :class="{'bg_active':navData.data.position==3}" @click="navData.data.position=3,selectPosition('right top')"></div>
<div :class="{'bg_active':navData.data.position==4}" @click="navData.data.position=4,selectPosition('left center')"></div>
<div :class="{'bg_active':navData.data.position==5}" @click="navData.data.position=5,selectPosition('center center')"></div>
<div :class="{'bg_active':navData.data.position==6}" @click="navData.data.position=6,selectPosition('right center')"></div>
<div :class="{'bg_active':navData.data.position==7}" @click="navData.data.position=7,selectPosition('left bottom')"></div>
<div :class="{'bg_active':navData.data.position==8}" @click="navData.data.position=8,selectPosition('center bottom')"></div>
<div :class="{'bg_active':navData.data.position==9}" @click="navData.data.position=9,selectPosition('right bottom')"></div>
</div> </div>
</el-form-item> </div>
<el-form-item label="填充方式" v-if="navData.data.showImg"> </div>
<el-radio-group v-model="navData.data.mode"> <div>
<el-radio :label="1">充满</el-radio> <div style="margin-bottom:5px;">
<el-radio :label="2">左右平铺</el-radio> <el-input type="text" placeholder="名称" v-model="item.name" size="small"></el-input>
<el-radio :label="3">上下平铺</el-radio> </div>
<el-radio :label="4">平铺满</el-radio> <div>
</el-radio-group> <el-input type="text" v-model="item.url" placeholder="点击选择链接" size="small">
</el-form-item> <el-button slot="append" @click="getMyChoice(index)">选择链接</el-button>
<el-form-item label="背景图宽" v-if="navData.data.mode!=1"> </el-input>
<el-slider v-model="navData.data.backgroundWidth" show-input :show-input-controls='false' style="float:left;width:95%;"></el-slider> </div>
<div style="float:right;">%</div> </div>
</el-form-item> </div>
<el-form-item label="背景图高" v-if="navData.data.mode!=1"> </div>
<el-slider v-model="navData.data.backgroundHeight" show-input :show-input-controls='false' style="float:left;width:95%;"></el-slider> </div>
<div style="float:right;">%</div> <el-button size="small" @click="addNavigatiton()">添加图标</el-button>
</el-form-item> </el-form-item>
<el-form-item label="文字颜色"> <el-form-item label="背景颜色">
<el-color-picker v-model="navData.data.color" size="small"></el-color-picker> <el-color-picker v-model="navData.data.backgroundColor" size="small"></el-color-picker>
<el-input type="text" v-model="navData.data.color" size="small" style="width: 80px; margin-right: 25px;"></el-input> <el-input type="text" v-model="navData.data.backgroundColor" size="small"
</el-form-item> style="width: 80px; margin-right: 25px;"></el-input>
</el-form> </el-form-item>
</div> <el-form-item label="背景图片">
<el-dialog title="导航链接" :visible.sync="isShowNavLink" width="800px"> <el-switch v-model="navData.data.showImg" :active-value="true" :inactive-value="false"
<Navigation ref="Navigation"></Navigation> @change="showImgChange()"></el-switch>
<span slot="footer" class="dialog-footer"> <div class="Navabout-text">当前组件高度为156px,宽750px</div>
<el-button size="small" @click="isShowNavLink=false">取 消</el-button> </el-form-item>
<el-button size="small" type="danger" @click="getMyLink()">确 定</el-button> <el-form-item label="上传背景" v-if="navData.data.showImg">
</span> <div style="line-height:normal;display:inline-block;">
</el-dialog> <div class="navigation_pic_boxDiv" @click="choicImg=true,selectType=1" flex="main:center cross:center"
<el-dialog title="选择链接" :visible.sync="isShowLink" width="800px"> :style="{backgroundImage:'url(' + getIconLink(navData.data.backgroundPicUrl) + ')'}">
<chooseMenu ref="chooseMenu"></chooseMenu> <i class="el-icon-picture-outline" v-if="navData.data.backgroundPicUrl==''"></i>
<span slot="footer" class="dialog-footer"> <el-button type="danger" class="image-delete" v-if="navData.data.backgroundPicUrl!=''" size="mini"
<el-button size="small" @click="isShowLink=false">取 消</el-button> icon="el-icon-close" @click.stop="navData.data.backgroundPicUrl=''" circle></el-button>
<el-button size="small" type="danger" @click="getChoiceLink()">确 定</el-button> </div>
</span> </div>
</el-dialog> </el-form-item>
<!-- 选择图片文件 --> <el-form-item label="图片位置" v-if="navData.data.showImg">
<el-dialog title="选择文件" :visible.sync="choicImg" width="1240px"> <div flex="main:justify wrap:wrap" class="divbg_position">
<ChooseImg @SelectId="SelectId"></ChooseImg> <div :class="{'bg_active':navData.data.position==1}"
</el-dialog> @click="navData.data.position=1,selectPosition('left top')"></div>
<div :class="{'bg_active':navData.data.position==2}"
@click="navData.data.position=2,selectPosition('center top')"></div>
<div :class="{'bg_active':navData.data.position==3}"
@click="navData.data.position=3,selectPosition('right top')"></div>
<div :class="{'bg_active':navData.data.position==4}"
@click="navData.data.position=4,selectPosition('left center')"></div>
<div :class="{'bg_active':navData.data.position==5}"
@click="navData.data.position=5,selectPosition('center center')"></div>
<div :class="{'bg_active':navData.data.position==6}"
@click="navData.data.position=6,selectPosition('right center')"></div>
<div :class="{'bg_active':navData.data.position==7}"
@click="navData.data.position=7,selectPosition('left bottom')"></div>
<div :class="{'bg_active':navData.data.position==8}"
@click="navData.data.position=8,selectPosition('center bottom')"></div>
<div :class="{'bg_active':navData.data.position==9}"
@click="navData.data.position=9,selectPosition('right bottom')"></div>
</div>
</el-form-item>
<el-form-item label="填充方式" v-if="navData.data.showImg">
<el-radio-group v-model="navData.data.mode">
<el-radio :label="1">充满</el-radio>
<el-radio :label="2">左右平铺</el-radio>
<el-radio :label="3">上下平铺</el-radio>
<el-radio :label="4">平铺满</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="背景图宽" v-if="navData.data.mode!=1">
<el-slider v-model="navData.data.backgroundWidth" show-input :show-input-controls='false'
style="float:left;width:95%;"></el-slider>
<div style="float:right;">%</div>
</el-form-item>
<el-form-item label="背景图高" v-if="navData.data.mode!=1">
<el-slider v-model="navData.data.backgroundHeight" show-input :show-input-controls='false'
style="float:left;width:95%;"></el-slider>
<div style="float:right;">%</div>
</el-form-item>
<el-form-item label="文字颜色">
<el-color-picker v-model="navData.data.color" size="small"></el-color-picker>
<el-input type="text" v-model="navData.data.color" size="small" style="width: 80px; margin-right: 25px;">
</el-input>
</el-form-item>
</el-form>
</div> </div>
<el-dialog title="导航链接" :visible.sync="isShowNavLink" width="800px">
<Navigation ref="Navigation"></Navigation>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="isShowNavLink=false">取 消</el-button>
<el-button size="small" type="danger" @click="getMyLink()">确 定</el-button>
</span>
</el-dialog>
<el-dialog title="选择链接" :visible.sync="isShowLink" width="800px">
<chooseMenu ref="chooseMenu"></chooseMenu>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="isShowLink=false">取 消</el-button>
<el-button size="small" type="danger" @click="getChoiceLink()">确 定</el-button>
</span>
</el-dialog>
<!-- 选择图片文件 -->
<el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
<ChooseImg @SelectId="SelectId"></ChooseImg>
</el-dialog>
</div>
</template> </template>
<script> <script>
import Navigation from "../../common/NavigationLinks.vue"; import Navigation from "../../common/NavigationLinks.vue";
...@@ -285,20 +330,20 @@ ...@@ -285,20 +330,20 @@
import ChooseImg from "@/components/global/ChooseImg.vue"; import ChooseImg from "@/components/global/ChooseImg.vue";
export default { export default {
props: ["navData","index","dataLeng"], props: ["navData", "index", "dataLeng"],
data() { data() {
return { return {
bgPostion:'', bgPostion: '',
//宽度 //宽度
navWidth:'', navWidth: '',
isShowNavLink:false, isShowNavLink: false,
//弹窗 //弹窗
isShowLink:false, isShowLink: false,
//数组下标 //数组下标
commonIndex:0, commonIndex: 0,
//选择图片弹窗 //选择图片弹窗
choicImg:false, choicImg: false,
selectType:1, selectType: 1,
}; };
}, },
components: { components: {
...@@ -310,77 +355,83 @@ ...@@ -310,77 +355,83 @@
}, },
methods: { methods: {
//切换背景位置 //是否显示背景图切换
selectPosition(po){ showImgChange() {
this.bgPostion=po; if (!this.navData.data.showImg) {
}, this.navData.data.backgroundPicUrl = "";
//改变宽度 }
getNavWidth(w){ },
let str='' //切换背景位置
if(w==3){ selectPosition(po) {
str='33.3333%' this.bgPostion = po;
}else if(w==4){ },
str='25%' //改变宽度
}else{ getNavWidth(w) {
str='20%' let str = ''
} if (w == 3) {
return str; str = '33.3333%'
}, } else if (w == 4) {
//添加导航图标 str = '25%'
addNavigatiton(){ } else {
let obj={ str = '20%'
icon:'', }
name:'', return str;
url:'', },
openType:'navigate', //添加导航图标
key:'diy' addNavigatiton() {
} let obj = {
this.navData.data.navs.push(obj); icon: '',
}, name: '',
//删除导航图标 url: '',
delIcon(index){ openType: 'navigate',
this.navData.data.navs.splice(index,1); key: 'diy'
}, }
//点击确定获取linK this.navData.data.navs.push(obj);
getMyLink(){ },
var ckedArr = this.$refs.Navigation.getChooseLink(); //删除导航图标
this.navData.data.navs = this.navData.data.navs.concat(ckedArr); delIcon(index) {
this.isShowNavLink=false; this.navData.data.navs.splice(index, 1);
}, },
getMyChoice(index){ //点击确定获取linK
this.isShowLink=true; getMyLink() {
this.commonIndex=index; var ckedArr = this.$refs.Navigation.getChooseLink();
}, this.navData.data.navs = this.navData.data.navs.concat(ckedArr);
//获取选择链接 this.isShowNavLink = false;
getChoiceLink(){ },
//调用子组件方法 getMyChoice(index) {
var obj = this.$refs.chooseMenu.getChooseMenu(); this.isShowLink = true;
this.navData.data.navs[this.commonIndex].url=obj.PageUrl; this.commonIndex = index;
this.isShowLink = false; },
}, //获取选择链接
//选择图片 getChoiceLink() {
SelectId(msg){ //调用子组件方法
if(this.selectType==1){ var obj = this.$refs.chooseMenu.getChooseMenu();
this.navData.data.backgroundPicUrl=msg.url; this.navData.data.navs[this.commonIndex].url = obj.PageUrl;
}else{ this.isShowLink = false;
this.navData.data.navs[this.commonIndex].icon=msg.url; },
} //选择图片
this.choicImg=false; SelectId(msg) {
}, if (this.selectType == 1) {
//向父组件传值 并调用排序 this.navData.data.backgroundPicUrl = msg.url;
resetSord(IsUp){ } else {
this.$emit('getSord', this.index,IsUp); this.navData.data.navs[this.commonIndex].icon = msg.url;
},
//选取图片
choiceMyImg(index){
this.choicImg=true;
this.commonIndex=index;
this.selectType=2;
},
//点击触发父组件删除
delPlugin(){
this.$emit('comDelPlugin', this.index);
} }
this.choicImg = false;
},
//向父组件传值 并调用排序
resetSord(IsUp) {
this.$emit('getSord', this.index, IsUp);
},
//选取图片
choiceMyImg(index) {
this.choicImg = true;
this.commonIndex = index;
this.selectType = 2;
},
//点击触发父组件删除
delPlugin() {
this.$emit('comDelPlugin', this.index);
}
}, },
mounted() { mounted() {
......
src/components/sallCenter/plugin/notice.vue
View file @ 841e4d69
...@@ -74,8 +74,7 @@ ...@@ -74,8 +74,7 @@
<div style="min-width: 2rem;max-width: 7rem;">{{data.name}}</div> <div style="min-width: 2rem;max-width: 7rem;">{{data.name}}</div>
<div style="margin: 0 12px;">{{data.content}}</div> <div style="margin: 0 12px;">{{data.content}}</div>
</div> </div>
<img :src="domainManager().ImageUrl+'/Static/icon-left-arrow.png'" <img :src="domainManager().ImageUrl+'/Static/icon-left-arrow.png'" style="width: 10px;height: 18px;">
style="width: 10px;height: 18px;">
</div> </div>
</div> </div>
<div class="diy-component-edit" v-if="noticeData.isCked"> <div class="diy-component-edit" v-if="noticeData.isCked">
...@@ -90,6 +89,9 @@ ...@@ -90,6 +89,9 @@
<el-tooltip class="item" effect="dark" content="建议尺寸36*36" placement="top"> <el-tooltip class="item" effect="dark" content="建议尺寸36*36" placement="top">
<el-button size="mini" @click="choicImg=true,checkIndex=1">选择图片</el-button> <el-button size="mini" @click="choicImg=true,checkIndex=1">选择图片</el-button>
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="建议尺寸36*36" placement="top">
<el-button size="mini" @click="SetDefaultIcon()">默认图标</el-button>
</el-tooltip>
<div flex="main:center cross:center" class="notice-gallery-item"> <div flex="main:center cross:center" class="notice-gallery-item">
<img :src="getIconLink(data.icon)" style="width:100%;height:100%;" class="app-gallery-img" <img :src="getIconLink(data.icon)" style="width:100%;height:100%;" class="app-gallery-img"
draggable="false"> draggable="false">
...@@ -202,17 +204,22 @@ ...@@ -202,17 +204,22 @@
}, },
data() { data() {
return { return {
//默认公告图标
defaultIcon: this.domainManager().ImageUrl + '/Static/icon-notice.png',
choicImg: false, choicImg: false,
dialogVisible: false, dialogVisible: false,
data: this.noticeData.data, data: this.noticeData.data,
checkIndex: 0, checkIndex: 0,
}; };
}, },
created() { created() {
}, },
methods: { methods: {
//还原默认图标
SetDefaultIcon() {
this.data.icon=this.defaultIcon;
},
//向父组件传值 并调用排序 //向父组件传值 并调用排序
resetSord(IsUp) { resetSord(IsUp) {
this.$emit('getSord', this.index, IsUp); this.$emit('getSord', this.index, IsUp);
......
src/components/sallCenter/plugin/search.vue
View file @ 841e4d69
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="提示文字"> <el-form-item label="提示文字">
<el-input type="text" size="small" v-model="searchData.data.placeholder" maxlength="10"></el-input> <el-input type="text" size="small" v-model="searchData.data.placeholder" maxlength="30"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="文字颜色"> <el-form-item label="文字颜色">
<el-color-picker v-model="searchData.data.textColor" size="small"></el-color-picker> <el-color-picker v-model="searchData.data.textColor" size="small"></el-color-picker>
......
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