|
@@ -17,10 +17,10 @@
|
|
<Upload listType="picture-card" :url="form.audioBackgroundImage" @upload="upload($event, 'audioBackgroundImage')"
|
|
<Upload listType="picture-card" :url="form.audioBackgroundImage" @upload="upload($event, 'audioBackgroundImage')"
|
|
:disabled="disabled" />
|
|
:disabled="disabled" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item v-if="form.templateType == 1" label="页面排版:" style="width: 80%">
|
|
|
|
|
|
+ <el-form-item v-if="form.templateType == 1" label="页面排版:" style="min-width: 50%">
|
|
<el-button type="primary" icon="el-icon-plus" size="mini" @click="getAdd">添加</el-button>
|
|
<el-button type="primary" icon="el-icon-plus" size="mini" @click="getAdd">添加</el-button>
|
|
<el-table :data="form.contentShareLayoutList">
|
|
<el-table :data="form.contentShareLayoutList">
|
|
- <el-table-column label="布局类型" align="center" width="200px">
|
|
|
|
|
|
+ <el-table-column label="布局类型" align="center">
|
|
<template slot-scope="scope">
|
|
<template slot-scope="scope">
|
|
<el-select v-model="scope.row.layoutType" placeholder="请选择布局类型">
|
|
<el-select v-model="scope.row.layoutType" placeholder="请选择布局类型">
|
|
<el-option v-for="item in layoutOptions" :key="item.value" :value="item.value" :label="item.label" />
|
|
<el-option v-for="item in layoutOptions" :key="item.value" :value="item.value" :label="item.label" />
|
|
@@ -32,12 +32,7 @@
|
|
<Upload v-if="scope.row.layoutType === 0" listType="picture-card" :url="scope.row.contentPic"
|
|
<Upload v-if="scope.row.layoutType === 0" listType="picture-card" :url="scope.row.contentPic"
|
|
@upload="upload($event, `contentPic`, scope.$index)" :disabled="disabled" />
|
|
@upload="upload($event, `contentPic`, scope.$index)" :disabled="disabled" />
|
|
<el-input v-else v-model="scope.row.contentName" placeholder="请选择内容" readonly
|
|
<el-input v-else v-model="scope.row.contentName" placeholder="请选择内容" readonly
|
|
- @focus="getDialog(scope.row.layoutType, scope.$index)" />
|
|
|
|
- </template>
|
|
|
|
- </el-table-column>
|
|
|
|
- <el-table-column label="链接" align="center">
|
|
|
|
- <template slot-scope="scope">
|
|
|
|
- <el-input v-if="scope.row.layoutType === 2" v-model="scope.row.forwardUrl" placeholder="请输入链接" />
|
|
|
|
|
|
+ @focus="getDialog(scope.row.layoutType, scope.$index)" :title="scope.row.contentName" />
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
<el-table-column label="排序" align="center">
|
|
<el-table-column label="排序" align="center">
|
|
@@ -52,6 +47,16 @@
|
|
</el-table-column>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-table>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
|
+ <el-form-item label="分享标题:">
|
|
|
|
+ <el-input v-model="form.shareTitle" placeholder="请输入分享标题" />
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="分享描述:">
|
|
|
|
+ <el-input v-model="form.shareDescription" type="textarea" :rows="5" placeholder="请输入分享描述" />
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="分享图片:">
|
|
|
|
+ <Upload listType="picture-card" :url="form.shareIcon" @upload="upload($event, 'shareIcon')"
|
|
|
|
+ :disabled="disabled" />
|
|
|
|
+ </el-form-item>
|
|
<el-form-item label="是否开启按钮:">
|
|
<el-form-item label="是否开启按钮:">
|
|
<el-switch v-model="form.isButton" :active-value="1" :inactive-value="0" />
|
|
<el-switch v-model="form.isButton" :active-value="1" :inactive-value="0" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
@@ -61,7 +66,7 @@
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-row v-if="form.isButton == 1" style="width: 100%">
|
|
<el-row v-if="form.isButton == 1" style="width: 100%">
|
|
- <el-col :span="12">
|
|
|
|
|
|
+ <el-col :span="8">
|
|
<el-form-item label="左按钮文案:">
|
|
<el-form-item label="左按钮文案:">
|
|
<el-input v-model="form.leftButtonText" placeholder="请输入按钮文案" />
|
|
<el-input v-model="form.leftButtonText" placeholder="请输入按钮文案" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
@@ -75,13 +80,13 @@
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item v-if="form.leftButtonForwardType === 1" label="内容添加:">
|
|
<el-form-item v-if="form.leftButtonForwardType === 1" label="内容添加:">
|
|
- <el-input v-model="form.leftButtonContentName" readonly placeholder="请选择内容" />
|
|
|
|
|
|
+ <el-input v-model="form.leftButtonContentName" readonly placeholder="请选择内容" @focus="getDialog(2, -1)" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item v-if="form.leftButtonForwardType === 0" label="跳转链接:">
|
|
<el-form-item v-if="form.leftButtonForwardType === 0" label="跳转链接:">
|
|
<el-input v-model="form.leftButtonForwardUrl" placeholder="请输入跳转链接" />
|
|
<el-input v-model="form.leftButtonForwardUrl" placeholder="请输入跳转链接" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-col>
|
|
- <el-col :span="12">
|
|
|
|
|
|
+ <el-col :span="8">
|
|
<el-form-item label="右按钮文案:">
|
|
<el-form-item label="右按钮文案:">
|
|
<el-input v-model="form.rightButtonText" placeholder="请输入按钮文案" />
|
|
<el-input v-model="form.rightButtonText" placeholder="请输入按钮文案" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
@@ -95,23 +100,13 @@
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item v-if="form.rightButtonForwardType === 1" label="内容添加:">
|
|
<el-form-item v-if="form.rightButtonForwardType === 1" label="内容添加:">
|
|
- <el-input v-model="form.rightButtonContentName" readonly placeholder="请选择内容" />
|
|
|
|
|
|
+ <el-input v-model="form.rightButtonContentName" readonly placeholder="请选择内容" @focus="getDialog(2, -2)" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item v-if="form.rightButtonForwardType === 0" label="跳转链接:">
|
|
<el-form-item v-if="form.rightButtonForwardType === 0" label="跳转链接:">
|
|
<el-input v-model="form.rightButtonForwardUrl" placeholder="请输入跳转链接" />
|
|
<el-input v-model="form.rightButtonForwardUrl" placeholder="请输入跳转链接" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-col>
|
|
</el-row>
|
|
</el-row>
|
|
- <el-form-item label="分享标题:">
|
|
|
|
- <el-input v-model="form.shareTitle" placeholder="请输入分享标题" />
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="分享描述:">
|
|
|
|
- <el-input v-model="form.shareDescription" type="textarea" :rows="5" placeholder="请输入分享描述" />
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="分享图片:">
|
|
|
|
- <Upload listType="picture-card" :url="form.shareIcon" @upload="upload($event, 'shareIcon')"
|
|
|
|
- :disabled="disabled" />
|
|
|
|
- </el-form-item>
|
|
|
|
</el-form>
|
|
</el-form>
|
|
<div style="margin-left: 110px;">
|
|
<div style="margin-left: 110px;">
|
|
<el-button @click="close">取消</el-button>
|
|
<el-button @click="close">取消</el-button>
|
|
@@ -138,7 +133,7 @@
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item label="付费类型:">
|
|
<el-form-item label="付费类型:">
|
|
- <el-select v-model="dialogForm.payType" placeholder="请选择付费类型" clearable>
|
|
|
|
|
|
+ <el-select v-model="dialogForm.isFree" placeholder="请选择付费类型" clearable>
|
|
<el-option v-for="item in freeOptions" :key="item.value" :value="item.value" :label="item.label" />
|
|
<el-option v-for="item in freeOptions" :key="item.value" :value="item.value" :label="item.label" />
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
@@ -242,11 +237,22 @@ export default {
|
|
// 弹窗列表
|
|
// 弹窗列表
|
|
tableData: [],
|
|
tableData: [],
|
|
// 页面排版索引
|
|
// 页面排版索引
|
|
- index: 0,
|
|
|
|
|
|
+ index: -1,
|
|
// 只读
|
|
// 只读
|
|
disabled: Boolean(this.$route.query.boolean)
|
|
disabled: Boolean(this.$route.query.boolean)
|
|
}
|
|
}
|
|
},
|
|
},
|
|
|
|
+ watch: {
|
|
|
|
+ async 'dialogForm.audioType'(val) {
|
|
|
|
+ if (val) {
|
|
|
|
+ await this.getPlatform({
|
|
|
|
+ audioType: val
|
|
|
|
+ })
|
|
|
|
+ this.dialogForm.platformId = this.platformOptions[0].value
|
|
|
|
+ this.getList()
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
mounted() {
|
|
mounted() {
|
|
if (this.form.id) {
|
|
if (this.form.id) {
|
|
this.getDetail()
|
|
this.getDetail()
|
|
@@ -297,12 +303,8 @@ export default {
|
|
value: 15,
|
|
value: 15,
|
|
label: '音乐专辑'
|
|
label: '音乐专辑'
|
|
}]
|
|
}]
|
|
- this.dialogForm.audioType = this.audioOptions[0].value
|
|
|
|
- this.getPlatform({
|
|
|
|
- audioType: this.dialogForm.audioType
|
|
|
|
- })
|
|
|
|
|
|
+ this.$set(this.dialogForm, 'audioType', this.audioOptions[0].value)
|
|
this.dialogVisible = true
|
|
this.dialogVisible = true
|
|
- this.getList()
|
|
|
|
this.index = index
|
|
this.index = index
|
|
},
|
|
},
|
|
|
|
|
|
@@ -329,19 +331,28 @@ export default {
|
|
this.dialogForm = {
|
|
this.dialogForm = {
|
|
pageNum: 1,
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
pageSize: 10,
|
|
- audioType: this.audioOptions[0].value
|
|
|
|
|
|
+ audioType: this.audioOptions[0].value,
|
|
|
|
+ platformId: this.platformOptions[0].value
|
|
}
|
|
}
|
|
this.getList()
|
|
this.getList()
|
|
},
|
|
},
|
|
|
|
|
|
// 选择
|
|
// 选择
|
|
getChecked(row) {
|
|
getChecked(row) {
|
|
- let e = this.form.contentShareLayoutList[this.index]
|
|
|
|
- this.$set(e, 'contentId', row.audioId)
|
|
|
|
- this.$set(e, 'contentName', row.audioName)
|
|
|
|
- this.$set(e, 'contentPic', row.audioPic)
|
|
|
|
- this.$set(e, 'contentType', row.audioType)
|
|
|
|
- this.$set(e, 'platformId', row.platformId)
|
|
|
|
|
|
+ if (this.index >= 0) {
|
|
|
|
+ let e = this.form.contentShareLayoutList[this.index]
|
|
|
|
+ this.$set(e, 'contentId', row.audioId)
|
|
|
|
+ this.$set(e, 'contentName', row.audioName)
|
|
|
|
+ this.$set(e, 'contentPic', row.audioPic)
|
|
|
|
+ this.$set(e, 'contentType', row.audioType)
|
|
|
|
+ this.$set(e, 'platformId', row.platformId)
|
|
|
|
+ } else {
|
|
|
|
+ let e = this.index == -1 ? 'left' : 'right'
|
|
|
|
+ this.$set(this.form, `${e}ButtonContentId`, row.audioId)
|
|
|
|
+ this.$set(this.form, `${e}ButtonContentName`, row.audioName)
|
|
|
|
+ this.$set(this.form, `${e}ButtonContentType`, row.audioType)
|
|
|
|
+ this.$set(this.form, `${e}ButtonPlatformId`, row.platformId)
|
|
|
|
+ }
|
|
this.$message.success('选择成功!')
|
|
this.$message.success('选择成功!')
|
|
this.dialogVisible = false
|
|
this.dialogVisible = false
|
|
},
|
|
},
|
|
@@ -387,4 +398,5 @@ export default {
|
|
.el-form-item {
|
|
.el-form-item {
|
|
width: 500px;
|
|
width: 500px;
|
|
}
|
|
}
|
|
-}</style>
|
|
|
|
|
|
+}
|
|
|
|
+</style>
|