|
|
@@ -41,7 +41,7 @@
|
|
|
@click="
|
|
|
(isShowSelectionWindow = true),
|
|
|
(selectingFor = 'pc'),
|
|
|
- (upType = 'image')
|
|
|
+ (upType = 'image'),(upTypeSta='imgBac')
|
|
|
"
|
|
|
>
|
|
|
{{ $i18n.t(`edit_settings.select_image`) }}
|
|
|
@@ -87,7 +87,7 @@
|
|
|
@click="
|
|
|
(isShowSelectionWindow = true),
|
|
|
(selectingFor = 'mobile'),
|
|
|
- (upType = 'image')
|
|
|
+ (upType = 'image'),(upTypeSta='imgBac')
|
|
|
"
|
|
|
>
|
|
|
{{ $i18n.t(`edit_settings.select_image`) }}
|
|
|
@@ -139,7 +139,6 @@
|
|
|
:style="`background-color: ${imgColorSelec};`"
|
|
|
></div>
|
|
|
<ColorPicker
|
|
|
- show-alpha
|
|
|
@change="imgColorSelecChange"
|
|
|
v-model="imgColorSelec"
|
|
|
:predefine="predefineColors"
|
|
|
@@ -160,7 +159,7 @@
|
|
|
@click="
|
|
|
(isShowSelectionWindow = true),
|
|
|
(selectingFor = 'bac'),
|
|
|
- (upType = 'image')
|
|
|
+ (upType = 'image'),(upTypeSta='imgBac')
|
|
|
"
|
|
|
>
|
|
|
{{ $i18n.t(`edit_settings.select_image`) }}
|
|
|
@@ -196,7 +195,7 @@
|
|
|
@click="
|
|
|
(isShowSelectionWindow = true),
|
|
|
(selectingFor = 'pc'),
|
|
|
- (upType = 'video')
|
|
|
+ (upType = 'video'),(upTypeSta='videoBac')
|
|
|
"
|
|
|
>
|
|
|
{{ $i18n.t(`edit_settings.select_video`) }}
|
|
|
@@ -204,7 +203,7 @@
|
|
|
<!-- 上传提示 -->
|
|
|
<div
|
|
|
class="ui-remark"
|
|
|
- v-html="$i18n.t(`edit_settings.coverUpTit1`)"
|
|
|
+ v-html="$i18n.t(`edit_settings.coverUpTit4`)"
|
|
|
></div>
|
|
|
<!-- 选择居中和全屏 -->
|
|
|
<div class="coverImglocBox">
|
|
|
@@ -242,7 +241,7 @@
|
|
|
@click="
|
|
|
(isShowSelectionWindow = true),
|
|
|
(selectingFor = 'mobile'),
|
|
|
- (upType = 'video')
|
|
|
+ (upType = 'video'),(upTypeSta='videoBac')
|
|
|
"
|
|
|
>
|
|
|
{{ $i18n.t(`edit_settings.select_video`) }}
|
|
|
@@ -250,7 +249,7 @@
|
|
|
<!-- 上传提示 -->
|
|
|
<div
|
|
|
class="ui-remark"
|
|
|
- v-html="$i18n.t(`edit_settings.coverUpTit2`)"
|
|
|
+ v-html="$i18n.t(`edit_settings.coverUpTit5`)"
|
|
|
></div>
|
|
|
<!-- 选择居中和全屏 -->
|
|
|
<div class="coverImglocBox">
|
|
|
@@ -273,6 +272,60 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
+ <!-- 视频背景设置 -->
|
|
|
+ <div class="coverImgBacBox">
|
|
|
+ <div class="tit">{{ $i18n.t(`edit_settings.coverImgBacTit`) }}</div>
|
|
|
+ <Select v-model="coverVideoBac">
|
|
|
+ <Option
|
|
|
+ v-for="item in coverImgBacList"
|
|
|
+ :key="item.type"
|
|
|
+ :label="item.txt"
|
|
|
+ :value="item.type"
|
|
|
+ >
|
|
|
+ </Option>
|
|
|
+ </Select>
|
|
|
+ <!-- 选择颜色 -->
|
|
|
+ <div class="imgColorSelec" v-show="coverVideoBac === 'colorFill'">
|
|
|
+ <div class="ll">{{ videoColorSelec }}</div>
|
|
|
+ <div
|
|
|
+ class="rr"
|
|
|
+ :style="`background-color: ${videoColorSelec};`"
|
|
|
+ ></div>
|
|
|
+ <ColorPicker
|
|
|
+ @change="videoColorSelecChange"
|
|
|
+ v-model="videoColorSelec"
|
|
|
+ :predefine="predefineColors"
|
|
|
+ >
|
|
|
+ </ColorPicker>
|
|
|
+ </div>
|
|
|
+ <!-- 选择背景图片 -->
|
|
|
+ <div class="imgClolrBacImg" v-show="coverVideoBac === 'imgTile'">
|
|
|
+ <SelectedImage
|
|
|
+ :imgSrc="info.videoBacImg"
|
|
|
+ :defaultImgSrc="require('@/assets/img/coverUpTit1.png')"
|
|
|
+ @cancel="onCancelBac2"
|
|
|
+ ></SelectedImage>
|
|
|
+ <!-- 上传图片按钮 -->
|
|
|
+ <div class="imgRight">
|
|
|
+ <button
|
|
|
+ class="ui-button submit"
|
|
|
+ @click="
|
|
|
+ (isShowSelectionWindow = true),
|
|
|
+ (selectingFor = 'bac'),
|
|
|
+ (upType = 'image'),
|
|
|
+ (upTypeSta='videoBac')
|
|
|
+ "
|
|
|
+ >
|
|
|
+ {{ $i18n.t(`edit_settings.select_image`) }}
|
|
|
+ </button>
|
|
|
+ <div
|
|
|
+ class="ui-remark"
|
|
|
+ v-html="$i18n.t(`edit_settings.coverUpTit3`)"
|
|
|
+ ></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="dialog" style="z-index: 2000" v-if="isShowSelectionWindow">
|
|
|
@@ -313,6 +366,7 @@ export default {
|
|
|
coverImgLoc2: i18n.t("edit_settings.coverImgLoc2"),
|
|
|
|
|
|
upType: "",
|
|
|
+ upTypeSta:'',
|
|
|
|
|
|
selecList: [
|
|
|
{
|
|
|
@@ -356,6 +410,7 @@ export default {
|
|
|
videoMoLoc: "centen",
|
|
|
// 视频的背景设置
|
|
|
coverVideoBac: "colorFill",
|
|
|
+ videoColorSelec: "#c71585",
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
|
|
@@ -376,6 +431,9 @@ export default {
|
|
|
coverImgBac(val) {
|
|
|
this.info.coverImgBac = val;
|
|
|
},
|
|
|
+ coverVideoBac(val) {
|
|
|
+ this.info.coverVideoBac = val;
|
|
|
+ },
|
|
|
videoPcLoc(val) {
|
|
|
this.info.videoPcLoc = val;
|
|
|
},
|
|
|
@@ -389,9 +447,13 @@ export default {
|
|
|
this.imgColorSelec = val;
|
|
|
this.info.imgColorSelec = val;
|
|
|
},
|
|
|
+ videoColorSelecChange(val) {
|
|
|
+ this.videoColorSelec = val;
|
|
|
+ this.info.videoColorSelec = val;
|
|
|
+ },
|
|
|
handleSubmitFromMaterialSelector(selected) {
|
|
|
// 点击确定的时候是选择的图片上传
|
|
|
- if (this.upType === "image") {
|
|
|
+ if (this.upTypeSta === "imgBac") {
|
|
|
if (this.selectingFor === "pc") this.info.coverPc = selected[0].icon;
|
|
|
else if (this.selectingFor === "mobile")
|
|
|
this.info.coverMo = selected[0].icon;
|
|
|
@@ -401,6 +463,7 @@ export default {
|
|
|
if (this.selectingFor === "pc") this.info.videoPc = selected[0].icon;
|
|
|
else if (this.selectingFor === "mobile")
|
|
|
this.info.videoMo = selected[0].icon;
|
|
|
+ else this.info.videoBacImg = selected[0].icon;
|
|
|
}
|
|
|
this.isShowSelectionWindow = false;
|
|
|
},
|
|
|
@@ -420,6 +483,9 @@ export default {
|
|
|
claerVideoMo() {
|
|
|
this.info.videoMo = "";
|
|
|
},
|
|
|
+ onCancelBac2() {
|
|
|
+ this.info.videoBacImg = "";
|
|
|
+ },
|
|
|
},
|
|
|
created() {},
|
|
|
mounted() {
|
|
|
@@ -428,6 +494,9 @@ export default {
|
|
|
if (this.info.coverMoLoc) this.coverMoLoc = this.info.coverMoLoc;
|
|
|
if (this.info.coverImgBac) this.coverImgBac = this.info.coverImgBac;
|
|
|
if (this.info.imgColorSelec) this.imgColorSelec = this.info.imgColorSelec;
|
|
|
+ if (this.info.videoPcLoc) this.videoPcLoc = this.info.videoPcLoc;
|
|
|
+ if (this.info.videoMoLoc) this.videoMoLoc = this.info.videoMoLoc;
|
|
|
+ if (this.info.coverVideoBac) this.coverVideoBac = this.info.coverVideoBac;
|
|
|
},
|
|
|
beforeCreate() {}, //生命周期 - 创建之前
|
|
|
beforeMount() {}, //生命周期 - 挂载之前
|
