添加3个长页

master
yujialong 2 years ago
parent fffb3a824c
commit 5a1cc031d7
  1. 471
      src/components/modules/module.vue
  2. 290
      src/const/modules.js
  3. 2
      src/mixins/page/index.js
  4. 163
      src/pages/column/page/contactUs.vue
  5. 146
      src/pages/column/page/speech.vue
  6. 195
      src/pages/column/page/talentCentre.vue
  7. 8
      src/router/modules/column.js

@ -3,214 +3,345 @@
<!-- <!--
模块type: banner | introduce | form | forms | column | columns | history 模块type: banner | introduce | form | forms | column | columns | history
--> -->
<el-dialog title="模块管理" :visible.sync="visible" width="700px" custom-class="module" :close-on-click-modal="false" :before-close="close"> <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'"> <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 v-if="data.type === 'label'"
<el-table-column type="index" width="60" label="序号" align="center"></el-table-column> class="module-table"
<el-table-column prop="title" label="标题" min-width="140" align="center"> :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"> <template slot-scope="scope">
<el-input v-model="scope.row.title" placeholder="请输入" maxlength="100"></el-input> <el-input v-model="scope.row.title"
placeholder="请输入"
maxlength="100"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="60" align="center"> <el-table-column label="操作"
width="60"
align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="flex j-center a-center"> <div class="flex j-center a-center">
<i class="el-icon-delete del" @click="delRow(data.list, scope.$index)"></i> <i class="el-icon-delete del"
@click="delRow(data.list, scope.$index)"></i>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-table v-else-if="data.type === 'customList'" class="module-table" :data="data.list" header-align="center" row-key="id"> <el-table v-else-if="data.type === 'customList'"
<el-table-column type="index" width="60" label="序号" align="center"></el-table-column> class="module-table"
<el-table-column v-for="(item, i) in data.forms" :key="i" :prop="item.prop" :label="item.label" min-width="120" align="center"> :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"> <template slot-scope="scope">
<el-input v-model="scope.row[item.prop]" :placeholder="'请输入' + item.label" maxlength="100"></el-input> <el-input v-model="scope.row[item.prop]"
:placeholder="'请输入' + item.label"
maxlength="100"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="60" align="center"> <el-table-column label="操作"
width="60"
align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="flex j-center a-center"> <div class="flex j-center a-center">
<i class="el-icon-delete del" @click="delRow(data.list, scope.$index)"></i> <i class="el-icon-delete del"
@click="delRow(data.list, scope.$index)"></i>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-table v-else class="module-table" :data="data.list" header-align="center" row-key="id"> <el-table v-else
<el-table-column type="index" width="60" label="序号" align="center"></el-table-column> class="module-table"
<el-table-column label="图片" min-width="140" align="center"> :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 label="图片"
min-width="140"
align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-upload <el-upload v-if="data.type === 'banner'"
v-if="data.type === 'banner'" class="uploader"
class="uploader" accept=".jpg,.png,.jpeg"
accept=".jpg,.png,.jpeg" :on-success="res => uploadSuccess(res, scope.row)"
:on-success="res => uploadSuccess(res, scope.row)" :show-file-list="false"
:show-file-list="false" :headers="headers"
:headers="headers" :action="api.upload">
:action="api.upload"> <img v-if="scope.row.pic"
<img v-if="scope.row.pic" :src="scope.row.pic" class="avatar"> :src="scope.row.pic"
<div class="uploader-default" v-else> class="avatar">
<i class="el-icon-plus"></i> <div class="uploader-default"
<p>上传图片</p> v-else>
</div> <i class="el-icon-plus"></i>
<div slot="tip" class="el-upload__tip"> <p>上传图片</p>
<p>只支持.jpg,.png格式</p> </div>
</div> <div slot="tip"
class="el-upload__tip">
<p>只支持.jpg,.png格式</p>
</div>
</el-upload> </el-upload>
<template v-else> <template v-else>
<img v-if="scope.row.pic" :src="scope.row.pic" class="upload-pic"> <img v-if="scope.row.pic"
<div class="upload-none" v-else> :src="scope.row.pic"
class="upload-pic">
<div class="upload-none"
v-else>
<i class="el-icon-picture-outline"></i> <i class="el-icon-picture-outline"></i>
</div> </div>
</template> </template>
</template> </template>
</el-table-column> </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 v-if="data.type === 'introduce'"
<el-table-column label="链接" min-width="140" align="center"> prop="title"
label="标题"
min-width="140"
align="center"></el-table-column>
<el-table-column label="链接"
min-width="140"
align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="link-wrap"> <div class="link-wrap">
<span>{{ scope.row.link.linkName }}</span> <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> <el-button v-if="data.type === 'banner'"
class="set-link"
type="primary"
size="mini"
@click="toLink(scope.row, scope.$index)">设置链接</el-button>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="100" align="center"> <el-table-column label="操作"
width="100"
align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="flex a-center"> <div class="flex a-center">
<el-switch <el-switch v-model="scope.row.isEnable"
v-model="scope.row.isEnable" :active-value="1"
:active-value="1" :inactive-value="0">
:inactive-value="0">
</el-switch> </el-switch>
<i v-if="data.type === 'introduce'" class="el-icon-edit-outline del" @click="editIntro(scope.row, scope.$index)"></i> <i v-if="data.type === 'introduce'"
<i class="el-icon-delete del" @click="delRow(data.list, scope.$index)"></i> 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> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div class="plus"> <div class="plus">
<i class="el-icon-circle-plus-outline" @click="addRow"></i> <i class="el-icon-circle-plus-outline"
@click="addRow"></i>
</div> </div>
</template> </template>
<el-form v-else-if="data.type === 'form' || data.type === 'forms'" ref="form" :model="data.form" :rules="rules" label-width="60px"> <el-form v-else-if="data.type === 'form' || data.type === 'forms'"
<el-form-item v-for="(item, i) in data.forms" :key="i" :prop="item.prop" :label="item.label"> ref="form"
<el-input v-if="item.type === 'input'" v-model="data.form[item.prop]" placeholder="请输入" maxlength="100"></el-input> :model="data.form"
<el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入" maxlength="300"></el-input> :rules="rules"
<div v-if="item.type === 'upload' || item.type === 'video' || item.type === 'media'" class="uploader-wrap"> label-width="60px">
<el-upload <el-form-item v-for="(item, i) in data.forms"
class="uploader" :key="i"
accept=".jpg,.png,.jpeg" :prop="item.prop"
:on-success="res => uploadSuccess(res, data.form)" :label="item.label">
:show-file-list="false" <el-input v-if="item.type === 'input'"
:headers="headers" v-model="data.form[item.prop]"
:action="api.upload"> placeholder="请输入"
<img v-if="data.form[item.prop]" :src="data.form[item.prop]" class="avatar"> maxlength="100"></el-input>
<div class="uploader-default" v-else> <el-input v-if="item.type === 'textarea'"
<i class="el-icon-plus"></i> v-model="data.form[item.prop]"
<p>上传图片</p> type="textarea"
</div> placeholder="请输入"
<div slot="tip" class="el-upload__tip"> maxlength="300"></el-input>
<p>只支持.jpg,.png,.mp4格式</p> <div v-if="item.type === 'upload' || item.type === 'video' || item.type === 'media'"
</div> 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>
<el-upload <el-upload v-if="item.type === 'video'"
v-if="item.type === 'video'" accept=".mp4,.mov,.avi"
accept=".mp4,.mov,.avi" :on-success="res => uploadSuccess(res, data.form, item)"
:on-success="res => uploadSuccess(res, data.form, item)" :before-remove="beforeRemove"
:file-list="fileList" :on-remove="(file, fileList) => handleRemove(file, fileList, data.form, item.prop)"
:headers="headers" :file-list="fileList"
:action="api.upload"> :headers="headers"
<el-button>上传视频</el-button> :action="api.upload">
<el-button>上传视频</el-button>
</el-upload> </el-upload>
<!-- 图片视频都可上传 --> <!-- 图片视频都可上传 -->
<el-upload <el-upload v-if="item.type === 'media'"
v-if="item.type === 'media'" :on-success="res => uploadSuccess(res, data.form, item)"
:on-success="res => uploadSuccess(res, data.form, item)" :before-remove="beforeRemove"
:file-list="fileList" :on-remove="(file, fileList) => handleRemove(file, fileList, data.form, item.prop)"
:headers="headers" :file-list="fileList"
:action="api.upload"> :headers="headers"
<el-button>上传资源</el-button> :action="api.upload">
<el-button>上传资源</el-button>
</el-upload> </el-upload>
<i v-if="!item.required" class="el-icon-delete del" @click="data.form[item.prop] = ''"></i> <i v-if="!item.required"
class="el-icon-delete del"
@click="data.form[item.prop] = ''"></i>
</div> </div>
<div v-if="item.type === 'link'" class="flex"> <div v-if="item.type === 'link'"
<el-input class="m-r-10" v-model="data.form.link.linkName"></el-input> class="flex">
<el-input class="m-r-10"
v-model="data.form.link.linkName"></el-input>
<el-button @click="toLink(data.form)">设置链接</el-button> <el-button @click="toLink(data.form)">设置链接</el-button>
</div> </div>
<Editor v-if="item.type === 'editor'" api-key='rnk6zw9v267xqz7pf98twt1vmrvltmd436je7a642pckltda' v-model="data.form[item.prop]" :init="editorConfig" /> <Editor v-if="item.type === 'editor'"
api-key='rnk6zw9v267xqz7pf98twt1vmrvltmd436je7a642pckltda'
v-model="data.form[item.prop]"
:init="editorConfig" />
</el-form-item> </el-form-item>
</el-form> </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 v-else-if="data.type === 'column' || data.type === 'columns'"
<el-form-item prop="site" label="站点选择"> ref="form"
<el-select v-model="data.form.site" @change="siteChange"> :model="data.form"
<el-option :rules="columnRules"
v-for="item in $refs.link.sites" label-width="100px">
:key="item.id" <el-form-item prop="site"
:label="item.siteName" label="站点选择">
:value="item.id"> <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-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="column" label="关联栏目"> <el-form-item prop="column"
<el-cascader label="关联栏目">
ref="links" <el-cascader ref="links"
v-model="data.form.column" v-model="data.form.column"
:options="columns" :options="columns"
:props="columnProps" :props="columnProps"
clearable clearable
@change="columnChange"></el-cascader> @change="columnChange"></el-cascader>
</el-form-item> </el-form-item>
<el-form-item label="文章展示数量"> <el-form-item label="文章展示数量">
<el-select v-model="data.form.articleNum"> <el-select v-model="data.form.articleNum">
<el-option <el-option v-for="item in articleNums"
v-for="item in articleNums" :key="item.id"
:key="item.id" :label="item.name"
:label="item.name" :value="item.id">
:value="item.id">
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="栏目标题"> <el-form-item label="栏目标题">
<el-radio v-model="data.form.columnTitle" :label="1" @change="columnTitleChange">默认读取关联栏目</el-radio> <el-radio v-model="data.form.columnTitle"
:label="1"
@change="columnTitleChange">默认读取关联栏目</el-radio>
<div class="radio-wrap"> <div class="radio-wrap">
<el-radio v-model="data.form.columnTitle" :label="2" @change="columnTitleChange"></el-radio> <el-radio v-model="data.form.columnTitle"
<el-input v-model="data.form.columnTitleCustom" :disabled="data.form.columnTitle == 1" size="small" maxlength="10"></el-input> :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> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
<template v-else-if="data.type === 'history'"> <template v-else-if="data.type === 'history'">
<el-table class="module-table" :data="data.list" header-align="center" row-key="id"> <el-table class="module-table"
<el-table-column type="index" width="60" label="序号" align="center"></el-table-column> :data="data.list"
<el-table-column prop="title" label="标题" min-width="140" align="center"> 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"> <template slot-scope="scope">
<el-input v-model="scope.row.title" placeholder="请输入" maxlength="100"></el-input> <el-input v-model="scope.row.title"
placeholder="请输入"
maxlength="100"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="100" align="center"> <el-table-column label="操作"
width="100"
align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="flex a-center"> <div class="flex a-center">
<el-switch <el-switch v-model="scope.row.isEnable"
v-model="scope.row.isEnable" :active-value="1"
:active-value="1" :inactive-value="0">
:inactive-value="0">
</el-switch> </el-switch>
<i class="el-icon-edit-outline del" @click="editHistory(scope.row, scope.$index)"></i> <i class="el-icon-edit-outline del"
<i class="el-icon-delete del" @click="delRow(data.list, scope.$index)"></i> @click="editHistory(scope.row, scope.$index)"></i>
<i class="el-icon-delete del"
@click="delRow(data.list, scope.$index)"></i>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div class="plus"> <div class="plus">
<i class="el-icon-circle-plus-outline" @click="addRow"></i> <i class="el-icon-circle-plus-outline"
@click="addRow"></i>
</div> </div>
</template> </template>
<span slot="footer" class="dialog-footer"> <span slot="footer"
class="dialog-footer">
<el-button @click="$emit('update:visible', false)">取消</el-button> <el-button @click="$emit('update:visible', false)">取消</el-button>
<el-button type="primary" @click="moduleSubmit">确定</el-button> <el-button type="primary"
@click="moduleSubmit">确定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<Link ref="link" :data.sync="linkForm" :visible.sync="linkVisible" @linkSubmit="linkSubmit" /> <Link ref="link"
<Content :data.sync="data" :visible.sync="contentVisible" @contentSubmit="contentSubmit" /> :data.sync="linkForm"
<History :data.sync="data" :list.sync="historyData" :form.sync="data.form" :visible.sync="historyVisible" @historySubmit="historySubmit" /> :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> </div>
</template> </template>
@ -222,6 +353,7 @@ import Editor from '@tinymce/tinymce-vue'
import Setting from '@/setting' import Setting from '@/setting'
import Util from '@/libs/util' import Util from '@/libs/util'
import editorConfig from '@/components/editor' import editorConfig from '@/components/editor'
import { mapActions } from 'vuex'
export default { export default {
name: 'module', name: 'module',
props: ['data', 'visible'], props: ['data', 'visible'],
@ -231,12 +363,13 @@ export default {
Editor, Editor,
History History
}, },
data() { data () {
return { return {
site: this.$store.state.content.site, site: this.$store.state.content.site,
headers: { headers: {
token: Util.local.get(Setting.tokenKey) token: Util.local.get(Setting.tokenKey)
}, },
isVideo: Util.isVideo,
rules: {}, rules: {},
linkVisible: false, linkVisible: false,
linkForm: {}, linkForm: {},
@ -286,20 +419,31 @@ export default {
}; };
}, },
watch: { watch: {
visible(open) { visible (open) {
// //
open && this.handleForm() open && this.handleForm()
} }
}, },
mounted() { mounted () {
this.handleForm() this.handleForm()
}, },
methods: { methods: {
...mapActions("user", [
'logout'
]),
// form // form
handleForm() { handleForm () {
const { type, forms, form } = this.data const { type, forms, form } = this.data
if (type === 'form') { if (type === 'form') {
forms.map(e => { forms.map(e => {
if (e.type === 'video' || e.type === 'media') {
this.fileList = [
{
name: form.fileName,
url: form.video || e.pic
}
]
}
// //
if (e.required) { if (e.required) {
this.rules[e.prop] = [ this.rules[e.prop] = [
@ -330,37 +474,37 @@ export default {
form && form.site && this.siteChange(form.site) form && form.site && this.siteChange(form.site)
}, },
// //
siteChange(siteId) { siteChange (siteId) {
this.$post(this.api.listWithTree, { this.$post(this.api.listWithTree, {
siteId, siteId,
columnName: '', columnName: '',
templateId: '', templateId: '',
typeId : '', typeId: '',
isSort: 1 isSort: 1
}).then(({ data }) => { }).then(({ data }) => {
this.data.type === 'columns' || this.handleColumn(data) this.data.type === 'columns' || this.handleColumn(data)
this.columns = data this.columns = data
}).catch(err => {}) }).catch(err => { })
}, },
// //
handleColumn(data) { handleColumn (data) {
data.map(e => { data.map(e => {
if (e.typeId === 2 || e.typeId === 3) e.disabled = true if (e.typeId === 2 || e.typeId === 3) e.disabled = true
e.children.length ? this.handleColumn(e.children) : (delete e.children) e.children.length ? this.handleColumn(e.children) : (delete e.children)
}) })
}, },
// //
columnChange(val) { columnChange (val) {
this.data.form.columnName = this.$refs.links.getCheckedNodes()[0].label this.data.form.columnName = this.$refs.links.getCheckedNodes()[0].label
}, },
// //
columnTitleChange(val) { columnTitleChange (val) {
const { form } = this.data const { form } = this.data
const checked = this.$refs.links.getCheckedNodes() const checked = this.$refs.links.getCheckedNodes()
form.columnName = val === 2 ? form.columnTitleCustom : (checked.length ? checked[0].label : '') form.columnName = val === 2 ? form.columnTitleCustom : (checked.length ? checked[0].label : '')
}, },
// //
addRow() { addRow () {
const { type } = this.data const { type } = this.data
if (type === 'banner' || type === 'label' || type === 'customList') { if (type === 'banner' || type === 'label' || type === 'customList') {
this.data.list.push(JSON.parse(JSON.stringify(this.data.originForm))) this.data.list.push(JSON.parse(JSON.stringify(this.data.originForm)))
@ -370,31 +514,46 @@ export default {
this.editIntro(this.data.originForm, -1) this.editIntro(this.data.originForm, -1)
} }
}, },
close() { close () {
this.$emit('update:visible', false) this.$emit('update:visible', false)
}, },
// //
uploadSuccess(res, row, item = {}) { uploadSuccess (res, row, item = {}) {
this.$set(row, item.type === 'video' ? 'video' : 'pic', res.url) if (res.code === 401) {
item.type === 'media' && this.$set(row, 'mediaType', res.title.substr(res.title.lastIndexOf('.') + 1)) 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) { delRow (list, i) {
this.$confirm('确定要删除吗?', '提示', { this.$confirm('确定要删除吗?', '提示', {
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
list.splice(i, 1) list.splice(i, 1)
}).catch(() => {}) }).catch(() => { })
}, },
// //
toLink(row, i = 0) { toLink (row, i = 0) {
if (!row.link.linkName) { if (!row.link.linkName) {
row.link = { row.link = {
linkName: '无', linkName: '无',
connectionType: 1, connectionType: 1,
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress: '',
site: this.site.id, site: this.site.id,
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
@ -406,13 +565,13 @@ export default {
this.linkVisible = true this.linkVisible = true
}, },
// //
editIntro(row, i = 0) { editIntro (row, i = 0) {
this.data.form = JSON.parse(JSON.stringify(row)) this.data.form = JSON.parse(JSON.stringify(row))
this.curModule = i this.curModule = i
this.contentVisible = true this.contentVisible = true
}, },
// content // content
contentSubmit() { contentSubmit () {
this.contentVisible = false this.contentVisible = false
const { form } = this.data const { form } = this.data
if (this.curModule === -1) { if (this.curModule === -1) {
@ -426,7 +585,7 @@ export default {
this.data.form = JSON.parse(JSON.stringify(this.data.originForm)) this.data.form = JSON.parse(JSON.stringify(this.data.originForm))
}, },
// //
linkSubmit() { linkSubmit () {
const el = this.$refs.link const el = this.$refs.link
const data = this.data.form ? this.data.form.link : this.data.list[this.curIndex].link const data = this.data.form ? this.data.form.link : this.data.list[this.curIndex].link
let name let name
@ -457,17 +616,17 @@ export default {
this.linkVisible = false this.linkVisible = false
}, },
// history // history
editHistory(row, i = 0) { editHistory (row, i = 0) {
this.historyData = row.list this.historyData = row.list
this.curModule = i this.curModule = i
this.historyVisible = true this.historyVisible = true
}, },
// history // history
historySubmit() { historySubmit () {
this.historyVisible = false this.historyVisible = false
}, },
// //
moduleSubmit() { moduleSubmit () {
this.$emit('moduleSubmit') this.$emit('moduleSubmit')
}, },
} }
@ -475,11 +634,11 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.radio-wrap { .radio-wrap {
display: flex; display: flex;
align-items: center; align-items: center;
.el-input { .el-input {
width: 200px; width: 200px;
margin-left: -40px; margin-left: -40px;
} }
} }
</style> </style>

@ -7946,4 +7946,294 @@ export default {
] ]
}, },
], ],
speech: [
{
type: 'form',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true
},
{
type: 'input',
prop: 'title',
label: '标题',
required: true
},
{
type: 'link',
prop: 'link',
label: '链接'
},
],
form: {
pic: 'http://10.10.11.7/images/speech/1.png',
title: '关于IASF/院长致辞',
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
}
}
},
{
type: 'form',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true
},
{
type: 'input',
prop: 'title',
label: '标题',
required: true
},
{
type: 'textarea',
prop: 'subTitle',
label: '小标题'
},
{
type: 'editor',
prop: 'des',
label: '描述'
}
],
form: {
pic: 'http://10.10.11.7/images/speech/3.png',
title: '院长致辞 ',
subTitle: 'President Speech ',
des: `各位朋友:
加快实现高水平科技自立自强是推动高质量发展的必由之路当前粤港澳大湾区正朝着建成具有全球影响力的科技和产业创新高地这一宏伟蓝图奋力前进而在大科学时代我们实现科学技术的前沿突破在产业发展上取得颠覆式创新和持续性创新从根本上解决气候变暖重大疾病挑等人类可持续发展问题上越来越离不开大科学装置的支持
建设综合粒子设施是深圳推进粤港澳大湾区深圳先行示范区建设重大战略落地实施以主阵地作为推进大湾区综合性国家科学中心建设的重要决策部署项目的建成不仅将成为支撑大湾区集成电路生物医药先进制造新材料新能源等众多产业领域创新发展的先进工具和强大平台也将是面向国家重大需求和国际科学前沿突破产业技术瓶颈解决其相关根源性科学问题的大国重器
综合粒子设施一期项目包括深圳产业光源和深圳自由电子激光自2021年初深圳综合粒子设施研究院筹备建立以来我们的首要任务便是全力推进两个项目的设计立项关键技术突破核心设备研制等前期准备工作为接下来工程建设及建成运行打下坚实基础
面对重重挑战我们坚信没有一座高山不可逾越我们将牢记深圳市委市政府设立研究院的初心和期望传承改革开放杀出一条血路的魄力万众一心迎难而上不负众望建设好综合粒子设施为全体深圳人民及合作伙伴交上一份优质答卷我们将秉持开放合作的建设理念面向国内外创新资源敞开共建共享共赢的合作大门携手大湾区创新资源共同建设世界一流大科学装置我们将坚持需求牵引的宗旨探索在地方政府主导下研究机构高校企业金融机构共建重大科技基础设施的新途径为粤港澳大湾区建设国际科技创新中心提供坚实支撑我们还将进一步加强与港澳的创新融合让科学进步之光照亮大湾区高质量发展之路点亮东方之珠璀璨的明天`
}
},
{
type: 'form',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true
},
],
form: {
pic: '',
}
},
],
talentCentre: [
{
type: 'form',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true
},
{
type: 'input',
prop: 'title',
label: '标题',
required: true
},
{
type: 'link',
prop: 'link',
label: '链接'
},
],
form: {
pic: 'http://10.10.11.7/images/talentCentre/1.png',
title: '人才中心',
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
}
}
},
{
type: 'form',
forms: [
{
type: 'input',
prop: 'title',
label: '标题',
required: true
},
{
type: 'editor',
prop: 'des',
label: '描述'
}
],
form: {
title: '有兴趣将科学转化为创新吗?在IASF建立你的职业生涯。',
des: `在IASF,我们从不同的角度看待世界。我们的科学家和工程师在清洁能源、环境、技术、国家安全等方面进行世界一流的研究。我们正在寻找创造性的方法来让世界为更美好的未来做好准备。
通过选择您感兴趣的机会类型开始`
}
},
{
type: 'form',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true
},
{
type: 'input',
prop: 'title',
label: '标题',
required: true
},
{
type: 'link',
prop: 'link',
label: '链接'
},
{
type: 'editor',
prop: 'des',
label: '描述'
},
],
form: {
pic: 'http://10.10.11.7/images/talentCentre/2.png',
title: '科学研究/工程技术类',
des: `描述`,
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
}
}
},
{
type: 'form',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true
},
{
type: 'input',
prop: 'title',
label: '标题',
required: true
},
{
type: 'link',
prop: 'link',
label: '链接'
},
{
type: 'editor',
prop: 'des',
label: '描述'
},
],
form: {
pic: 'http://10.10.11.7/images/talentCentre/3.png',
title: '管理服务类',
des: `描述`,
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
}
}
},
],
contactUs: [
{
type: 'form',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true
},
{
type: 'input',
prop: 'title',
label: '标题',
required: true
},
{
type: 'link',
prop: 'link',
label: '链接'
},
],
form: {
pic: 'http://10.10.11.7/images/contactUs/1.png',
title: '联系我们',
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
}
}
},
{
type: 'form',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true
},
],
form: {
pic: 'http://10.10.11.7/images/contactUs/2.png',
}
},
],
} }

