Skip to content

E
ElectricitySheep
Commit d17472ad authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

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