|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<!--
|
|
|
|
|
模块type: banner | introduce | form | forms | column | columns | history | customList
|
|
|
|
|
-->
|
|
|
|
|
<el-dialog title="模块管理"
|
|
|
|
|
:visible.sync="visible"
|
|
|
|
|
width="700px"
|
|
|
|
|
custom-class="module"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
:before-close="close">
|
|
|
|
|
<template v-if="data.type === 'banner' || data.type === 'introduce' || data.type === 'label' || data.type === 'customList'">
|
|
|
|
|
<el-table v-if="data.type === 'label'"
|
|
|
|
|
class="module-table"
|
|
|
|
|
:data="data.list"
|
|
|
|
|
header-align="center"
|
|
|
|
|
row-key="id">
|
|
|
|
|
<el-table-column type="index"
|
|
|
|
|
width="60"
|
|
|
|
|
label="序号"
|
|
|
|
|
align="center"></el-table-column>
|
|
|
|
|
<el-table-column prop="title"
|
|
|
|
|
label="标题"
|
|
|
|
|
min-width="140"
|
|
|
|
|
align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-input v-model="scope.row.title"
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
maxlength="100"></el-input>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作"
|
|
|
|
|
width="60"
|
|
|
|
|
align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<div class="flex j-center a-center">
|
|
|
|
|
<i class="el-icon-delete del"
|
|
|
|
|
@click="delRow(data.list, scope.$index)"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<el-table v-else-if="data.type === 'customList'"
|
|
|
|
|
class="module-table"
|
|
|
|
|
:data="data.list"
|
|
|
|
|
header-align="center"
|
|
|
|
|
row-key="id">
|
|
|
|
|
<el-table-column type="index"
|
|
|
|
|
width="60"
|
|
|
|
|
label="序号"
|
|
|
|
|
align="center"></el-table-column>
|
|
|
|
|
<el-table-column v-for="(item, i) in data.forms"
|
|
|
|
|
:key="i"
|
|
|
|
|
:prop="item.prop"
|
|
|
|
|
:label="item.label"
|
|
|
|
|
min-width="120"
|
|
|
|
|
align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-input v-model="scope.row[item.prop]"
|
|
|
|
|
:placeholder="'请输入' + item.label"
|
|
|
|
|
maxlength="100"></el-input>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作"
|
|
|
|
|
width="60"
|
|
|
|
|
align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<div class="flex j-center a-center">
|
|
|
|
|
<i class="el-icon-delete del"
|
|
|
|
|
@click="delRow(data.list, scope.$index)"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<el-table v-else
|
|
|
|
|
class="module-table"
|
|
|
|
|
:data="data.list"
|
|
|
|
|
header-align="center"
|
|
|
|
|
row-key="id">
|
|
|
|
|
<el-table-column type="index"
|
|
|
|
|
width="60"
|
|
|
|
|
label="序号"
|
|
|
|
|
align="center"></el-table-column>
|
|
|
|
|
<el-table-column v-if="!data.notPic"
|
|
|
|
|
label="图片"
|
|
|
|
|
min-width="140"
|
|
|
|
|
align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-upload v-if="data.type === 'banner'"
|
|
|
|
|
class="uploader"
|
|
|
|
|
accept=".jpg,.png,.jpeg"
|
|
|
|
|
:on-success="res => uploadSuccess(res, scope.row)"
|
|
|
|
|
:show-file-list="false"
|
|
|
|
|
:headers="headers"
|
|
|
|
|
:action="api.upload">
|
|
|
|
|
<img v-if="scope.row.pic"
|
|
|
|
|
:src="scope.row.pic"
|
|
|
|
|
class="avatar">
|
|
|
|
|
<div class="uploader-default"
|
|
|
|
|
v-else>
|
|
|
|
|
<i class="el-icon-plus"></i>
|
|
|
|
|
<p>上传图片</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div slot="tip"
|
|
|
|
|
class="el-upload__tip">
|
|
|
|
|
<p>只支持.jpg,.png格式</p>
|
|
|
|
|
</div>
|
|
|
|
|
</el-upload>
|
|
|
|
|
<template v-else>
|
|
|
|
|
<img v-if="scope.row.pic"
|
|
|
|
|
:src="scope.row.pic"
|
|
|
|
|
class="upload-pic">
|
|
|
|
|
<div class="upload-none"
|
|
|
|
|
v-else>
|
|
|
|
|
<i class="el-icon-picture-outline"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column v-if="data.type === 'introduce'"
|
|
|
|
|
prop="title"
|
|
|
|
|
label="标题"
|
|
|
|
|
min-width="140"
|
|
|
|
|
align="center"></el-table-column>
|
|
|
|
|
<el-table-column label="链接"
|
|
|
|
|
min-width="140"
|
|
|
|
|
align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<div class="link-wrap">
|
|
|
|
|
<span>{{ scope.row.link.linkName }}</span>
|
|
|
|
|
<el-button v-if="data.type === 'banner'"
|
|
|
|
|
class="set-link"
|
|
|
|
|
type="primary"
|
|
|
|
|
size="mini"
|
|
|
|
|
@click="toLink(scope.row, scope.$index)">设置链接</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作"
|
|
|
|
|
width="100"
|
|
|
|
|
align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<div class="flex a-center">
|
|
|
|
|
<el-switch v-model="scope.row.isEnable"
|
|
|
|
|
:active-value="1"
|
|
|
|
|
:inactive-value="0">
|
|
|
|
|
</el-switch>
|
|
|
|
|
<i v-if="data.type === 'introduce'"
|
|
|
|
|
class="el-icon-edit-outline del"
|
|
|
|
|
@click="editIntro(scope.row, scope.$index)"></i>
|
|
|
|
|
<i class="el-icon-delete del"
|
|
|
|
|
@click="delRow(data.list, scope.$index)"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<div class="plus">
|
|
|
|
|
<i class="el-icon-circle-plus-outline"
|
|
|
|
|
@click="addRow"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<el-form v-else-if="data.type === 'form' || data.type === 'forms'"
|
|
|
|
|
ref="form"
|
|
|
|
|
:model="data.form"
|
|
|
|
|
:rules="rules"
|
|
|
|
|
label-width="60px">
|
|
|
|
|
<el-form-item v-for="(item, i) in data.forms"
|
|
|
|
|
:key="i"
|
|
|
|
|
:prop="item.prop"
|
|
|
|
|
:label="item.label">
|
|
|
|
|
<el-input v-if="item.type === 'input'"
|
|
|
|
|
v-model="data.form[item.prop]"
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
maxlength="100"></el-input>
|
|
|
|
|
<el-input v-if="item.type === 'textarea'"
|
|
|
|
|
v-model="data.form[item.prop]"
|
|
|
|
|
type="textarea"
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
maxlength="300"></el-input>
|
|
|
|
|
<div v-if="item.type === 'upload' || item.type === 'video' || item.type === 'media'"
|
|
|
|
|
class="uploader-wrap">
|
|
|
|
|
<el-upload class="uploader"
|
|
|
|
|
accept=".jpg,.png,.jpeg"
|
|
|
|
|
:on-success="res => uploadSuccess(res, data.form)"
|
|
|
|
|
:show-file-list="false"
|
|
|
|
|
:headers="headers"
|
|
|
|
|
:action="api.upload">
|
|
|
|
|
<img v-if="data.form.pic && !isVideo(data.form.mediaType)"
|
|
|
|
|
:src="data.form.pic"
|
|
|
|
|
class="avatar">
|
|
|
|
|
<div class="uploader-default"
|
|
|
|
|
v-else>
|
|
|
|
|
<i class="el-icon-plus"></i>
|
|
|
|
|
<p>上传图片</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div slot="tip"
|
|
|
|
|
class="el-upload__tip">
|
|
|
|
|
<p>只支持.jpg,.png,.mp4格式</p>
|
|
|
|
|
</div>
|
|
|
|
|
</el-upload>
|
|
|
|
|
<el-upload v-if="item.type === 'video'"
|
|
|
|
|
accept=".mp4,.mov,.avi"
|
|
|
|
|
:on-success="res => uploadSuccess(res, data.form, item)"
|
|
|
|
|
:before-remove="beforeRemove"
|
|
|
|
|
:on-remove="(file, fileList) => handleRemove(file, fileList, data.form, item.prop)"
|
|
|
|
|
:file-list="fileList"
|
|
|
|
|
:headers="headers"
|
|
|
|
|
:action="api.upload">
|
|
|
|
|
<el-button>上传视频</el-button>
|
|
|
|
|
</el-upload>
|
|
|
|
|
<!-- 图片视频都可上传 -->
|
|
|
|
|
<el-upload v-if="item.type === 'media'"
|
|
|
|
|
:on-success="res => uploadSuccess(res, data.form, item)"
|
|
|
|
|
:before-remove="beforeRemove"
|
|
|
|
|
:on-remove="(file, fileList) => handleRemove(file, fileList, data.form, item.prop)"
|
|
|
|
|
:file-list="fileList"
|
|
|
|
|
:headers="headers"
|
|
|
|
|
:action="api.upload">
|
|
|
|
|
<el-button>上传资源</el-button>
|
|
|
|
|
</el-upload>
|
|
|
|
|
<i v-if="!item.required"
|
|
|
|
|
class="el-icon-delete del"
|
|
|
|
|
@click="data.form[item.prop] = ''"></i>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-if="item.type === 'link'"
|
|
|
|
|
class="flex">
|
|
|
|
|
<el-input class="m-r-10"
|
|
|
|
|
v-model="data.form.link.linkName"></el-input>
|
|
|
|
|
<el-button @click="toLink(data.form)">设置链接</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<Editor v-if="item.type === 'editor'"
|
|
|
|
|
api-key='rnk6zw9v267xqz7pf98twt1vmrvltmd436je7a642pckltda'
|
|
|
|
|
v-model="data.form[item.prop]"
|
|
|
|
|
:init="editorConfig" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<el-form v-else-if="data.type === 'column' || data.type === 'columns'"
|
|
|
|
|
ref="form"
|
|
|
|
|
:model="data.form"
|
|
|
|
|
:rules="columnRules"
|
|
|
|
|
label-width="100px">
|
|
|
|
|
<el-form-item prop="site"
|
|
|
|
|
label="站点选择">
|
|
|
|
|
<el-select v-model="data.form.site"
|
|
|
|
|
@change="siteChange">
|
|
|
|
|
<el-option v-for="item in $refs.link.sites"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
:label="item.siteName"
|
|
|
|
|
:value="item.id">
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item prop="column"
|
|
|
|
|
label="关联栏目">
|
|
|
|
|
<el-cascader ref="links"
|
|
|
|
|
v-model="data.form.column"
|
|
|
|
|
:options="columns"
|
|
|
|
|
:props="columnProps"
|
|
|
|
|
clearable
|
|
|
|
|
@change="columnChange"></el-cascader>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="文章展示数量">
|
|
|
|
|
<el-select v-model="data.form.articleNum">
|
|
|
|
|
<el-option v-for="item in articleNums"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
:label="item.name"
|
|
|
|
|
:value="item.id">
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="栏目标题">
|
|
|
|
|
<el-radio v-model="data.form.columnTitle"
|
|
|
|
|
:label="1"
|
|
|
|
|
@change="columnTitleChange">默认读取关联栏目</el-radio>
|
|
|
|
|
<div class="radio-wrap">
|
|
|
|
|
<el-radio v-model="data.form.columnTitle"
|
|
|
|
|
:label="2"
|
|
|
|
|
@change="columnTitleChange"></el-radio>
|
|
|
|
|
<el-input v-model="data.form.columnTitleCustom"
|
|
|
|
|
:disabled="data.form.columnTitle == 1"
|
|
|
|
|
size="small"
|
|
|
|
|
maxlength="10"></el-input>
|
|
|
|
|
</div>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<template v-else-if="data.type === 'history'">
|
|
|
|
|
<el-table class="module-table"
|
|
|
|
|
:data="data.list"
|
|
|
|
|
header-align="center"
|
|
|
|
|
row-key="id">
|
|
|
|
|
<el-table-column type="index"
|
|
|
|
|
width="60"
|
|
|
|
|
label="序号"
|
|
|
|
|
align="center"></el-table-column>
|
|
|
|
|
<el-table-column prop="title"
|
|
|
|
|
label="标题"
|
|
|
|
|
min-width="140"
|
|
|
|
|
align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-input v-model="scope.row.title"
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
maxlength="100"></el-input>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作"
|
|
|
|
|
width="100"
|
|
|
|
|
align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<div class="flex a-center">
|
|
|
|
|
<el-switch v-model="scope.row.isEnable"
|
|
|
|
|
:active-value="1"
|
|
|
|
|
:inactive-value="0">
|
|
|
|
|
</el-switch>
|
|
|
|
|
<i class="el-icon-edit-outline del"
|
|
|
|
|
@click="editHistory(scope.row, scope.$index)"></i>
|
|
|
|
|
<i class="el-icon-delete del"
|
|
|
|
|
@click="delRow(data.list, scope.$index)"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<div class="plus">
|
|
|
|
|
<i class="el-icon-circle-plus-outline"
|
|
|
|
|
@click="addRow"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<span slot="footer"
|
|
|
|
|
class="dialog-footer">
|
|
|
|
|
<el-button @click="$emit('update:visible', false)">取消</el-button>
|
|
|
|
|
<el-button type="primary"
|
|
|
|
|
@click="moduleSubmit">确定</el-button>
|
|
|
|
|
</span>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
<Link ref="link"
|
|
|
|
|
:data.sync="linkForm"
|
|
|
|
|
:visible.sync="linkVisible"
|
|
|
|
|
@linkSubmit="linkSubmit" />
|
|
|
|
|
<Content :data.sync="data"
|
|
|
|
|
:visible.sync="contentVisible"
|
|
|
|
|
@contentSubmit="contentSubmit" />
|
|
|
|
|
<History :data.sync="data"
|
|
|
|
|
:list.sync="historyData"
|
|
|
|
|
:form.sync="data.form"
|
|
|
|
|
:visible.sync="historyVisible"
|
|
|
|
|
@historySubmit="historySubmit" />
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import Link from '@/components/modules/link'
|
|
|
|
|
import Content from '@/components/modules/content'
|
|
|
|
|
import History from '@/components/modules/history'
|
|
|
|
|
import Editor from '@tinymce/tinymce-vue'
|
|
|
|
|
import Setting from '@/setting'
|
|
|
|
|
import Util from '@/libs/util'
|
|
|
|
|
import editorConfig from '@/components/editor'
|
|
|
|
|
import { mapActions } from 'vuex'
|
|
|
|
|
export default {
|
|
|
|
|
name: 'module',
|
|
|
|
|
props: ['data', 'visible'],
|
|
|
|
|
components: {
|
|
|
|
|
Link,
|
|
|
|
|
Content,
|
|
|
|
|
Editor,
|
|
|
|
|
History
|
|
|
|
|
},
|
|
|
|
|
data () {
|
|
|
|
|
return {
|
|
|
|
|
site: this.$store.state.content.site,
|
|
|
|
|
headers: {
|
|
|
|
|
token: Util.local.get(Setting.tokenKey)
|
|
|
|
|
},
|
|
|
|
|
isVideo: Util.isVideo,
|
|
|
|
|
rules: {},
|
|
|
|
|
linkVisible: false,
|
|
|
|
|
linkForm: {},
|
|
|
|
|
curIndex: 0,
|
|
|
|
|
editorConfig,
|
|
|
|
|
|
|
|
|
|
columnRules: {
|
|
|
|
|
site: [
|
|
|
|
|
{ required: true, message: '请选择站点', trigger: 'change' }
|
|
|
|
|
],
|
|
|
|
|
column: [
|
|
|
|
|
{ required: true, message: '请选择关联栏目', trigger: 'change' }
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
columns: [],
|
|
|
|
|
articleNums: [
|
|
|
|
|
{
|
|
|
|
|
id: '',
|
|
|
|
|
name: '默认'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
id: 4,
|
|
|
|
|
name: '4'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
id: 3,
|
|
|
|
|
name: '3'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
id: 2,
|
|
|
|
|
name: '2'
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
fileList: [],
|
|
|
|
|
columnProps: {
|
|
|
|
|
checkStrictly: true,
|
|
|
|
|
value: 'id',
|
|
|
|
|
label: 'columnName'
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
contentVisible: false,
|
|
|
|
|
curModule: 0,
|
|
|
|
|
curData: {},
|
|
|
|
|
|
|
|
|
|
historyVisible: false,
|
|
|
|
|
historyData: []
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
visible (open) {
|
|
|
|
|
// 每次打开的时候处理参数
|
|
|
|
|
open && this.handleForm()
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted () {
|
|
|
|
|
this.handleForm()
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
...mapActions("user", [
|
|
|
|
|
'logout'
|
|
|
|
|
]),
|
|
|
|
|
// 处理form表单参数
|
|
|
|
|
handleForm () {
|
|
|
|
|
const { type, forms, form } = this.data
|
|
|
|
|
if (type === 'form') {
|
|
|
|
|
forms.map(e => {
|
|
|
|
|
if (e.type === 'video' || e.type === 'media') {
|
|
|
|
|
this.fileList = [
|
|
|
|
|
{
|
|
|
|
|
name: form.fileName,
|
|
|
|
|
url: form.video || e.pic
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
}
|
|
|
|
|
// 加必填
|
|
|
|
|
if (e.required) {
|
|
|
|
|
this.rules[e.prop] = [
|
|
|
|
|
{
|
|
|
|
|
required: true,
|
|
|
|
|
message: `请${e.type === 'input' ? '输入' : '选择'}${e.label}`,
|
|
|
|
|
trigger: e.type === 'input' ? 'blur' : 'change'
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
if (type === 'column' && form.articleNumOpt) {
|
|
|
|
|
const nums = [
|
|
|
|
|
{
|
|
|
|
|
id: '',
|
|
|
|
|
name: '默认'
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
for (let i = form.articleNumOpt; i > 1; i--) {
|
|
|
|
|
nums.push({
|
|
|
|
|
id: i,
|
|
|
|
|
name: i
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
this.articleNums = nums
|
|
|
|
|
}
|
|
|
|
|
form && form.site && this.siteChange(form.site)
|
|
|
|
|
},
|
|
|
|
|
// 站点切换回调
|
|
|
|
|
siteChange (siteId) {
|
|
|
|
|
this.$post(this.api.listWithTree, {
|
|
|
|
|
siteId,
|
|
|
|
|
columnName: '',
|
|
|
|
|
templateId: '',
|
|
|
|
|
typeId: '',
|
|
|
|
|
isSort: 1
|
|
|
|
|
}).then(({ data }) => {
|
|
|
|
|
this.data.type === 'columns' || this.handleColumn(data)
|
|
|
|
|
this.columns = data
|
|
|
|
|
}).catch(err => { })
|
|
|
|
|
},
|
|
|
|
|
// 递归处理栏目
|
|
|
|
|
handleColumn (data) {
|
|
|
|
|
data.map(e => {
|
|
|
|
|
// if (e.typeId === 2 || e.typeId === 3) e.disabled = true
|
|
|
|
|
e.children.length ? this.handleColumn(e.children) : (delete e.children)
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
// 栏目切换回调
|
|
|
|
|
columnChange (val) {
|
|
|
|
|
this.data.form.columnName = this.$refs.links.getCheckedNodes()[0].label
|
|
|
|
|
},
|
|
|
|
|
// 栏目标题切换回调
|
|
|
|
|
columnTitleChange (val) {
|
|
|
|
|
const { form } = this.data
|
|
|
|
|
const checked = this.$refs.links.getCheckedNodes()
|
|
|
|
|
form.columnName = val === 2 ? form.columnTitleCustom : (checked.length ? checked[0].label : '')
|
|
|
|
|
},
|
|
|
|
|
// 添加行
|
|
|
|
|
addRow () {
|
|
|
|
|
const { type } = this.data
|
|
|
|
|
if (type === 'banner' || type === 'label' || type === 'customList') {
|
|
|
|
|
this.data.list.push(JSON.parse(JSON.stringify(this.data.originForm)))
|
|
|
|
|
} else if (type === 'history') {
|
|
|
|
|
this.data.list.push(JSON.parse(JSON.stringify(this.data.historyForm)))
|
|
|
|
|
} else {
|
|
|
|
|
this.editIntro(this.data.originForm, -1)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
close () {
|
|
|
|
|
this.$emit('update:visible', false)
|
|
|
|
|
},
|
|
|
|
|
// 上传成功
|
|
|
|
|
uploadSuccess (res, row, item = {}) {
|
|
|
|
|
if (res.code === 401) {
|
|
|
|
|
Util.errorMsg("登录过期，请重新登录");
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.logout()
|
|
|
|
|
}, 1000)
|
|
|
|
|
} else {
|
|
|
|
|
this.$set(row, item.type === 'video' ? 'video' : 'pic', res.url)
|
|
|
|
|
this.$set(row, 'mediaType', res.original.substr(res.original.lastIndexOf('.') + 1))
|
|
|
|
|
this.$set(row, 'fileName', res.original)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
beforeRemove (file, fileList) {
|
|
|
|
|
return this.$confirm(`确定移除 ${file.name}？`);
|
|
|
|
|
},
|
|
|
|
|
handleRemove (file, fileList, form, prop) {
|
|
|
|
|
form[prop] = ''
|
|
|
|
|
form.fileName = ''
|
|
|
|
|
},
|
|
|
|
|
// 删除行（通用）
|
|
|
|
|
delRow (list, i) {
|
|
|
|
|
this.$confirm('确定要删除吗？', '提示', {
|
|
|
|
|
type: 'warning'
|
|
|
|
|
}).then(() => {
|
|
|
|
|
list.splice(i, 1)
|
|
|
|
|
}).catch(() => { })
|
|
|
|
|
},
|
|
|
|
|
// 展示链接设置
|
|
|
|
|
toLink (row, i = 0) {
|
|
|
|
|
if (!row.link.linkName) {
|
|
|
|
|
row.link = {
|
|
|
|
|
linkName: '无',
|
|
|
|
|
connectionType: 1,
|
|
|
|
|
columnId: [],
|
|
|
|
|
articleId: '',
|
|
|
|
|
linkAddress: '',
|
|
|
|
|
site: this.site.id,
|
|
|
|
|
otherColumnId: [],
|
|
|
|
|
otherArticleId: '',
|
|
|
|
|
isOpen: 1
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
this.curIndex = i
|
|
|
|
|
this.linkForm = row.link
|
|
|
|
|
this.linkVisible = true
|
|
|
|
|
},
|
|
|
|
|
// 编辑内容
|
|
|
|
|
editIntro (row, i = 0) {
|
|
|
|
|
this.data.form = JSON.parse(JSON.stringify(row))
|
|
|
|
|
this.curModule = i
|
|
|
|
|
this.contentVisible = true
|
|
|
|
|
},
|
|
|
|
|
// content设置提交
|
|
|
|
|
contentSubmit () {
|
|
|
|
|
this.contentVisible = false
|
|
|
|
|
const { form } = this.data
|
|
|
|
|
if (this.curModule === -1) {
|
|
|
|
|
this.data.list.push(JSON.parse(JSON.stringify(this.data.form)))
|
|
|
|
|
} else {
|
|
|
|
|
const list = this.data.list[this.curModule]
|
|
|
|
|
for (const i in form) {
|
|
|
|
|
this.$set(list, i, form[i])
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
this.data.form = JSON.parse(JSON.stringify(this.data.originForm))
|
|
|
|
|
},
|
|
|
|
|
// 链接设置提交
|
|
|
|
|
linkSubmit () {
|
|
|
|
|
const el = this.$refs.link
|
|
|
|
|
const data = this.data.form ? this.data.form.link : this.data.list[this.curIndex].link
|
|
|
|
|
let name
|
|
|
|
|
// 站内链接
|
|
|
|
|
if (data.connectionType === 1) {
|
|
|
|
|
if (!data.columnId.length) return Util.errorMsg('请选择站内链接')
|
|
|
|
|
// 如果选择了文章，则取文章标题作为链接名称，否则取栏目标题
|
|
|
|
|
if (data.articleId) {
|
|
|
|
|
const item = el.articles.find(e => e.id == data.articleId)
|
|
|
|
|
name = item ? item.title : ''
|
|
|
|
|
} else {
|
|
|
|
|
name = el.$refs.column.getCheckedNodes()[0].pathLabels.join('/')
|
|
|
|
|
}
|
|
|
|
|
} else if (data.connectionType === 3) { // 其他站点链接
|
|
|
|
|
if (!data.otherColumnId.length) return Util.errorMsg('请选择栏目')
|
|
|
|
|
// 如果选择了文章，则取文章标题作为链接名称，否则取栏目标题
|
|
|
|
|
if (data.otherArticleId) {
|
|
|
|
|
const item = el.articles.find(e => e.id == data.otherArticleId)
|
|
|
|
|
name = item ? item.title : ''
|
|
|
|
|
} else {
|
|
|
|
|
name = el.$refs.otherColumn.getCheckedNodes()[0].pathLabels.join('/')
|
|
|
|
|
}
|
|
|
|
|
} else { // 站外链接
|
|
|
|
|
if (!data.linkAddress) return Util.errorMsg('请输入站外链接')
|
|
|
|
|
name = data.linkAddress
|
|
|
|
|
}
|
|
|
|
|
data.linkName = name
|
|
|
|
|
this.linkVisible = false
|
|
|
|
|
},
|
|
|
|
|
// 编辑history
|
|
|
|
|
editHistory (row, i = 0) {
|
|
|
|
|
this.historyData = row.list
|
|
|
|
|
this.curModule = i
|
|
|
|
|
this.historyVisible = true
|
|
|
|
|
},
|
|
|
|
|
// history设置提交
|
|
|
|
|
historySubmit () {
|
|
|
|
|
this.historyVisible = false
|
|
|
|
|
},
|
|
|
|
|
// 模块设置提交
|
|
|
|
|
moduleSubmit () {
|
|
|
|
|
this.$emit('moduleSubmit')
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.radio-wrap {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
.el-input {
|
|
|
|
|
width: 200px;
|
|
|
|
|
margin-left: -40px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