@ -78,7 +78,7 @@ export default {
e.originForm = modules[i].originForm e.originForm = modules[i].originForm
} }
}) })
this.modules = list // this.modules = list
console.log("🚀 ~ file: index.js:85 ~ this.$post ~ list:", list) console.log("🚀 ~ file: index.js:85 ~ this.$post ~ list:", list)
} }
}).catch(err => {}) }).catch(err => {})

@ -0,0 +1,163 @@
<template>
<!-- 联系我们 -->
<div class="wrap">
<div class="actions">
<p class="page-name">页面设置/联系我们</p>
<div>
<el-button type="primary"
@click="preview">预览</el-button>
<el-button @click="save(0)">保存为草稿</el-button>
<el-button type="primary"
@click="save(1)">发布</el-button>
<el-button @click="back">放弃编辑</el-button>
</div>
</div>
<div class="modules">
<div class="relative">
<div class="single-banner">
<img class="banner-img"
:src="modules[0].form.pic"
alt="" />
<div class="texts">
<h6 class="banner-title">{{ modules[0].form.title }}</h6>
</div>
</div>
<div class="cover"
@click="toSet(0)">点击更换banner与链接</div>
</div>
<div class="block">
<div class="inner">
<div class="contact">
<div class="fields">
<h6>Contact us</h6>
<p class="text">发圣诞节快乐副驾驶打卡了分速度快了父级圣诞快乐</p>
<p class="text">发圣诞节快乐副驾驶打卡了分速度快了父级圣诞快乐</p>
<p class="text">发圣诞节快乐副驾驶打卡了分速度快了父级圣诞快乐</p>
</div>
<img src="http://10.10.11.7/images/contactUs/2.png"
alt=""
class="pic">
<el-table :data="list"
class="patent-table"
ref="table"
stripe
header-align="center">
<el-table-column prop="title"
label="部门"
align="center"
min-width="250"></el-table-column>
<el-table-column prop="publishingHouse"
label="联系人"
align="center"
min-width="100"></el-table-column>
<el-table-column prop="writersAndEditors"
label="电话"
align="center"
min-width="150"></el-table-column>
<el-table-column prop="publicationYear"
label="邮箱"
align="center"
min-width="150"></el-table-column>
</el-table>
</div>
</div>
</div>
</div>
<Module ref="module"
:data.sync="curData"
:visible.sync="diaVisible"
@moduleSubmit="moduleSubmit" />
</div>
</template>
<script>
import mixins from '@/mixins/page'
import Modules from '@/const/modules'
export default {
mixins: [mixins],
data () {
return {
modules: Modules.contactUs
}
},
mounted () {
this.$store.commit('user/setCrumbs', [
{
name: '站点管理',
route: '/site'
},
{
name: '内容管理',
route: '/column'
},
{
name: '栏目管理',
route: '/column'
},
{
name: '联系我们'
}
])
},
methods: {
}
};
</script>
<style lang="scss" scoped>
@import '../../../styles/page/page.scss';
.single-banner {
.banner-img {
height: 21.6rem;
}
.texts {
h6 {
font-size: 2.16rem;
margin-bottom: 0.95rem;
}
.banner-des {
font-size: 0.96rem;
}
}
}
.block {
padding: 2rem 0;
background: url(http://10.10.11.7/images/contactUs/3.png) 0 130px no-repeat,
url(http://10.10.11.7/images/contactUs/4.png) bottom right no-repeat;
background-color: #f7f8fa;
}
.inner {
.contact {
padding: 3rem 6rem;
background-color: #fff;
}
.fields {
position: relative;
padding: 2rem;
border: 4px solid #f9f9f9;
h6 {
position: absolute;
top: -16px;
left: 60px;
font-size: 1.1rem;
font-family: PingFangSC-Medium, PingFang SC;
color: #333;
background-color: #fff;
}
.text {
font-size: 1rem;
color: #333;
line-height: 1.6;
}
}
.pic {
width: 100%;
margin: 2rem 0 1.5rem;
}
}
</style>

@ -0,0 +1,146 @@
<template>
<!-- 院长致辞 -->
<div class="wrap">
<div class="actions">
<p class="page-name">页面设置/院长致辞</p>
<div>
<el-button type="primary"
@click="preview">预览</el-button>
<el-button @click="save(0)">保存为草稿</el-button>
<el-button type="primary"
@click="save(1)">发布</el-button>
<el-button @click="back">放弃编辑</el-button>
</div>
</div>
<div class="modules">
<div class="relative">
<div class="single-banner">
<img class="banner-img"
:src="modules[0].form.pic"
alt="" />
<div class="texts">
<h6 class="banner-title">{{ modules[0].form.title }}</h6>
</div>
</div>
<div class="cover"
@click="toSet(0)">点击更换banner与链接</div>
</div>
<div class="block">
<div class="inner">
<div class="c-wrap">
<img :src="modules[1].form.pic"
alt=""
class="pic">
<div class="texts">
<h6>{{ modules[1].form.title }}</h6>
<p class="en">{{ modules[1].form.subTitle }}</p>
<div class="text"
v-html="modules[1].form.des"></div>
</div>
<div class="cover"
@click="toSet(1)">点击更换图片标题小标题与概述</div>
</div>
</div>
<div class="sign c-wrap">
签名
<img :src="modules[2].form.pic"
alt="">
<div class="cover"
@click="toSet(2)">点击更换签名</div>
</div>
</div>
</div>
<Module ref="module"
:data.sync="curData"
:visible.sync="diaVisible"
@moduleSubmit="moduleSubmit" />
</div>
</template>
<script>
import mixins from '@/mixins/page'
import Modules from '@/const/modules'
export default {
mixins: [mixins],
data () {
return {
modules: Modules.speech
}
},
mounted () {
this.$store.commit('user/setCrumbs', [
{
name: '站点管理',
route: '/site'
},
{
name: '内容管理',
route: '/column'
},
{
name: '栏目管理',
route: '/column'
},
{
name: '院长致辞'
}
])
},
methods: {
}
};
</script>
<style lang="scss" scoped>
@import '../../../styles/page/page.scss';
.block {
background: url(http://10.10.11.7/images/speech/2.png) no-repeat;
}
.inner {
display: flex;
align-items: flex-start;
.pic {
max-width: 480px;
margin-top: 2rem;
}
.texts {
margin-left: 113px;
}
h6 {
position: relative;
font-size: 2rem;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 600;
color: #333;
}
.en {
margin: -25px 0 40px;
font-size: 2.2rem;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: rgba(216, 216, 216, 0.34);
}
.text {
font-size: 1rem;
color: #333;
line-height: 1.6;
}
}
.sign {
width: 1400px;
min-height: 150px;
margin: 20px auto 0;
text-align: right;
img {
max-width: 150px;
}
.cover {
left: auto;
width: 300px;
}
}
</style>

@ -0,0 +1,195 @@
<template>
<!-- 人才中心 -->
<div class="wrap">
<div class="actions">
<p class="page-name">页面设置/人才中心</p>
<div>
<el-button type="primary"
@click="preview">预览</el-button>
<el-button @click="save(0)">保存为草稿</el-button>
<el-button type="primary"
@click="save(1)">发布</el-button>
<el-button @click="back">放弃编辑</el-button>
</div>
</div>
<div class="modules">
<div class="relative">
<div class="single-banner single-banner-overview">
<img class="banner-img"
:src="modules[0].form.pic"
alt="">
<div class="texts">
<h6 class="banner-title">{{ modules[0].form.title }}</h6>
</div>
</div>
<div class="cover"
@click="toSet(0)">点击更换banner与链接</div>
</div>
<div class="content">
<div class="article">
<div class="left">
<div class="c-wrap">
<h6 class="talent-title">{{ modules[1].form.title }}</h6>
<div class="talent-text"
v-html="modules[1].form.des"></div>
<div class="cover"
@click="toSet(1)">点击更换标题与概述</div>
</div>
<ul class="people">
<li>
<img class="pic"
:src="modules[2].form.pic"
alt="">
<div class="texts">
<h6>{{ modules[2].form.title }}</h6>
<div class="line"></div>
<div class="text"
v-html="modules[2].form.des"></div>
<img src="@/assets/images/arrow.png"
alt="">
</div>
<div class="cover"
@click="toSet(2)">点击更换图片标题概述与链接</div>
</li>
<li>
<img class="pic"
:src="modules[3].form.pic"
alt="">
<div class="texts">
<h6>{{ modules[3].form.title }}</h6>
<div class="line"></div>
<div class="text"
v-html="modules[3].form.des"></div>
<img src="@/assets/images/arrow.png"
alt="">
</div>
<div class="cover"
@click="toSet(3)">点击更换图片标题概述与链接</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<Module ref="module"
:data.sync="curData"
:visible.sync="diaVisible"
@moduleSubmit="moduleSubmit" />
</div>
</template>
<script>
import mixins from '@/mixins/page'
import Modules from '@/const/modules'
export default {
mixins: [mixins],
data () {
return {
modules: Modules.talentCentre
}
},
mounted () {
this.$store.commit('user/setCrumbs', [
{
name: '站点管理',
route: '/site'
},
{
name: '内容管理',
route: '/column'
},
{
name: '栏目管理',
route: '/column'
},
{
name: '人才中心'
}
])
},
methods: {
}
};
</script>
<style lang="scss" scoped>
@import '../../../styles/page/page.scss';
.content {
margin-top: 20px;
background-color: #fff;
}
.article {
display: flex;
justify-content: center;
.left {
width: 80%;
.talent-title {
padding-bottom: 10px;
font-size: 1.2rem;
color: #666;
border-bottom: 1px solid #eaeef2;
}
.talent-text {
margin: 20px 0;
font-size: 1.1rem;
color: #333;
line-height: 28px;
p {
margin-bottom: 20px;
}
}
}
.people {
margin-top: 4rem;
li {
position: relative;
display: flex;
align-items: center;
margin-bottom: 2rem;
&:nth-child(even) {
flex-direction: row-reverse;
.texts {
padding: 75px 83px 75px 40px;
margin: 0 -50px 0 0;
}
}
}
.pic {
width: 430px;
height: 430px;
}
.texts {
position: relative;
width: 530px;
height: 330px;
padding: 75px 41px 75px 83px;
margin-left: -50px;
background-color: rgba(247, 247, 247, 0.72);
}
h6 {
font-size: 1.2rem;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #333;
}
.line {
width: 93px;
height: 1px;
margin: 1rem 0;
background: #d8d8d8;
}
.text {
font-size: 1rem;
font-family: PingFangSC-Regular, PingFang SC;
color: #666;
line-height: 1.6;
}
}
}
</style>

@ -213,5 +213,13 @@ export default {
path: `researchTeam`, path: `researchTeam`,
component: () => import('@/pages/column/page/researchTeam'), component: () => import('@/pages/column/page/researchTeam'),
}, },
{
path: `speech`,
component: () => import('@/pages/column/page/speech'),
},
{
path: `talentCentre`,
component: () => import('@/pages/column/page/talentCentre'),
},
] ]
} }

Loading…
Cancel
Save