master
yujialong 2 years ago
parent d0bbcda86c
commit 15efbd83c6
  1. 61
      public/editor.css
  2. 23
      src/components/img-upload/Cropper.vue
  3. 38
      src/components/modules/content.vue
  4. 11
      src/components/modules/link.vue
  5. 74
      src/components/modules/module.vue
  6. 4
      src/const/column.js
  7. 43
      src/mixins/page/index.js
  8. 212
      src/pages/account/login/index.vue
  9. 102
      src/pages/article/add/editor.js
  10. 156
      src/pages/article/add/index.vue
  11. 47
      src/pages/article/list/index.vue
  12. 118
      src/pages/column/add/index.vue
  13. 14
      src/pages/column/list/index.vue
  14. 392
      src/pages/column/page/about.vue
  15. 240
      src/pages/column/page/careers.vue
  16. 122
      src/pages/column/page/edu.vue
  17. 341
      src/pages/column/page/home.vue
  18. 337
      src/pages/column/page/news.vue
  19. 61
      src/pages/column/page/newsPress.vue
  20. 3
      src/pages/user/list/index.vue
  21. 2
      src/router/permission.js
  22. 15
      src/styles/common.scss
  23. 7
      src/styles/page/page.scss

@ -0,0 +1,61 @@
.mce-content-body:not([dir=rtl]) blockquote {
padding: 8px 15px;
border-left: 0;
background-color: #ededed;
}
.tiny-wrap {
width: 900px;
margin: 0 auto;
}
.tiny-wrap blockquote p {
margin: 0;
font-style: italic;
}
.tiny-wrap .block {
margin-bottom: 20px;
overflow: hidden;
}
.tiny-wrap .block .fl {
float: left;
margin: 0 20px 0 0;
}
.tiny-wrap .block .fr {
float: right;
margin: 0 0 0 20px;
}
.tiny-wrap .block p {
margin: 0 0 10px;
font-size: 19px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #101010;
line-height: 32px;
}
.tiny-wrap .block .tiny-title {
margin: 10px 0;
font-size: 24px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #101010;
line-height: 32px;
}
.tiny-wrap .quote {
padding: 15px;
font-size: 14px;
font-style: italic;
border: 1px solid #e3e3e3;
background-color: #f1f1f1;
}
.tiny-wrap .img-wrap {
text-align: center;
}
.tiny-wrap .img-wrap img {
max-width: 600px;
max-height: 600px;
}
.tiny-wrap .block .img-des {
margin: 10px 0 0;
font-size: 14px;
color: #8d8d8d;
text-align: center;
}

@ -16,8 +16,8 @@
:auto-crop="option.autoCrop" :auto-crop="option.autoCrop"
:auto-crop-width="option.autoCropWidth" :auto-crop-width="option.autoCropWidth"
:auto-crop-height="option.autoCropHeight" :auto-crop-height="option.autoCropHeight"
:fixed-box="fixedBox" :fixed-box="option.fixedBox"
:fixed="fixed" :fixed="option.fixed"
:fixed-number="fixedNumber" :fixed-number="fixedNumber"
@realTime="realTime" /> @realTime="realTime" />
<!-- <vueCropper ref="cropper" :img="option.img" :outputSize="option.size" :outputType="option.outputType"></vueCropper> --> <!-- <vueCropper ref="cropper" :img="option.img" :outputSize="option.size" :outputType="option.outputType"></vueCropper> -->
@ -46,7 +46,7 @@
:loading="isUpload" :loading="isUpload"
:disabled="isDisabled" :disabled="isDisabled"
@click.prevent="uploadImg('base64')"> @click.prevent="uploadImg('base64')">
{{ '上传' | transLoading(isUpload) }} 上传
</el-button> </el-button>
</div> </div>
</div> </div>
@ -75,6 +75,11 @@ export default {
default: () => { default: () => {
return { url: '', size: 10 } return { url: '', size: 10 }
} }
},
//
fixedNumber: {
type: Array,
default: [1, 0.26]
} }
}, },
data() { data() {
@ -89,11 +94,11 @@ export default {
original: false, // (:false) original: false, // (:false)
canMoveBox: true, // (:true) canMoveBox: true, // (:true)
autoCrop: true, // (:false) autoCrop: true, // (:false)
// autoCropWidth: 480, // (:80%) autoCropWidth: 480, // (:80%)
// autoCropHeight: 320, // (:80%) autoCropHeight: 124, // (:80%)
fixedBox: false, // (:false) fixedBox: false, // (:false)
fixed: true, // (:true) fixed: true, // (:true)
fixedNumber: [1.5, 1], // (:[1:1]) fixedNumber: [1, 0.26], // (:[1:1])
enlarge: 1 enlarge: 1
}, },
isDisabled: false isDisabled: false
@ -113,9 +118,9 @@ export default {
// //
this.$refs.cropper.rotateRight() this.$refs.cropper.rotateRight()
}, },
updateImg() { updateImg(file) {
this.option.img = this.imgFile.url this.option.img = file.url
this.option.size = this.imgFile.size / 1024 > 200 ? 0.9 : 0.95 this.option.size = file.size / 1024 > 200 ? 0.9 : 0.95
}, },
realTime(data) { realTime(data) {
// //

@ -2,10 +2,10 @@
<!-- 内容 --> <!-- 内容 -->
<div> <div>
<el-dialog title="编辑内容" :visible.sync="visible" width="600px" custom-class="module" :close-on-click-modal="false" :before-close="close"> <el-dialog title="编辑内容" :visible.sync="visible" width="600px" custom-class="module" :close-on-click-modal="false" :before-close="close">
<el-form ref="form" :model="data.form" :rules="rules" label-width="80px"> <el-form 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-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="30"></el-input> <el-input v-if="item.type === 'input'" v-model="data.form[item.prop]" placeholder="请输入" maxlength="30"></el-input>
<el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入" maxlength="50"></el-input> <el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入" maxlength="300"></el-input>
<el-upload <el-upload
v-if="item.type === 'upload'" v-if="item.type === 'upload'"
class="uploader" class="uploader"
@ -107,21 +107,31 @@ export default {
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
const linkEle = data.connectionType === 1 ? let name
el.$refs.column : //
data.connectionType === 3 ? if (data.connectionType === 1) {
el.$refs.otherColumn : if (!data.columnId.length) return Util.errorMsg('请选择站内链接')
null //
if (data.connectionType !== 2) { if (data.articleId) {
if (data.connectionType === 1) { const item = el.articles.find(e => e.id == data.articleId)
if (!data.columnId.length) return Util.errorMsg('请选择站内链接') name = item ? item.title : ''
} else {
name = el.$refs.column.getCheckedNodes()[0].pathLabels.join('/')
} }
if (data.connectionType === 3) { } else if (data.connectionType === 3) { //
if (!data.otherColumnId.length) return Util.errorMsg('请选择栏目') 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 = linkEle ? linkEle.getCheckedNodes()[0].pathLabels.join('/') : data.linkAddress data.linkName = name
console.log("🚀 ~ file: module.vue ~ line 296 ~ linkSubmit ~ data", this.data)
this.linkVisible = false this.linkVisible = false
}, },
// //

@ -1,7 +1,7 @@
<template> <template>
<!-- 设置链接 --> <!-- 设置链接 -->
<div> <div>
<el-dialog title="设置链接地址" :visible.sync="visible" width="500px" :close-on-click-modal="false"> <el-dialog title="设置链接地址" :visible.sync="visible" width="500px" :close-on-click-modal="false" :before-close="close">
<el-form :model="data" class="model" label-width="120px"> <el-form :model="data" class="model" label-width="120px">
<el-form-item prop="connectionType" label="连接类型"> <el-form-item prop="connectionType" label="连接类型">
<el-radio-group v-model="data.connectionType"> <el-radio-group v-model="data.connectionType">
@ -18,7 +18,6 @@
v-model="data.columnId" v-model="data.columnId"
:options="columns" :options="columns"
:props="columnProps" :props="columnProps"
clearable
@change="columnChange"></el-cascader> @change="columnChange"></el-cascader>
</el-form-item> </el-form-item>
<el-form-item label="文章"> <el-form-item label="文章">
@ -40,8 +39,8 @@
></el-input> ></el-input>
</el-form-item> </el-form-item>
<template v-if="data.connectionType === 3"> <template v-if="data.connectionType === 3">
<el-form-item prop="siteSelection" label="站点选择"> <el-form-item prop="site" label="站点选择">
<el-select v-model="data.siteSelection"> <el-select v-model="data.site">
<el-option <el-option
v-for="item in sites" v-for="item in sites"
:key="item.id" :key="item.id"
@ -56,7 +55,6 @@
v-model="data.otherColumnId" v-model="data.otherColumnId"
:options="columns" :options="columns"
:props="columnProps" :props="columnProps"
clearable
@change="columnChange"></el-cascader> @change="columnChange"></el-cascader>
</el-form-item> </el-form-item>
<el-form-item label="文章"> <el-form-item label="文章">
@ -178,6 +176,9 @@ export default {
this.sites = data.records this.sites = data.records
}).catch(e => {}) }).catch(e => {})
}, },
close() {
this.$emit('update:visible', false)
},
// //
linkSubmit() { linkSubmit() {
this.$emit('linkSubmit') this.$emit('linkSubmit')

@ -1,7 +1,7 @@
<template> <template>
<!-- banner --> <!-- banner -->
<div> <div>
<el-dialog title="Banner模块管理" :visible.sync="visible" width="600px" 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'"> <template v-if="data.type === 'banner' || data.type === 'introduce'">
<el-table class="module-table" :data="data.list" header-align="center" row-key="id"> <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 type="index" width="60" label="序号" align="center"></el-table-column>
@ -41,7 +41,7 @@
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="100"> <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
@ -58,10 +58,10 @@
<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'" ref="form" :model="data.form" :rules="rules" label-width="80px"> <el-form v-else-if="data.type === 'form'" 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-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="30"></el-input> <el-input v-if="item.type === 'input'" v-model="data.form[item.prop]" placeholder="请输入" maxlength="30"></el-input>
<el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入" maxlength="50"></el-input> <el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入" maxlength="300"></el-input>
<el-upload <el-upload
v-if="item.type === 'upload'" v-if="item.type === 'upload'"
class="uploader" class="uploader"
@ -102,7 +102,8 @@
v-model="data.form.column" v-model="data.form.column"
:options="columns" :options="columns"
:props="columnProps" :props="columnProps"
clearable></el-cascader> clearable
@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">
@ -118,7 +119,7 @@
<el-radio v-model="data.form.columnTitle" :label="1">默认读取关联栏目</el-radio> <el-radio v-model="data.form.columnTitle" :label="1">默认读取关联栏目</el-radio>
<div class="radio-wrap"> <div class="radio-wrap">
<el-radio v-model="data.form.columnTitle" :label="2"></el-radio> <el-radio v-model="data.form.columnTitle" :label="2"></el-radio>
<el-input v-model="data.form.columnTitleCustom" size="small" maxlength="10"></el-input> <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>
@ -204,9 +205,11 @@ export default {
methods: { methods: {
// form // form
handleForm() { handleForm() {
const { type, forms } = this.data const { type, forms, form } = this.data
console.log("🚀 ~ file: module.vue ~ line 209 ~ handleForm ~ type", this.data, form)
if (type === 'form') { if (type === 'form') {
forms.map(e => { forms.map(e => {
//
if (e.required) { if (e.required) {
this.rules[e.prop] = [ this.rules[e.prop] = [
{ {
@ -218,6 +221,8 @@ export default {
} }
}) })
} }
form && form.site && this.siteChange(form.site)
}, },
// //
siteChange(siteId) { siteChange(siteId) {
@ -231,9 +236,17 @@ export default {
this.columns = data this.columns = data
}).catch(err => {}) }).catch(err => {})
}, },
//
columnChange(val) {
this.data.form.columnName = this.$refs.links.getCheckedNodes()[0].label
},
// //
addRow() { addRow() {
this.data.list.push(JSON.parse(JSON.stringify(this.data.originForm))) if (this.data.type === 'banner') {
this.data.list.push(JSON.parse(JSON.stringify(this.data.originForm)))
} else {
this.editIntro(this.data.originForm, -1)
}
}, },
close() { close() {
this.$emit('update:visible', false) this.$emit('update:visible', false)
@ -270,32 +283,45 @@ export default {
contentSubmit() { contentSubmit() {
this.contentVisible = false this.contentVisible = false
const { form } = this.data const { form } = this.data
const list = this.data.list[this.curModule] if (this.curModule === -1) {
for (const i in form) { this.data.list.push(JSON.parse(JSON.stringify(this.data.form)))
this.$set(list, i, form[i]) } 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)) this.data.form = JSON.parse(JSON.stringify(this.data.originForm))
console.log("🚀 ~ file: module.vue ~ line 267 ~ contentSubmit ~ list", this.data)
}, },
// //
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
const linkEle = data.connectionType === 1 ? let name
el.$refs.column : //
data.connectionType === 3 ? if (data.connectionType === 1) {
el.$refs.otherColumn : if (!data.columnId.length) return Util.errorMsg('请选择站内链接')
null //
if (data.connectionType !== 2) { if (data.articleId) {
if (data.connectionType === 1) { const item = el.articles.find(e => e.id == data.articleId)
if (!data.columnId.length) return Util.errorMsg('请选择站内链接') name = item ? item.title : ''
} else {
name = el.$refs.column.getCheckedNodes()[0].pathLabels.join('/')
} }
if (data.connectionType === 3) { } else if (data.connectionType === 3) { //
if (!data.otherColumnId.length) return Util.errorMsg('请选择栏目') 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 = linkEle ? linkEle.getCheckedNodes()[0].pathLabels.join('/') : data.linkAddress data.linkName = name
console.log("🚀 ~ file: module.vue ~ line 296 ~ linkSubmit ~ data", this.data)
this.linkVisible = false this.linkVisible = false
}, },
// //

@ -88,12 +88,12 @@ export default {
{ {
id: 5, id: 5,
path: 'news', path: 'news',
name: 'NEWS&Events' name: 'NEWS&EVENTS'
}, },
{ {
id: 6, id: 6,
path: 'newsPress', path: 'newsPress',
name: 'NEWS&Events-press room' name: 'NEWS&EVENTS-PRESS ROOM'
} }
], ],
} }

@ -25,8 +25,9 @@ export default {
methods: { methods: {
// 获取详情 // 获取详情
getInfo() { getInfo() {
const siteId = this.$store.state.content.site.id
this.modules.map(e => { this.modules.map(e => {
const { type, list } = e const { type, list, form } = e
// 克隆一个原始row,方便添加 // 克隆一个原始row,方便添加
if (type === 'banner' || type === 'introduce') { if (type === 'banner' || type === 'introduce') {
const data = JSON.parse(JSON.stringify(e.form || e.list[0])) const data = JSON.parse(JSON.stringify(e.form || e.list[0]))
@ -34,22 +35,14 @@ export default {
if (typeof data[i] === 'string') data[i] = '' if (typeof data[i] === 'string') data[i] = ''
} }
e.originForm = data e.originForm = data
} else if (type === 'columns') {
if (!list.length) {
// 克隆6个栏目
for (let i = 0; i < 6; i++) {
e.list.push(JSON.parse(JSON.stringify(e.form)))
}
}
} }
// 克隆一个空值的form // 站点id默认设置为当前站点
// if (e.form) { e.list && e.list.map(e => {
// const form = JSON.parse(JSON.stringify(e.form)) if (e.link && !e.link.site) e.link.site = siteId
// for (const i in form) { if (type === 'columns' && !e.site) e.site = siteId
// if (typeof e.form[i] !== 'object') form[i] = '' })
// } if (form && form.link && !form.link.site) form.link.site = siteId
// e.originForm = form if (form && type === 'column' && !form.site) form.site = siteId
// }
}) })
// 查询页面详情 // 查询页面详情
this.$post(`${this.api.findPage}?columnId=${this.columnId}`).then(({ data }) => { this.$post(`${this.api.findPage}?columnId=${this.columnId}`).then(({ data }) => {
@ -71,14 +64,28 @@ export default {
this.diaVisible = true this.diaVisible = true
}, },
// 模块设置提交 // 模块设置提交
moduleSubmit() { moduleSubmited() {
this.diaVisible = false this.diaVisible = false
if (this.curData.type === 'columns') { if (this.curData.type === 'columns') {
this.modules[this.curModule].list[this.curListIndex] = JSON.parse(JSON.stringify(this.curData.form)) const form = this.curData.form
if (form.columnTitle === 2) form.columnName = form.columnTitleCustom
this.modules[this.curModule].list[this.curListIndex] = JSON.parse(JSON.stringify(form))
} else { } else {
this.modules[this.curModule] = this.curData this.modules[this.curModule] = this.curData
} }
}, },
// 模块设置提交验证
moduleSubmit() {
const formEle = this.$refs.module.$refs.form
// 有表单的要验证必填,没有的直接关闭弹框
if (formEle) {
formEle.validate((valid) => {
valid && this.moduleSubmited()
})
} else {
this.moduleSubmited()
}
},
// 处理预览和保存的json // 处理预览和保存的json
handleJson() { handleJson() {
return JSON.stringify(this.modules) return JSON.stringify(this.modules)

@ -36,117 +36,117 @@ import util from '@/libs/util'
import Setting from '@/setting' import Setting from '@/setting'
import addRoutes from '@/libs/route/addRoutes' import addRoutes from '@/libs/route/addRoutes'
export default { export default {
data: function() { data: function() {
return { return {
loginForm: { loginForm: {
username: "", username: "",
password: "", password: "",
captcha: "", // captcha: "", //
}, },
loginRules: { loginRules: {
username: [{ required: true, message: "请输入账号", trigger: "blur" }], username: [{ required: true, message: "请输入账号", trigger: "blur" }],
password: [{ required: true, message: "请输入密码", trigger: "blur" }], password: [{ required: true, message: "请输入密码", trigger: "blur" }],
captcha: [{ required: true, message: "请输入验证码", trigger: "blur" }] captcha: [{ required: true, message: "请输入验证码", trigger: "blur" }]
}, },
verificationIMG: "", verificationIMG: "",
phone: "", phone: "",
phoneCode: "", phoneCode: "",
phoneDisabled: false, phoneDisabled: false,
phoneTimer: null, phoneTimer: null,
phoneBtnText: "发送验证码" phoneBtnText: "发送验证码"
}; };
},
mounted() {
this.getVerImg()
//
this.$once("hook:beforeDestroy", function() {
clearInterval(this.phoneTimer)
this.phoneTimer = null
})
},
methods: {
...mapMutations('user', [
'setUserId', 'setUserName'
]),
//
getVerImg() {
this.loginForm.random = Math.floor(Math.random() * 999999999);
this.verificationIMG = this.api.verification + "?random=" + `${this.loginForm.random}`;
}, },
mounted() { submit() {
this.getVerImg() this.$post(this.api.logins, this.loginForm).then(({ data }) => {
// util.local.set(Setting.tokenKey, data.accessToken, Setting.tokenExpires)
this.$once("hook:beforeDestroy", function() { addRoutes(data.permissionList[0].children)
clearInterval(this.phoneTimer) util.successMsg('登录成功')
this.phoneTimer = null this.setUserId(data.id || 1)
this.setUserName(data.username)
this.$router.push('/site')
}).catch(res => {
this.getVerImg()
this.loginForm.captcha = ''
}) })
}, },
methods: { phoneCountdown() {
...mapMutations('user', [ let count = 60;
'setUserId', 'setUserName' if (!this.phoneTimer) {
]), this.phoneDisabled = true;
// this.phoneTimer = setInterval(() => {
getVerImg() { console.log("倒计时中");
this.loginForm.random = Math.floor(Math.random() * 999999999); if (count > 0) {
this.verificationIMG = this.api.verification + "?random=" + `${this.loginForm.random}`; count--;
}, this.phoneBtnText = `${count}秒后重试`;
submit() { } else {
this.$post(this.api.logins, this.loginForm).then(({ data }) => { this.phoneDisabled = false;
util.local.set(Setting.tokenKey, data.accessToken, Setting.tokenExpires) clearInterval(this.phoneTimer);
addRoutes(data.permissionList[0].children) this.phoneTimer = null;
util.successMsg('登录成功') this.phoneBtnText = `发送验证码`;
this.setUserId(data.id || 1) }
this.setUserName(data.username) }, 1000);
this.$router.push('/site') }
}).catch(res => { },
this.getVerImg() sendPhoneCode() {
this.loginForm.captcha = '' if (!this.phone) return util.warningMsg("请输入手机号");
}) if (!/^1[3456789]\d{9}$/.test(this.phone)) return util.warningMsg("请输入正确的手机号");
}, let data = {
phoneCountdown() { platform: Setting.platformId,
let count = 60; phone: this.phone,
if (!this.phoneTimer) { types: 2
this.phoneDisabled = true; };
this.phoneTimer = setInterval(() => { this.$post(this.api.sendPhoneOrEmailCode, data).then(res => {
console.log("倒计时中"); if (res.message.opener) {
if (count > 0) { this.phoneCountdown();
count--; this.phoneOpener = res.message.opener;
this.phoneBtnText = `${count}秒后重试`; } else {
} else { util.errorMsg(res.message);
this.phoneDisabled = false; }
clearInterval(this.phoneTimer); }).catch(res => {});
this.phoneTimer = null; },
this.phoneBtnText = `发送验证码`; phoneSubmit() {
} if (!this.phone) return util.warningMsg("请输入手机号");
}, 1000); if (!/^1[3456789]\d{9}$/.test(this.phone)) return util.warningMsg("请输入正确的手机号");
} if (!this.phoneCode) return util.warningMsg("请输入验证码");
}, let data = {
sendPhoneCode() { phone: this.phone,
if (!this.phone) return util.warningMsg("请输入手机号"); types: 2,
if (!/^1[3456789]\d{9}$/.test(this.phone)) return util.warningMsg("请输入正确的手机号"); captcha: this.phoneCode,
let data = { opener: this.phoneOpener,
platform: Setting.platformId, platform: Setting.platformId,
phone: this.phone, username: this.loginForm.username
types: 2 };
}; this.$post(this.api.bindPhoneOrEmail, data).then(res => {
this.$post(this.api.sendPhoneOrEmailCode, data).then(res => { util.successMsg("绑定成功");
if (res.message.opener) { this.loginForm.phone = this.phone;
this.phoneCountdown(); this.phoneVisible = false;
this.phoneOpener = res.message.opener;
} else {
util.errorMsg(res.message);
}
}).catch(res => {});
},
phoneSubmit() {
if (!this.phone) return util.warningMsg("请输入手机号");
if (!/^1[3456789]\d{9}$/.test(this.phone)) return util.warningMsg("请输入正确的手机号");
if (!this.phoneCode) return util.warningMsg("请输入验证码");
let data = {
phone: this.phone,
types: 2,
captcha: this.phoneCode,
opener: this.phoneOpener,
platform: Setting.platformId,
username: this.loginForm.username
};
this.$post(this.api.bindPhoneOrEmail, data).then(res => {
util.successMsg("绑定成功");
this.loginForm.phone = this.phone;
this.phoneVisible = false;
util.local.set(Setting.tokenKey, res.token, Setting.tokenExpires); util.local.set(Setting.tokenKey, res.token, Setting.tokenExpires);
let redirect = this.$route.query.redirect ? decodeURIComponent(this.$route.query.redirect) : "/index"; let redirect = this.$route.query.redirect ? decodeURIComponent(this.$route.query.redirect) : "/index";
this.$router.replace(redirect); this.$router.replace(redirect);
util.successMsg("登录成功"); util.successMsg("登录成功");
this.queryCustomer(); this.queryCustomer();
}).catch(res => { }).catch(res => {
}); });
}
} }
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

@ -5,38 +5,15 @@ export default {
language:'zh_CN', language:'zh_CN',
plugins: 'print powerpaste preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template advcode codesample table charmap hr pagebreak nonbreaking anchor insertdatetime advlist lists wordcount imagetools textpattern help emoticons autosave autoresize formatpainter', plugins: 'print powerpaste preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template advcode codesample table charmap hr pagebreak nonbreaking anchor insertdatetime advlist lists wordcount imagetools textpattern help emoticons autosave autoresize formatpainter',
toolbar: 'code undo redo restoredraft | cut copy powerpaste pastetext | forecolor backcolor bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify outdent indent | \ toolbar: 'code undo redo restoredraft | cut copy powerpaste pastetext | forecolor backcolor bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify outdent indent | \
styleselect formatselect fontselect fontsizeselect | bullist numlist | blockquote subscript superscript removeformat | \ styleselect fontselect fontsizeselect | bullist numlist | blockquote subscript superscript removeformat | \
table image media charmap emoticons hr pagebreak insertdatetime print preview | fullscreen | indent2em lineheight formatpainter', table image media charmap emoticons hr pagebreak insertdatetime print preview | fullscreen | indent2em lineheight formatpainter',
// width: 1000,
height: 650, //编辑器高度 height: 650, //编辑器高度
min_height: 400, min_height: 400,
// content_css: [ //可设置编辑区内容展示的css,谨慎使用 content_css: [ //可设置编辑区内容展示的css,谨慎使用
// '/static/reset.css', './editor.css',
// ], ],
content_style: `.mce-content-body:not([dir=rtl]) blockquote { // content_style: Style,
padding: 8px 15px;
border-left: 0;
background-color: #ededed;
}
blockquote p {
margin: 0;
font-style: italic;
}
.block {
margin-bottom: 20px;
overflow: hidden;
}
.block .fl {
float: left;
margin-right: 10px;
}
.block .fr {
float: right;
margin-left: 10px;
}
.block p {
margin: 0 0 10px;
}
`,
fontsize_formats: '12px 14px 16px 19px 24px 36px 48px 56px 72px', fontsize_formats: '12px 14px 16px 19px 24px 36px 48px 56px 72px',
font_formats: '微软雅黑=Microsoft YaHei,Helvetica Neue,PingFang SC,sans-serif;苹果苹方=PingFang SC,Microsoft YaHei,sans-serif;宋体=simsun,serif;仿宋体=FangSong,serif;黑体=SimHei,sans-serif;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;Comic Sans MS=comic sans ms,sans-serif;Courier New=courier new,courier;Georgia=georgia,palatino;Helvetica=helvetica;Impact=impact,chicago;Symbol=symbol;Tahoma=tahoma,arial,helvetica,sans-serif;Terminal=terminal,monaco;Times New Roman=times new roman,times;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings,zapf dingbats;知乎配置=BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;小米配置=Helvetica Neue,Helvetica,Arial,Microsoft Yahei,Hiragino Sans GB,Heiti SC,WenQuanYi Micro Hei,sans-serif', font_formats: '微软雅黑=Microsoft YaHei,Helvetica Neue,PingFang SC,sans-serif;苹果苹方=PingFang SC,Microsoft YaHei,sans-serif;宋体=simsun,serif;仿宋体=FangSong,serif;黑体=SimHei,sans-serif;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;Comic Sans MS=comic sans ms,sans-serif;Courier New=courier new,courier;Georgia=georgia,palatino;Helvetica=helvetica;Impact=impact,chicago;Symbol=symbol;Tahoma=tahoma,arial,helvetica,sans-serif;Terminal=terminal,monaco;Times New Roman=times new roman,times;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings,zapf dingbats;知乎配置=BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;小米配置=Helvetica Neue,Helvetica,Arial,Microsoft Yahei,Hiragino Sans GB,Heiti SC,WenQuanYi Micro Hei,sans-serif',
link_list: [ link_list: [
@ -67,18 +44,67 @@ export default {
//为内容模板插件提供预置模板 //为内容模板插件提供预置模板
templates: [ templates: [
{ title: '文章模板1', description: '图片文字流', content: ` { title: '文章模板1', description: '图片文字流', content: `
<div class="block"> <div class="tiny-wrap">
<img align="left" hspace="5" vspace="5" src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/> <div class="block">
<div class="texts"> <div class="fl">
<p>S³FEL主要由一台超导直线加速器波荡器光束线和实验站组成可产生重复频率达1MHz电子束能量达2.5 GeV的软X 射线自由电子激光可在百飞秒内级实现原子分子及外壳层电子结构的无损动态监测是科学家认识和了解物质微观结构及动态变化的高速摄像机S³FEL为科学家和企业用户提供了一种具有超高时间分辨空间分辨和能量分辨的新方法新技术 S³FEL在量子材料能源催化生物医药大气与星际科学原子分子科学等领域的应用研究将为促进我国战略性新兴产业创新发展和关键 <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
<p class="img-des">图片描述</p>
</div>
<div class="texts">
<p>S³FEL主要由一台超导直线加速器波荡器光束线和实验站组成可产生重复频率达1MHz电子束能量达2.5 GeV的软X 射线自由电子激光可在百飞秒内级实现原子分子及外壳层电子结构的无损动态监测是科学家认识和了解物质微观结构及动态变化的高速摄像机S³FEL为科学家和企业用户提供了一种具有超高时间分辨空间分辨和能量分辨的新方法新技术 S³FEL在量子材料能源催化生物医药大气与星际科学原子分子科学等领域的应用研究将为促进我国战略性新兴产业创新发展和关键S³FEL主要由一台超导直线加速器波荡器光束线和实验站组成可产生重复频率达1MHz电子束能量达2.5 GeV的软X 射线自由电子激光可在百飞秒内级实现原子分子及外壳层电子结构的无损动态监测是科学家认识和了解物质微观结构及动态变化的高速摄像机S³FEL为科学家和企业用户提供了一种具有超高时间分辨空间分辨和能量分辨的新方法新技术 S³FEL在量子材料能源催化生物医药大气与星际科学原子分子科学等领域的应用研究将为促进我国战略性新兴产业创新发展和关键S³FEL主要由一台超导直线加速器波荡器光束线和实验站组成可产生重复频率达1MHz电子束能量达2.5 GeV的软X 射线自由电子激光可在百飞秒内级实现原子分子及外壳层电子结构的无损动态监测是科学家认识和了解物质微观结构及动态变化的高速摄像机S³FEL为科学家和企业用户提供了一种具有超高时间分辨空间分辨和能量分辨的新方法新技术 S³FEL在量子材料能源催化生物医药大气与星际科学原子分子科学等领域的应用研究将为促进我国战略性新兴产业创新发展和关键S³FEL主要由一台超导直线加速器波荡器光束线和实验站组成可产生重复频率达1MHz电子束能量达2.5 GeV的软X 射线自由电子激光可在百飞秒内级实现原子分子及外壳层电子结构的无损动态监测是科学家认识和了解物质微观结构及动态变化的高速摄像机S³FEL在量子材料能源催化生物医药大气与星际科学原子分子科学等领域的应用研究将为促进我国战略性新兴产业创新发展和关键S³FEL主要由一台超导直线加速器波荡器光束线和实验站组成可产生重复频率达1MHz电子束能量达2.5 GeV的软X 射线自由电子激光可在百飞秒内级实现原子分子及外壳层电子结构的无损动态监测是科学家认识和了解物质微观结构及动态变化的高速摄像机
</p>
</div>
</div>
<div class="block">
<div class="fr">
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
<p class="img-des">图片描述</p>
</div>
<div>
<p>集聚世界前沿和原创性科学技术及产业研发将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展营造粤港澳大湾区人才高地并助力粤港澳大湾区国际科技创新中心的建设此外 S³FEL作为重要的科普教育基地</p>
<p>S³FEL汇聚并培养信息生命材料能源等学科领域的国际水平科技领军人才集聚世界前沿和原创性科学技术及产业研发将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展营造粤港澳大湾区人才高地并助力粤港澳大湾区国际科技创新中心的建设此外 S³FEL作为重要的科普教育基地是展示我国科技实力提高全民族科学素质和民族自信的重要宣传窗口 S³FEL主体建筑将成为深圳市地标式建筑促进提升深圳市的城市形象和国际化知名度S³FEL汇聚并培养信息生命材料能源等学科领域的国际水平科技领军人才集聚世界前沿和原创性科学技术及产业研发将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展营造粤港澳大湾区人才高地并助力粤港澳大湾区国际科技创新中心的建设此外 S³FEL作为重要的科普教育基地是展示我国科技实力提高全民族科学素质和民族自信的重要宣传窗口 S³FEL主体建筑将成为深圳市地标式建筑促进提升深圳市的城市形象和国际化知名度S³FEL汇聚并培养信息生命材料能源等学科领域的国际水平科技领军人才集聚世界前沿和原创性科学技术及产业研发将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展营造粤港澳大湾区人才高地并助力粤港澳大湾区国际科技创新中心的建设此外 S³FEL作为重要的科普教育基地是展示我国科技实力提高全民族科学素质和民族自信的重要宣传窗口 S³FEL主体建筑将成为深圳市地标式建筑促进提升深圳市的城市形象和国际化知名度</p>
</div>
</div>
</div>
`
},
{ title: '新闻模板', description: '', content: `
<div class="tiny-wrap">
<div class="block" style="margin-bottom: 70px;">
<div class="fr">
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
<p class="img-des">图片描述</p>
</div>
<div>
<p>S³FEL汇聚并培养信息生命材料能源等学科领域的国际水平科技领军人才集聚世界前沿和原创性科学技术及产业研发将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展营造粤港澳大湾区人才高地并助力粤港澳大湾区国际科技创新中心的建设此外 S³FEL作为重要的科普教育基地是展示我国科技实力提高全民族科学素质和民族自信的重要宣传窗口 S³FEL主体建筑将成为深圳市地标式建筑促进提升深圳市的城市形象和国际化知名度S³FEL汇聚并培养信息生命材料能源等学科领域的国际水平科技领军人才集聚世界前沿和原创性科学技术及产业研发将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展营造粤港澳大湾区人才高地并助力粤港澳大湾区国际科技创新中心的建设此外 S³FEL作为重要的科普教育基地是展示我国科技实力提高全民族科学素质和民族自信的重要宣传窗口 S³FEL主体建筑将成为深圳市地标式建筑促进提升深圳市的城市形象和国际化知名度S³FEL汇聚并培养信息生命材料能源等学科领域的国际水平科技领军人才集聚世界前沿和原创性科学技术及产业研发将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展营造粤港澳大湾区人才高地并助力粤港澳大湾区国际科技创新中心的建设此外 S³FEL作为重要的科普教育基地是展示我国科技实力提高全民族科学素质和民族自信的重要宣传窗口 S³FEL主体建筑将成为深圳市地标式建筑促进提升深圳市的城市形象和国际化知名度</p>
<div class="quote">
Here is a long quotation here is a long quotation here is a long quotation
here is a long quotation here is a long quotation here is a long quotation
here is a long quotation here is a long quotation here is a long quotation.
</div>
</div>
</div>
<div class="block">
<div class="img-wrap">
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
<p class="img-des">图片描述</p>
</div>
<div class="texts">
<h6 class="tiny-title">小标题</h6>
<p>S³FEL主要由一台超导直线加速器波荡器光束线和实验站组成可产生重复频率达1MHz电子束能量达2.5 GeV的软X 射线自由电子激光可在百飞秒内级实现原子分子及外壳层电子结构的无损动态监测是科学家认识和了解物质微观结构及动态变化的高速摄像机S³FEL为科学家和企业用户提供了一种具有超高时间分辨空间分辨和能量分辨的新方法新技术 S³FEL在量子材料能源催化生物医药大气与星际科学原子分子科学等领域的应用研究将为促进我国战略性新兴产业创新发展和关键S³FEL主要由一台超导直线加速器波荡器光束线和实验站组成可产生重复频率达1MHz电子束能量达2.5 GeV的软X 射线自由电子激光可在百飞秒内级实现原子分子及外壳层电子结构的无损动态监测是科学家认识和了解物质微观结构及动态变化的高速摄像机S³FEL为科学家和企业用户提供了一种具有超高时间分辨空间分辨和能量分辨的新方法新技术 S³FEL在量子材料能源催化生物医药大气与星际科学原子分子科学等领域的应用研究将为促进我国战略性新兴产业创新发展和关键
</p> </p>
</div>
</div> </div>
</div> </div>
<div class="block"> `
<img align="right" hspace="5" vspace="5" src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/> },
<div> { title: '图片描述', description: '', content: `
<p>集聚世界前沿和原创性科学技术及产业研发将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展营造粤港澳大湾区人才高地并助力粤港澳大湾区国际科技创新中心的建设此外 S³FEL作为重要的科普教育基地</p> <div class="tiny-wrap">
<p>S³FEL汇聚并培养信息生命材料能源等学科领域的国际水平科技领军人才集聚世界前沿和原创性科学技术及产业研发将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展营造粤港澳大湾区人才高地并助力粤港澳大湾区国际科技创新中心的建设此外 S³FEL作为重要的科普教育基地是展示我国科技实力提高全民族科学素质和民族自信的重要宣传窗口 S³FEL主体建筑将成为深圳市地标式建筑促进提升深圳市的城市形象和国际化知名度</p> <div class="block">
<div class="img-wrap">
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
<p class="img-des">图片描述</p>
</div>
</div> </div>
</div> </div>
` `

@ -4,11 +4,11 @@
<el-form :model="form" :rules="rules" class="input-form model" label-width="140px"> <el-form :model="form" :rules="rules" class="input-form model" label-width="140px">
<el-form-item prop="title" label="标题"> <el-form-item prop="title" label="标题">
<el-input <el-input
style="width: 100%" style="width: 940px"
placeholder="请输入标题" placeholder="请输入标题"
v-model.trim="form.title" v-model="form.title"
clearable clearable
maxlength="15" maxlength="100"
@change="nameChange" @change="nameChange"
></el-input> ></el-input>
</el-form-item> </el-form-item>
@ -55,9 +55,10 @@
</div> </div>
<el-form-item prop="summary" label="摘要"> <el-form-item prop="summary" label="摘要">
<el-input <el-input
style="width: 100%" style="width: 940px"
type="textarea" type="textarea"
v-model.trim="form.summary" v-model.trim="form.summary"
:rows="3"
clearable clearable
></el-input> ></el-input>
</el-form-item> </el-form-item>
@ -65,16 +66,10 @@
<el-upload <el-upload
class="avatar-uploader" class="avatar-uploader"
accept=".jpg,.png,.jpeg,.gif" accept=".jpg,.png,.jpeg,.gif"
:before-upload="beforeUpload" :on-change="file => changeFile(file, 0)"
:on-error="uploadError"
:on-success="uploadSuccess"
:show-file-list="false" :show-file-list="false"
:action="this.api.upload" :action="this.api.upload"
:data="{ :auto-upload="false"
quote: form.title,
site: site.siteName,
uploader: userName
}"
> >
<img v-if="form.titleImg" :src="form.titleImg" class="avatar"> <img v-if="form.titleImg" :src="form.titleImg" class="avatar">
<div class="uploader-default" v-else> <div class="uploader-default" v-else>
@ -83,20 +78,14 @@
</div> </div>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<el-form-item prop="bannerImg" label="Banner图" style="flex: 1;"> <el-form-item prop="bannerImg" label="Banner图(选填)" style="flex: 1;">
<el-upload <el-upload
class="avatar-uploader avatar-uploader-lg" class="avatar-uploader avatar-uploader-lg"
accept=".jpg,.png,.jpeg,.gif" accept=".jpg,.png,.jpeg,.gif"
:before-upload="beforeUpload" :on-change="file => changeFile(file, 1)"
:on-error="uploadError"
:on-success="uploadSuccessBanner"
:show-file-list="false" :show-file-list="false"
:action="this.api.upload" :action="this.api.upload"
:data="{ :auto-upload="false"
quote: form.title,
site: site.siteName,
uploader: userName
}"
> >
<img v-if="form.bannerImg" :src="form.bannerImg" class="avatar-lg"> <img v-if="form.bannerImg" :src="form.bannerImg" class="avatar-lg">
<div class="uploader-default" v-else> <div class="uploader-default" v-else>
@ -135,10 +124,7 @@
<el-form-item prop="file" label="文件上传"> <el-form-item prop="file" label="文件上传">
<el-upload <el-upload
:on-remove="handleRemove" :on-remove="handleRemove"
:on-error="uploadError"
:on-success="uploadSuccessFile" :on-success="uploadSuccessFile"
:limit="1"
:on-exceed="handleExceed"
:action="this.api.upload" :action="this.api.upload"
:file-list="fileList" :file-list="fileList"
:data="{ :data="{
@ -207,6 +193,16 @@
<el-button @click="submit(0)">保存草稿</el-button> <el-button @click="submit(0)">保存草稿</el-button>
<el-button @click="$router.back()">取消</el-button> <el-button @click="$router.back()">取消</el-button>
</div> </div>
<!-- 剪裁组件弹窗 -->
<el-dialog title="图片裁剪" append-to-body :visible.sync="cropperModel" width="1100px" :close-on-click-modal="false">
<Cropper
ref="cropper"
:img-file.sync="file"
:is-upload="isUpload"
:fixed="true"
:fixedNumber.sync="fixedNumber"
@upload="customUpload" />
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
@ -215,6 +211,8 @@ import ColumnConst from '@/const/column'
import { mapState } from 'vuex' import { mapState } from 'vuex'
import Editor from '@tinymce/tinymce-vue' import Editor from '@tinymce/tinymce-vue'
import editorConfig from './editor' import editorConfig from './editor'
import Cropper from '@/components/img-upload/Cropper'
import Axios from 'axios'
export default { export default {
data() { data() {
return { return {
@ -274,6 +272,11 @@ export default {
editorConfig, editorConfig,
submiting: false, // submiting: false, //
updateTime: 0, updateTime: 0,
cropperModel: false,
isUpload: false,
fixedNumber: [1.76, 1],
file: {}, //
isBanner: 0
}; };
}, },
computed: { computed: {
@ -285,7 +288,8 @@ export default {
]) ])
}, },
components: { components: {
Editor Editor,
Cropper
}, },
watch: { watch: {
// , // ,
@ -404,47 +408,105 @@ export default {
this.nameRepeat = false this.nameRepeat = false
} }
}, },
// //
beforeUpload(file) { customUpload(data) {
const blob = this.dataURItoBlob(data)
const formData = new FormData()
formData.append('file', blob, this.file.name)
formData.append('quote', this.form.title)
formData.append('site', this.site.siteName)
formData.append('uploader', this.userName)
this.imgUpload(formData)
},
//
compress(img) {
const canvas = document.createElement('canvas')
const ctx = canvas.getContext('2d')
// let initSize = img.src.length;
const width = img.width
const height = img.height
canvas.width = width
canvas.height = height
//
ctx.fillStyle = '#fff'
ctx.fillRect(0, 0, canvas.width, canvas.height)
ctx.drawImage(img, 0, 0, width, height)
//
const ndata = canvas.toDataURL('image/jpeg', 0.8)
return ndata
},
// base64bolb
dataURItoBlob(base64Data) {
let byteString
if (base64Data.split(',')[0].indexOf('base64') >= 0) {
byteString = atob(base64Data.split(',')[1])
} else {
byteString = unescape(base64Data.split(',')[1])
}
const mimeString = base64Data
.split(',')[0]
.split(':')[1]
.split(';')[0]
const ia = new Uint8Array(byteString.length)
for (let i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i)
}
return new Blob([ia], {
type: mimeString
})
},
//
imgUpload(formData) {
this.isUpload = true
Axios({
method: 'post',
url: this.api.upload,
data: formData,
headers: {
'Content-Type': 'multipart/form-data'
},
}).then(({ data }) => {
let url = this.form[this.isBanner ? 'bannerImg' : 'titleImg']
url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {}) //
this.form[this.isBanner ? 'bannerImg' : 'titleImg'] = data.url
}).catch(res => {})
this.$refs.cropper.isDisabled = false
this.isUpload = false
this.cropperModel = false
},
//
changeFile(file, isBanner) {
this.fixedNumber = isBanner ? [1, 0.26] : [1.76, 1]
this.isBanner = isBanner
const { size, name } = file const { size, name } = file
const ext = name.substring(name.lastIndexOf('.') + 1) const ext = name.substring(name.lastIndexOf('.') + 1)
if (!util.isImg(ext)) { if (!util.isImg(ext)) {
this.$message.error('请上传图片!') this.$message.error('请上传图片!')
return false return false
} }
if (size / 1024 / 1024 > 1) { if (size / 1024 / 1024 > 5) {
this.$message.error('请上传1M以内的图片!') this.$message.error('请上传5M以内的图片!')
return false return false
} }
}, this.file = file
uploadError(err, file, fileList) { this.cropperModel = true
this.$message({ this.$nextTick(() => {
message: "上传出错,请重试!", this.$refs.cropper.updateImg({
type: "error", url: window.URL.createObjectURL(file.raw),
center: true size: file.size
})
}) })
}, },
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${file.name}`);
},
handleExceed(files, fileList) {
util.errorMsg(`当前限制选择 1 个文件,如需更换,请删除上一个文件再重新选择!`);
},
handleRemove(file, fileList) { handleRemove(file, fileList) {
this.form.file = '' this.form.file = ''
}, },
uploadSuccess(res) {
let url = this.form.titleImg
url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {})
this.form.titleImg = res.url
},
uploadSuccessBanner(res) { uploadSuccessBanner(res) {
let url = this.form.bannerImg let url = this.form.bannerImg
url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {}) url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {})
this.form.bannerImg = res.url this.form.bannerImg = res.url
}, },
uploadSuccessFile(res) { uploadSuccessFile(res) {
this.form.file = res.url this.form.file = res.url
}, },
// //
preview() { preview() {

@ -3,7 +3,7 @@
<div style="width: 218px;border-right: 1px solid #EBEDF0"> <div style="width: 218px;border-right: 1px solid #EBEDF0">
<p class="page-name mb">全部栏目</p> <p class="page-name mb">全部栏目</p>
<div style="height: 504px;overflow: auto"> <div style="height: 504px;overflow: auto">
<el-tree ref="column" :data="columns" highlight-current :expand-on-click-node="false" default-expand-all :props="defaultProps" node-key="id" @node-click="getData"></el-tree> <el-tree ref="column" :data="columns" highlight-current :expand-on-click-node="false" default-expand-all :props="defaultProps" node-key="id" @node-click="initData"></el-tree>
</div> </div>
</div> </div>
<div class="p-l-20" style="width: calc(100% - 219px);"> <div class="p-l-20" style="width: calc(100% - 219px);">
@ -238,33 +238,22 @@ export default {
this.page = 1 this.page = 1
this.getData() this.getData()
}, },
batchDel() { // //
if (this.multipleSelection.length) { batchDel() {
this.$confirm("确定要删除选中用户吗?", "提示", { const list = this.multipleSelection
type: "warning" if (list.length) {
}).then(() => { this.$confirm('确定要删除吗?', '提示', {
let ids = this.multipleSelection.map(item => { type: 'warning'
return item.accountId; }).then(() => {
}); // this.$del(`${this.api.user}`, list.map(e => e.id)).then(res => {
this.$post(`${this.api.delStudent}?accountIds=${ids.toString()}`).then(res => { // this.$refs.table.clearSelection()
this.multipleSelection = []; // util.successMsg('')
this.$refs.table.clearSelection(); // this.getStaff()
util.successMsg("删除成功"); // }).catch(res => {})
if (this.studentType) { }).catch(() => {})
this.getData(); } else {
} else { util.errorMsg('请先选择数据 !')
this.getOrgStudentData(); }
}
}).catch(res => {
});
if(this.multipleSelection.length === this.list.length && this.page>1) {
this.handleCurrentChange(this.page - 1)
}
}).catch(() => {
});
} else {
util.errorMsg("请先选择数据 !");
}
}, },
// //
handleDelete(row) { handleDelete(row) {
@ -285,7 +274,7 @@ export default {
}, },
// //
preview(row) { preview(row) {
window.open(`http://192.168.31.${Setting.isDev ? 126 : 136}:8095/#/article?id=` + row.id) window.open((Setting.isDev ? `http://${location.hostname}:8095` : 'http://192.168.31.136') + `/#/article?id=` + row.id)
}, },
// //
edit(row) { edit(row) {

@ -6,9 +6,9 @@
<el-form-item prop="columnName" label="栏目名称"> <el-form-item prop="columnName" label="栏目名称">
<el-input <el-input
placeholder="请输入栏目名称" placeholder="请输入栏目名称"
v-model.trim="form.columnName" v-model="form.columnName"
clearable clearable
maxlength="15" maxlength="40"
@change="nameChange" @change="nameChange"
></el-input> ></el-input>
</el-form-item> </el-form-item>
@ -48,17 +48,10 @@
<el-upload <el-upload
class="avatar-uploader avatar-uploader-lg" class="avatar-uploader avatar-uploader-lg"
accept=".jpg,.png,.jpeg,.gif" accept=".jpg,.png,.jpeg,.gif"
:before-upload="beforeUpload" :on-change="changeFile"
:on-remove="handleRemove"
:on-error="uploadError"
:on-success="uploadSuccess"
:show-file-list="false" :show-file-list="false"
:action="this.api.upload" :action="this.api.upload"
:data="{ :auto-upload="false"
quote: form.columnName,
site: site.siteName,
uploader: userName
}"
> >
<img v-if="form.columnBanner" :src="form.columnBanner" class="avatar-lg"> <img v-if="form.columnBanner" :src="form.columnBanner" class="avatar-lg">
<div class="uploader-default" v-else> <div class="uploader-default" v-else>
@ -66,7 +59,7 @@
<p>点击上传</p> <p>点击上传</p>
</div> </div>
<div slot="tip" class="el-upload__tip"> <div slot="tip" class="el-upload__tip">
<p>请上传1920x500PX1M以内的jpgbmppng格式</p> <p>请上传1920x500PX5M以内的jpgbmppng格式</p>
</div> </div>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
@ -215,11 +208,11 @@
<el-button @click="$router.push('/column')">取消</el-button> <el-button @click="$router.push('/column')">取消</el-button>
</div> </div>
<!-- 剪裁组件弹窗 --> <!-- 剪裁组件弹窗 -->
<el-dialog append-to-body :visible.sync="cropperModel" width="1100px"> <el-dialog title="图片裁剪" append-to-body :visible.sync="cropperModel" width="1100px" :close-on-click-modal="false">
<Cropper <Cropper
ref="vueCropper" ref="cropper"
:img-file.sync="file"
:is-upload="isUpload" :is-upload="isUpload"
:img-file="file"
:fixed="true" :fixed="true"
@upload="customUpload" /> @upload="customUpload" />
</el-dialog> </el-dialog>
@ -475,15 +468,54 @@ export default {
this.nameRepeat = false this.nameRepeat = false
} }
}, },
//
customUpload(data) { customUpload(data) {
// upload
// console.log(data);
// let _data = this.compress(img);
const blob = this.dataURItoBlob(data) const blob = this.dataURItoBlob(data)
const formData = new FormData() const formData = new FormData()
formData.append('file', blob, this.file.name) // formData.append('file', blob, this.file.name)
formData.append('quote', this.form.columnName)
formData.append('site', this.site.siteName)
formData.append('uploader', this.userName)
this.imgUpload(formData) this.imgUpload(formData)
}, },
//
compress(img) {
const canvas = document.createElement('canvas')
const ctx = canvas.getContext('2d')
// let initSize = img.src.length;
const width = img.width
const height = img.height
canvas.width = width
canvas.height = height
//
ctx.fillStyle = '#fff'
ctx.fillRect(0, 0, canvas.width, canvas.height)
ctx.drawImage(img, 0, 0, width, height)
//
const ndata = canvas.toDataURL('image/jpeg', 0.8)
return ndata
},
// base64bolb
dataURItoBlob(base64Data) {
let byteString
if (base64Data.split(',')[0].indexOf('base64') >= 0) {
byteString = atob(base64Data.split(',')[1])
} else {
byteString = unescape(base64Data.split(',')[1])
}
const mimeString = base64Data
.split(',')[0]
.split(':')[1]
.split(';')[0]
const ia = new Uint8Array(byteString.length)
for (let i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i)
}
return new Blob([ia], {
type: mimeString
})
},
//
imgUpload(formData) { imgUpload(formData) {
this.isUpload = true this.isUpload = true
Axios({ Axios({
@ -494,52 +526,36 @@ export default {
'Content-Type': 'multipart/form-data' 'Content-Type': 'multipart/form-data'
}, },
}).then(({ data }) => { }).then(({ data }) => {
let url = this.form.columnBanner
url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {}) //
this.form.columnBanner = data.url
this.fileId = data.id
}).catch(res => {}) }).catch(res => {})
// this.$api[this.uploadMethodName]({ this.$refs.cropper.isDisabled = false
// data: formData,
// showLoading: false
// }).then(res => {
// //
// console.log(this.uploadList)
// this.uploadList = this.isSingle ? res : this.uploadList.concat(res)
// this.uploadList.forEach(item => {
// item.name = item.fileId
// item.url = `/common-service/file/downloadFileFromOSS?key=${item.fileId}`
// })
// }).catch(() => {})
this.isUpload = false this.isUpload = false
this.cropperModel = false this.cropperModel = false
}, },
// //
beforeUpload(file) { changeFile(file) {
const { size, name } = file const { size, name } = file
const ext = name.substring(name.lastIndexOf('.') + 1) const ext = name.substring(name.lastIndexOf('.') + 1)
if (!util.isImg(ext)) { if (!util.isImg(ext)) {
this.$message.error('请上传图片!') this.$message.error('请上传图片!')
return false return false
} }
if (size / 1024 / 1024 > 1) { if (size / 1024 / 1024 > 5) {
this.$message.error('请上传1M以内的图片!') this.$message.error('请上传5M以内的图片!')
return false return false
} }
}, this.file = file
uploadError(err, file, fileList) { this.cropperModel = true
this.$message({ this.$nextTick(() => {
message: "上传出错,请重试!", this.$refs.cropper.updateImg({
type: "error", url: window.URL.createObjectURL(file.raw),
center: true size: file.size
})
}) })
}, },
handleRemove(file, fileList) {
this.form.columnBanner = ''
},
uploadSuccess(res) {
let url = this.form.columnBanner
url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {})
this.form.columnBanner = res.url
this.fileId = res.id
},
// //
preview() { preview() {

@ -17,7 +17,7 @@
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:新增'" type="primary" @click="add" >新增</el-button> <el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:新增'" type="primary" @click="add" >新增</el-button>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:删除'" @click="batchDel">删除</el-button> <!-- <el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:删除'" @click="batchDel">删除</el-button> -->
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:更改排序'" class="lg" @click="sort">更改排序</el-button> <el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:更改排序'" class="lg" @click="sort">更改排序</el-button>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:导航样式设置'" class="lg" @click="styleSet">导航样式设置</el-button> <el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:导航样式设置'" class="lg" @click="styleSet">导航样式设置</el-button>
</div> </div>
@ -290,11 +290,11 @@ export default {
this.$confirm('确定要删除吗?', '提示', { this.$confirm('确定要删除吗?', '提示', {
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
this.$del(`${this.api.user}`, list.map(e => e.id)).then(res => { // this.$del(`${this.api.user}`, list.map(e => e.id)).then(res => {
this.$refs.table.clearSelection() // this.$refs.table.clearSelection()
util.successMsg('删除成功') // util.successMsg('')
this.getStaff() // this.getStaff()
}).catch(res => {}) // }).catch(res => {})
}).catch(() => {}) }).catch(() => {})
} else { } else {
util.errorMsg('请先选择数据 !') util.errorMsg('请先选择数据 !')
@ -326,7 +326,7 @@ export default {
columnName: '', columnName: '',
templateId: '', templateId: '',
typeId : '', typeId : '',
isSort: 1 isSort: 0
}).then(({ data }) => { }).then(({ data }) => {
this.sortColumns = data this.sortColumns = data
}).catch(err => {}) }).catch(err => {})

@ -7,189 +7,192 @@
<el-button @click="$router.back()">放弃编辑</el-button> <el-button @click="$router.back()">放弃编辑</el-button>
</div> </div>
<div class="relative"> <div class="modules">
<el-carousel height="480px"> <p class="page-name mb">页面设置</p>
<template v-for="(item, i) in modules[0].list"> <div class="relative">
<el-carousel-item v-if="item.pic" :key="i"> <el-carousel height="480px">
<img width="100%" height="100%" :src="item.pic" alt=""> <template v-for="(item, i) in modules[0].list">
</el-carousel-item> <el-carousel-item v-if="item.pic" :key="i">
</template> <img width="100%" height="100%" :src="item.pic" alt="">
</el-carousel> </el-carousel-item>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div> </template>
</div> </el-carousel>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div>
<div class="block history gray"> </div>
<div class="inner c-wrap">
<h2 style="margin-left: 57px">{{ modules[1].form.title }}</h2> <div class="block history gray">
<div class="texts"> <div class="inner c-wrap">
<div class="left"> <h2 style="margin-left: 57px">{{ modules[1].form.title }}</h2>
<h2>{{ modules[1].form.subTitle }}</h2> <div class="texts">
<div class="line"></div> <div class="left">
<div class="des">{{ modules[1].form.des }}</div> <h2>{{ modules[1].form.subTitle }}</h2>
<div class="line"></div>
<div class="des">{{ modules[1].form.des }}</div>
</div>
<img class="bg" width="562" height="506" :src="modules[1].form.pic" alt="">
</div> </div>
<img class="bg" width="562" height="506" :src="modules[1].form.pic" alt=""> <div class="cover" @click="toSet(1)">点击更改图片标题概述与链接</div>
</div> </div>
<div class="cover" @click="toSet(1)">点击更改图片标题概述与链接</div>
</div> </div>
</div>
<div class="block"> <div class="block">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title">{{ modules[2].form.title }}</h2> <h2 class="b-title">{{ modules[2].form.title }}</h2>
<p class="intro">{{ modules[2].form.des }}</p> <p class="intro">{{ modules[2].form.des }}</p>
<div class="cover" @click="toSet(2)">点击更换标题与描述</div> <div class="cover" @click="toSet(2)">点击更换标题与描述</div>
</div>
<ul class="card">
<li class="item1">
<h6>{{ modules[3].form.title }}</h6>
<div class="des" v-html="modules[3].form.des"></div>
<div class="cover" @click="toSet(3)">点击更换标题概述与跳转</div>
</li>
<li class="item2">
<h6>{{ modules[4].form.title }}</h6>
<div class="des" v-html="modules[4].form.des"></div>
<div class="cover" @click="toSet(4)">点击更换标题概述与跳转</div>
</li>
<li class="item3">
<h6>{{ modules[5].form.title }}</h6>
<div class="des" v-html="modules[5].form.des"></div>
<div class="cover" @click="toSet(5)">点击更换标题概述与跳转</div>
</li>
<li class="item4">
<h6>{{ modules[6].form.title }}</h6>
<div class="des" v-html="modules[6].form.des"></div>
<div class="cover" @click="toSet(6)">点击更换标题概述与跳转</div>
</li>
</ul>
</div> </div>
<ul class="card">
<li class="item1">
<h6>{{ modules[3].form.title }}</h6>
<div class="des" v-html="modules[3].form.des"></div>
<div class="cover" @click="toSet(3)">点击更换标题概述与跳转</div>
</li>
<li class="item2">
<h6>{{ modules[4].form.title }}</h6>
<div class="des" v-html="modules[4].form.des"></div>
<div class="cover" @click="toSet(4)">点击更换标题概述与跳转</div>
</li>
<li class="item3">
<h6>{{ modules[5].form.title }}</h6>
<div class="des" v-html="modules[5].form.des"></div>
<div class="cover" @click="toSet(5)">点击更换标题概述与跳转</div>
</li>
<li class="item4">
<h6>{{ modules[6].form.title }}</h6>
<div class="des" v-html="modules[6].form.des"></div>
<div class="cover" @click="toSet(6)">点击更换标题概述与跳转</div>
</li>
</ul>
</div> </div>
</div>
<div class="block gray"> <div class="block gray">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title">{{ modules[7].form.title }}</h2> <h2 class="b-title">{{ modules[7].form.title }}</h2>
<p class="intro">{{ modules[7].form.des }}</p> <p class="intro">{{ modules[7].form.des }}</p>
<div class="cover" @click="toSet(7)">点击更换标题与描述</div> <div class="cover" @click="toSet(7)">点击更换标题与描述</div>
</div>
<ul class="stat">
<li>
<p class="num">{{ modules[8].form.title }}</p>
<p class="text">{{ modules[8].form.des }}</p>
<div class="cover" @click="toSet(8)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[9].form.title }}</p>
<p class="text">{{ modules[9].form.des }}</p>
<div class="cover" @click="toSet(9)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[10].form.title }}</p>
<p class="text">{{ modules[10].form.des }}</p>
<div class="cover" @click="toSet(10)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[11].form.title }}</p>
<p class="text">{{ modules[11].form.des }}</p>
<div class="cover" @click="toSet(11)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[12].form.title }}</p>
<p class="text">{{ modules[12].form.des }}</p>
<div class="cover" @click="toSet(12)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[13].form.title }}</p>
<p class="text">{{ modules[13].form.des }}</p>
<div class="cover" @click="toSet(13)">点击更换标题与描述</div>
</li>
</ul>
</div> </div>
<ul class="stat">
<li>
<p class="num">{{ modules[8].form.title }}</p>
<p class="text">{{ modules[8].form.des }}</p>
<div class="cover" @click="toSet(8)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[9].form.title }}</p>
<p class="text">{{ modules[9].form.des }}</p>
<div class="cover" @click="toSet(9)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[10].form.title }}</p>
<p class="text">{{ modules[10].form.des }}</p>
<div class="cover" @click="toSet(10)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[11].form.title }}</p>
<p class="text">{{ modules[11].form.des }}</p>
<div class="cover" @click="toSet(11)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[12].form.title }}</p>
<p class="text">{{ modules[12].form.des }}</p>
<div class="cover" @click="toSet(12)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[13].form.title }}</p>
<p class="text">{{ modules[13].form.des }}</p>
<div class="cover" @click="toSet(13)">点击更换标题与描述</div>
</li>
</ul>
</div> </div>
</div>
<div class="plan"> <div class="plan">
<div class="inner c-wrap"> <div class="inner c-wrap">
<img class="pic" :src="modules[14].form.pic" alt=""> <img class="pic" :src="modules[14].form.pic" alt="">
<div class="texts"> <div class="texts">
<h6>{{ modules[14].form.title }}</h6> <h6>{{ modules[14].form.title }}</h6>
<div class="des">{{ modules[14].form.des }}</div> <div class="des">{{ modules[14].form.des }}</div>
<img src="@/assets/images/arrow-white.png" alt=""> <img src="@/assets/images/arrow-white.png" alt="">
</div>
<div class="cover" @click="toSet(14)">点击更换标题概述与跳转</div>
</div> </div>
<div class="cover" @click="toSet(14)">点击更换标题概述与跳转</div>
</div> </div>
</div>
<div class="block"> <div class="block">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title">{{ modules[15].form.title }}</h2> <h2 class="b-title">{{ modules[15].form.title }}</h2>
<p class="intro">{{ modules[15].form.des }}</p> <p class="intro">{{ modules[15].form.des }}</p>
<div class="cover" @click="toSet(15)">点击更换标题与描述</div> <div class="cover" @click="toSet(15)">点击更换标题与描述</div>
</div>
<ul class="people">
<li v-for="(item, i) in modules[16].list" :key="i">
<img class="pic" :src="item.pic" alt="">
<div class="texts">
<p class="sub">{{ item.title }}</p>
<h6>{{ item.subTitle }}</h6>
<p class="des">{{ item.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
</li>
<div class="cover" @click="toSet(16)">点击更改图片标题概述与链接</div>
</ul>
</div> </div>
<ul class="people">
<li v-for="(item, i) in modules[16].list" :key="i">
<img class="pic" :src="item.pic" alt="">
<div class="texts">
<p class="sub">{{ item.title }}</p>
<h6>{{ item.subTitle }}</h6>
<p class="des">{{ item.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
</li>
<div class="cover" @click="toSet(16)">点击更改图片标题概述与链接</div>
</ul>
</div> </div>
</div>
<div class="block list-block gray"> <div class="block list-block gray">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title">{{ modules[17].form.title }}</h2> <h2 class="b-title">{{ modules[17].form.title }}</h2>
<p class="intro">{{ modules[17].form.des }}</p> <p class="intro">{{ modules[17].form.des }}</p>
<div class="cover" @click="toSet(17)">点击更换标题与描述</div> <div class="cover" @click="toSet(17)">点击更换标题与描述</div>
</div>
<ul class="list">
<li>
<img class="pic" :src="modules[18].form.pic" alt="">
<h6>{{ modules[18].form.title }}</h6>
<p class="des">{{ modules[18].form.des }}</p>
<div class="cover" @click="toSet(18)">点击更改图片标题概述与链接</div>
</li>
<li>
<img class="pic" :src="modules[19].form.pic" alt="">
<h6>{{ modules[19].form.title }}</h6>
<p class="des">{{ modules[19].form.des }}</p>
<div class="cover" @click="toSet(19)">点击更改图片标题概述与链接</div>
</li>
<li>
<img class="pic" :src="modules[20].form.pic" alt="">
<h6>{{ modules[20].form.title }}</h6>
<p class="des">{{ modules[20].form.des }}</p>
<div class="cover" @click="toSet(20)">点击更改图片标题概述与链接</div>
</li>
</ul>
</div> </div>
<ul class="list">
<li>
<img class="pic" :src="modules[18].form.pic" alt="">
<h6>{{ modules[18].form.title }}</h6>
<p class="des">{{ modules[18].form.des }}</p>
<div class="cover" @click="toSet(18)">点击更改图片标题概述与链接</div>
</li>
<li>
<img class="pic" :src="modules[19].form.pic" alt="">
<h6>{{ modules[19].form.title }}</h6>
<p class="des">{{ modules[19].form.des }}</p>
<div class="cover" @click="toSet(19)">点击更改图片标题概述与链接</div>
</li>
<li>
<img class="pic" :src="modules[20].form.pic" alt="">
<h6>{{ modules[20].form.title }}</h6>
<p class="des">{{ modules[20].form.des }}</p>
<div class="cover" @click="toSet(20)">点击更改图片标题概述与链接</div>
</li>
</ul>
</div> </div>
</div>
<div class="block"> <div class="block">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title">{{ modules[21].form.title }}</h2> <h2 class="b-title">{{ modules[21].form.title }}</h2>
<p class="intro">{{ modules[21].form.des }}</p> <p class="intro">{{ modules[21].form.des }}</p>
<div class="cover" @click="toSet(21)">点击更换标题与描述</div> <div class="cover" @click="toSet(21)">点击更换标题与描述</div>
</div> </div>
<div class="staff"> <div class="staff">
<div class="left"> <div class="left">
<h6>{{ modules[22].form.title }}</h6> <h6>{{ modules[22].form.title }}</h6>
<div class="des">{{ modules[22].form.des }}</div> <div class="des">{{ modules[22].form.des }}</div>
</div>
<img class="pic" :src="modules[22].form.pic" alt="">
<div class="cover" @click="toSet(22)">点击更改图片标题概述与链接</div>
</div> </div>
<img class="pic" :src="modules[22].form.pic" alt="">
<div class="cover" @click="toSet(22)">点击更改图片标题概述与链接</div>
</div> </div>
</div> </div>
</div> </div>
<Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" /> <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
</div> </div>
</template> </template>
@ -211,7 +214,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -236,7 +239,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'textarea',
prop: 'subTitle', prop: 'subTitle',
label: '小标题' label: '小标题'
}, },
@ -261,7 +264,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -320,7 +323,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -357,7 +360,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -394,7 +397,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -431,7 +434,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -614,7 +617,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -658,7 +661,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'textarea',
prop: 'subTitle', prop: 'subTitle',
label: '小标题' label: '小标题'
}, },
@ -683,16 +686,17 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
}, },
des: '' des: '',
isEnable: 1
}, },
list: [ list: [
{ {
pic: require('@/assets/images/channel/channel1.png'), pic: require('@/assets/images/about/6.png'),
title: 'Founder and 1st PRESIDENT OF THE INSTITUTE OF ADVANCED SCIENCE FACILITIES, SHENZHEN', title: 'Founder and 1st PRESIDENT OF THE INSTITUTE OF ADVANCED SCIENCE FACILITIES, SHENZHEN',
subTitle: 'Sun Dongbai', subTitle: 'Sun Dongbai',
link: { link: {
@ -701,13 +705,49 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
}, },
des: 'Dr. Sun was the executive vice president of Sun Yat- and vice president of the University of Science and Technology Beijing (2008-2017). One of the most widely well-known material scientists aation', des: 'Dr. Sun was the executive vice president of Sun Yat- and vice president of the University of Science and Technology Beijing (2008-2017). One of the most widely well-known material scientists aation',
isEnable: 1 isEnable: 1
},
{
pic: require('@/assets/images/about/7.png'),
title: 'Vice President of the Institute of Advanced Scienc, Shenzhen',
subTitle: 'Yang Xueming',
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
},
des: 'Dr. Yang is a world-recognized physical chemistry scientist, an Academician of the Chinese Academy of Science, an awardee of the National Science Fund for Distinguished Young Scholars',
isEnable: 1
},
{
pic: require('@/assets/images/about/8.png'),
title: 'The Chairman of Science and Technology Advisory Committee',
subTitle: 'Ulf KALSSON',
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
},
des: 'Dr. Ulf Karlsson is a joint professor of Linköping University and KTH Royal Institute of Technology. He established the laboratory of material science and was the director of the materials science platform',
isEnable: 1
} }
] ]
}, },
@ -767,7 +807,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -811,7 +851,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -855,7 +895,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -919,7 +959,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1

@ -7,103 +7,106 @@
<el-button @click="$router.back()">放弃编辑</el-button> <el-button @click="$router.back()">放弃编辑</el-button>
</div> </div>
<div class="relative"> <div class="modules">
<el-carousel height="480px"> <p class="page-name mb">页面设置</p>
<template v-for="(item, i) in modules[0].list"> <div class="relative">
<el-carousel-item v-if="item.pic" :key="i"> <el-carousel height="480px">
<img width="100%" height="100%" :src="item.pic" alt=""> <template v-for="(item, i) in modules[0].list">
</el-carousel-item> <el-carousel-item v-if="item.pic" :key="i">
</template> <img width="100%" height="100%" :src="item.pic" alt="">
</el-carousel> </el-carousel-item>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div> </template>
</div> </el-carousel>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div>
<div class="block">
<div class="inner">
<ul class="card">
<li>
<img class="pic" :src="modules[1].form.pic" alt="">
<div class="texts">
<h6>{{ modules[1].form.title }}</h6>
<p class="text">{{ modules[1].form.des }}</p>
</div>
<div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="">
</div>
<div class="cover" @click="toSet(1)">点击更换标题与描述</div>
</li>
<li>
<img class="pic" :src="modules[2].form.pic" alt="">
<div class="texts">
<h6>{{ modules[2].form.title }}</h6>
<p class="text">{{ modules[2].form.des }}</p>
</div>
<div class="arrow">
<img src="@/assets/images/arrow-white.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>
<p class="text">{{ modules[3].form.des }}</p>
</div>
<div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="">
</div>
<div class="cover" @click="toSet(3)">点击更换标题与描述</div>
</li>
<li>
<img class="pic" :src="modules[4].form.pic" alt="">
<div class="texts">
<h6>{{ modules[4].form.title }}</h6>
<p class="text">{{ modules[4].form.des }}</p>
</div>
<div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="">
</div>
<div class="cover" @click="toSet(4)">点击更换标题与描述</div>
</li>
</ul>
</div> </div>
</div>
<div class="block gray"> <div class="block">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <ul class="card">
<h2 class="b-title">{{ modules[5].form.title }}</h2> <li>
<p class="intro">{{ modules[5].form.des }}</p> <img class="pic" :src="modules[1].form.pic" alt="">
<div class="cover" @click="toSet(5)">点击更换标题与描述</div> <div class="texts">
<h6>{{ modules[1].form.title }}</h6>
<p class="text">{{ modules[1].form.des }}</p>
</div>
<div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="">
</div>
<div class="cover" @click="toSet(1)">点击更换标题与描述</div>
</li>
<li>
<img class="pic" :src="modules[2].form.pic" alt="">
<div class="texts">
<h6>{{ modules[2].form.title }}</h6>
<p class="text">{{ modules[2].form.des }}</p>
</div>
<div class="arrow">
<img src="@/assets/images/arrow-white.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>
<p class="text">{{ modules[3].form.des }}</p>
</div>
<div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="">
</div>
<div class="cover" @click="toSet(3)">点击更换标题与描述</div>
</li>
<li>
<img class="pic" :src="modules[4].form.pic" alt="">
<div class="texts">
<h6>{{ modules[4].form.title }}</h6>
<p class="text">{{ modules[4].form.des }}</p>
</div>
<div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="">
</div>
<div class="cover" @click="toSet(4)">点击更换标题与描述</div>
</li>
</ul>
</div> </div>
<ul class="people">
<li v-for="(item, i) in modules[6].list" :key="i">
<img class="comma" src="@/assets/images/comma.png" alt="">
<div class="left">
<h6>{{ item.title }}</h6>
<div class="des">{{ item.des }}</div>
</div>
<img class="pic" :src="item.pic" alt="">
</li>
<div class="cover" @click="toSet(6)">点击更换标题与描述</div>
</ul>
</div> </div>
</div>
<ul class="shows"> <div class="block gray">
<li v-for="(item, i) in modules[7].list" :key="i"> <div class="inner">
<img class="pic" :src="item.pic" alt=""> <div class="c-wrap">
<div class="left"> <h2 class="b-title">{{ modules[5].form.title }}</h2>
<h6>{{ item.title }}</h6> <p class="intro">{{ modules[5].form.des }}</p>
<div class="sub">{{ item.subTitle }}</div> <div class="cover" @click="toSet(5)">点击更换标题与描述</div>
<div class="des">{{ item.des }}</div> </div>
<img class="arrow" src="@/assets/images/arrow-white.png" alt=""> <ul class="people">
<li v-for="(item, i) in modules[6].list" :key="i">
<img class="comma" src="@/assets/images/comma.png" alt="">
<div class="left">
<h6>{{ item.title }}</h6>
<div class="des">{{ item.des }}</div>
</div>
<img class="pic" :src="item.pic" alt="">
</li>
<div class="cover" @click="toSet(6)">点击更换标题与描述</div>
</ul>
</div> </div>
</li> </div>
<div class="cover" @click="toSet(7)">点击更换标题与描述</div>
</ul> <ul class="shows">
<li v-for="(item, i) in modules[7].list" :key="i">
<img class="pic" :src="item.pic" alt="">
<div class="left">
<h6>{{ item.title }}</h6>
<div class="sub">{{ item.subTitle }}</div>
<div class="des">{{ item.des }}</div>
<img class="arrow" src="@/assets/images/arrow-white.png" alt="">
</div>
</li>
<div class="cover" @click="toSet(7)">点击更换标题与描述</div>
</ul>
</div>
<Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" /> <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
</div> </div>
</template> </template>
@ -125,7 +128,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -169,7 +172,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -212,7 +215,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -255,7 +258,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -298,7 +301,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -361,7 +364,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -378,7 +381,41 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
},
des: 'Throughout the world, most of the top science and technology innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan.',
isEnable: 1
},
{
pic: require('@/assets/images/careers/7.png'),
title: 'IASF started its journey to chase light, push the boundaries forward, and discover the unknown.',
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
},
des: 'Throughout the world, most of the top science and technology innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan.',
isEnable: 1
},
{
pic: require('@/assets/images/careers/8.png'),
title: 'IASF started its journey to chase light, push the boundaries forward, and discover the unknown.',
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -387,7 +424,8 @@ export default {
isEnable: 1 isEnable: 1
} }
] ]
},{ },
{
type: 'introduce', type: 'introduce',
forms: [ forms: [
{ {
@ -403,7 +441,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'textarea',
prop: 'subTitle', prop: 'subTitle',
label: '小标题' label: '小标题'
}, },
@ -428,7 +466,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -446,7 +484,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1

@ -7,54 +7,60 @@
<el-button @click="$router.back()">放弃编辑</el-button> <el-button @click="$router.back()">放弃编辑</el-button>
</div> </div>
<div class="relative"> <div class="modules">
<el-carousel height="480px"> <p class="page-name mb">页面设置</p>
<template v-for="(item, i) in modules[0].list"> <div class="relative">
<el-carousel-item v-if="item.pic" :key="i"> <el-carousel height="480px">
<img width="100%" height="100%" :src="item.pic" alt=""> <template v-for="(item, i) in modules[0].list">
</el-carousel-item> <el-carousel-item v-if="item.pic" :key="i">
</template> <img width="100%" height="100%" :src="item.pic" alt="">
</el-carousel> </el-carousel-item>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div> </template>
</div> </el-carousel>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div>
</div>
<div class="block gray"> <div class="block gray">
<div class="inner c-wrap"> <div class="inner c-wrap">
<h2 class="b-title">{{ modules[1].form.title }}</h2> <h2 class="b-title">{{ modules[1].form.title }}</h2>
<p class="intro">{{ modules[1].form.des }}</p> <p class="intro">{{ modules[1].form.des }}</p>
<img width="100%" height="536" :src="modules[1].form.pic" alt=""> <img width="100%" height="536" :src="modules[1].form.pic" alt="">
<div class="cover" @click="toSet(1)">点击更改图片标题概述与链接</div> <div class="cover" @click="toSet(1)">点击更改图片标题概述与链接</div>
</div>
</div> </div>
</div>
<div class="block">
<div class="block"> <div class="inner c-wrap">
<div class="inner c-wrap"> <h2 class="b-title">{{ modules[2].form.title }}</h2>
<h2 class="b-title">{{ modules[2].form.title }}</h2> <p class="intro">{{ modules[2].form.des }}</p>
<p class="intro">{{ modules[2].form.des }}</p> <img width="100%" height="536" :src="modules[1].form.pic" alt="">
<img width="100%" height="536" :src="modules[1].form.pic" alt=""> <div class="cover" @click="toSet(2)">点击更改图片标题概述与链接</div>
<div class="cover" @click="toSet(2)">点击更改图片标题概述与链接</div> </div>
</div> </div>
</div>
<div class="block gray">
<div class="block gray"> <div class="inner">
<div class="inner c-wrap"> <div class="c-wrap">
<h2 class="b-title">Engagement</h2> <h2 class="b-title">{{ modules[3].form.title }}</h2>
<p class="intro">Serving Community</p> <p class="intro">{{ modules[3].form.des }}</p>
<ul class="list"> <div class="cover" @click="toSet(3)">点击更换标题与描述</div>
<li v-for="(item, i) in modules[3].list" :key="i"> </div>
<img class="pic" :src="item.pic" alt=""> <ul class="list c-wrap">
<div class="texts"> <li v-for="(item, i) in modules[4].list" :key="i">
<h6>{{ item.title }}</h6> <img class="pic" :src="item.pic" alt="">
<p class="sub">{{ item.subTitle }}</p> <div class="texts">
<div class="des">{{ item.des }}</div> <h6>{{ item.title }}</h6>
</div> <p class="sub">{{ item.subTitle }}</p>
</li> <div class="des">{{ item.des }}</div>
</ul> </div>
<div class="cover" @click="toSet(3)">点击更改图片标题概述与链接</div> </li>
<div class="cover" @click="toSet(4)">点击更改图片标题概述与链接</div>
</ul>
</div>
</div> </div>
</div> </div>
<Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" /> <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
</div> </div>
</template> </template>
@ -76,7 +82,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -120,7 +126,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -163,7 +169,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -171,6 +177,26 @@ export default {
des: `Our campus is Shenzhen and Beyound` des: `Our campus is Shenzhen and Beyound`
} }
}, },
{
type: 'form',
forms: [
{
type: 'input',
prop: 'title',
label: '标题',
required: true
},
{
type: 'textarea',
prop: 'des',
label: '概述'
}
],
form: {
title: 'Engagement',
des: 'Serving Community'
}
},
{ {
type: 'introduce', type: 'introduce',
forms: [ forms: [
@ -187,7 +213,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'textarea',
prop: 'subTitle', prop: 'subTitle',
label: '小标题' label: '小标题'
}, },
@ -212,7 +238,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -230,7 +256,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1

@ -7,181 +7,184 @@
<el-button @click="$router.back()">放弃编辑</el-button> <el-button @click="$router.back()">放弃编辑</el-button>
</div> </div>
<div class="relative"> <div class="modules">
<el-carousel height="500px"> <p class="page-name mb">页面设置</p>
<template v-for="(item, i) in modules[0].list"> <div class="relative">
<el-carousel-item v-if="item.pic" :key="i"> <el-carousel height="500px">
<img width="100%" height="100%" :src="item.pic" alt=""> <template v-for="(item, i) in modules[0].list">
</el-carousel-item> <el-carousel-item v-if="item.pic" :key="i">
</template> <img width="100%" height="100%" :src="item.pic" alt="">
</el-carousel> </el-carousel-item>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div> </template>
</div> </el-carousel>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div>
<div class="block"> </div>
<div class="inner">
<div class="c-wrap"> <div class="block">
<h2 class="b-title">{{ modules[1].form.title }}</h2> <div class="inner">
<p class="intro">{{ modules[1].form.des }}</p> <div class="c-wrap">
<div class="cover" @click="toSet(1)">点击更换标题与描述</div> <h2 class="b-title">{{ modules[1].form.title }}</h2>
<p class="intro">{{ modules[1].form.des }}</p>
<div class="cover" @click="toSet(1)">点击更换标题与描述</div>
</div>
<ul class="card">
<li>
<img width="100%" :src="modules[2].form.pic" alt="">
<div class="texts">
<h6>{{ modules[2].form.title }}</h6>
<p class="des">{{ modules[2].form.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
<div class="cover" @click="toSet(2)">点击更改图片标题概述与链接</div>
</li>
<li>
<img width="100%" :src="modules[3].form.pic" alt="">
<div class="texts">
<h6>{{ modules[3].form.title }}</h6>
<p class="des">{{ modules[3].form.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
<div class="cover" @click="toSet(3)">点击更改图片标题概述与链接</div>
</li>
</ul>
</div> </div>
<ul class="card">
<li>
<img width="100%" :src="modules[2].form.pic" alt="">
<div class="texts">
<h6>{{ modules[2].form.title }}</h6>
<p class="des">{{ modules[2].form.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
<div class="cover" @click="toSet(2)">点击更改图片标题概述与链接</div>
</li>
<li>
<img width="100%" :src="modules[3].form.pic" alt="">
<div class="texts">
<h6>{{ modules[3].form.title }}</h6>
<p class="des">{{ modules[3].form.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
<div class="cover" @click="toSet(3)">点击更改图片标题概述与链接</div>
</li>
</ul>
</div> </div>
</div>
<div class="block news-block">
<div class="block news-block"> <div class="inner">
<div class="inner"> <div class="c-wrap">
<div class="c-wrap"> <h2 class="b-title">{{ modules[4].form.title }}</h2>
<h2 class="b-title">{{ modules[4].form.title }}</h2> <p class="intro">{{ modules[4].form.des }}</p>
<p class="intro">{{ modules[4].form.des }}</p> <div class="cover" @click="toSet(4)">点击更换标题与描述</div>
<div class="cover" @click="toSet(4)">点击更换标题与描述</div> </div>
<ul class="news">
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<div class="cover" @click="toSet(5)">点击更换标题与描述</div>
</ul>
</div> </div>
<ul class="news">
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<li>
<img src="@/assets/images/channel/channel1.png" alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<div class="cover" @click="toSet(5)">点击更换标题与描述</div>
</ul>
</div> </div>
</div>
<div class="block">
<div class="block"> <div class="inner">
<div class="inner"> <div class="c-wrap">
<div class="c-wrap"> <h2 class="b-title">{{ modules[6].form.title }}</h2>
<h2 class="b-title">{{ modules[6].form.title }}</h2> <p class="intro">{{ modules[6].form.des }}</p>
<p class="intro">{{ modules[6].form.des }}</p> <div class="cover" @click="toSet(6)">点击更换标题与描述</div>
<div class="cover" @click="toSet(6)">点击更换标题与描述</div> </div>
<ul class="people">
<li v-for="(item, i) in modules[7].list" :key="i">
<img class="pic" :src="item.pic" alt="">
<div class="texts">
<h6>{{ item.title }}</h6>
<p class="des">{{ item.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
</li>
<div class="cover" @click="toSet(7)">点击更改图片标题概述与链接</div>
</ul>
</div> </div>
<ul class="people">
<li v-for="(item, i) in modules[7].list" :key="i">
<img class="pic" :src="item.pic" alt="">
<div class="texts">
<h6>{{ item.title }}</h6>
<p class="des">{{ item.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
</li>
<div class="cover" @click="toSet(7)">点击更改图片标题概述与链接</div>
</ul>
</div> </div>
</div>
<div class="about"> <div class="about">
<div class="inner"> <div class="inner">
<img src="@/assets/images/channel/about.png" alt=""> <img src="@/assets/images/channel/about.png" alt="">
<div class="line"></div> <div class="line"></div>
<div class="text">{{ modules[8].form.title }}</div> <div class="text">{{ modules[8].form.title }}</div>
<div class="des" v-html="modules[8].form.des"></div> <div class="des" v-html="modules[8].form.des"></div>
</div>
<div class="cover" @click="toSet(8)">点击更换标题与描述</div>
</div> </div>
<div class="cover" @click="toSet(8)">点击更换标题与描述</div>
</div>
<div class="block" style="padding-bottom: 0"> <div class="block" style="padding-bottom: 0">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="glance">{{ modules[9].form.title }}</h2> <h2 class="glance">{{ modules[9].form.title }}</h2>
<div class="cover" @click="toSet(9)">点击更换标题与描述</div> <div class="cover" @click="toSet(9)">点击更换标题与描述</div>
</div>
<ul class="stat">
<li>
<p class="num">{{ modules[10].form.title }}</p>
<p class="text">{{ modules[10].form.des }}</p>
<div class="cover" @click="toSet(10)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[11].form.title }}</p>
<p class="text">{{ modules[11].form.des }}</p>
<div class="cover" @click="toSet(11)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[12].form.title }}</p>
<p class="text">{{ modules[12].form.des }}</p>
<div class="cover" @click="toSet(12)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[13].form.title }}</p>
<p class="text">{{ modules[13].form.des }}</p>
<div class="cover" @click="toSet(13)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[14].form.title }}</p>
<p class="text">{{ modules[14].form.des }}</p>
<div class="cover" @click="toSet(14)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[15].form.title }}</p>
<p class="text">{{ modules[15].form.des }}</p>
<div class="cover" @click="toSet(15)">点击更换标题与描述</div>
</li>
</ul>
</div> </div>
<ul class="stat">
<li>
<p class="num">{{ modules[10].form.title }}</p>
<p class="text">{{ modules[10].form.des }}</p>
<div class="cover" @click="toSet(10)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[11].form.title }}</p>
<p class="text">{{ modules[11].form.des }}</p>
<div class="cover" @click="toSet(11)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[12].form.title }}</p>
<p class="text">{{ modules[12].form.des }}</p>
<div class="cover" @click="toSet(12)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[13].form.title }}</p>
<p class="text">{{ modules[13].form.des }}</p>
<div class="cover" @click="toSet(13)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[14].form.title }}</p>
<p class="text">{{ modules[14].form.des }}</p>
<div class="cover" @click="toSet(14)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[15].form.title }}</p>
<p class="text">{{ modules[15].form.des }}</p>
<div class="cover" @click="toSet(15)">点击更换标题与描述</div>
</li>
</ul>
</div> </div>
</div> </div>
<Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" /> <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
</div> </div>
</template> </template>
@ -203,7 +206,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -267,7 +270,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -310,7 +313,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -384,7 +387,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'textarea',
prop: 'subTitle', prop: 'subTitle',
label: '小标题' label: '小标题'
}, },
@ -409,7 +412,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -427,7 +430,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -466,7 +469,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1

@ -6,169 +6,169 @@
<el-button type="primary" @click="save(1)">发布</el-button> <el-button type="primary" @click="save(1)">发布</el-button>
<el-button @click="$router.back()">放弃编辑</el-button> <el-button @click="$router.back()">放弃编辑</el-button>
</div> </div>
<div class="modules">
<p class="page-name mb">页面设置</p>
<div class="relative">
<el-carousel height="480px">
<template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic" :key="i">
<img width="100%" height="100%" :src="item.pic" alt="">
</el-carousel-item>
</template>
</el-carousel>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div>
</div>
<div class="relative"> <ul class="tabs">
<el-carousel height="480px"> <li :class="{active: item.id == active}" v-for="(item, i) in modules[1].list" :key="i">
<template v-for="(item, i) in modules[0].list"> {{ item.columnName }}
<el-carousel-item v-if="item.pic" :key="i"> <div class="cover" @click="toSet(1, i)">关联栏目</div>
<img width="100%" height="100%" :src="item.pic" alt=""> </li>
</el-carousel-item> </ul>
</template>
</el-carousel>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div>
</div>
<ul class="tabs">
<li :class="{active: item.id == active}" v-for="(item, i) in tabs" :key="i">
{{ item.name }}
<div class="cover" @click="toSet(1, i)">关联栏目</div>
</li>
</ul>
<div class="block"> <div class="block">
<div class="inner"> <div class="inner">
<h2 class="b-title">Seminars & Workshops</h2> <div class="banner">
<p class="intro">What makes a ligh chinese bay chaser</p> <img width="100%" height="480" src="@/assets/images/about/5.png" alt="">
<div class="banner"> <div class="right">
<img width="100%" height="480" src="@/assets/images/about/5.png" alt=""> <h6>IASF is driven to serve the Science and industry, and solve grand challenges through research and innovation. We are open and creative</h6>
<div class="right"> <div class="des">Innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan. And the Guangdong-Hong Kong-Macao Greater Bay </div>
<h6>IASF is driven to serve the Science and industry, and solve grand challenges through research and innovation. We are open and creative</h6> <p class="meta">2022-07-24 | Research</p>
<div class="des">Innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan. And the Guangdong-Hong Kong-Macao Greater Bay </div> </div>
<p class="meta">2022-07-24 | Research</p>
</div> </div>
<ul class="card">
<li>
<img class="pic" src="@/assets/images/about/9.png" alt="">
<div class="texts">
<p class="meta">2022-09-09 | Research</p>
<div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
</li>
<li>
<img class="pic" src="@/assets/images/about/10.png" alt="">
<div class="texts">
<p class="meta">2022-09-09 | Research</p>
<div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
</li>
<li>
<img class="pic" src="@/assets/images/about/11.png" alt="">
<div class="texts">
<p class="meta">2022-09-09 | Research</p>
<div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
</li>
</ul>
<div class="more">More news ></div>
</div> </div>
<ul class="card"> </div>
<li>
<img class="pic" src="@/assets/images/about/9.png" alt=""> <div class="block gray">
<div class="texts"> <div class="inner lg">
<p class="meta">2022-09-09 | Research</p> <div class="c-wrap">
<div class="des">IASF is driven to serve the Science and industry, and solve grand </div> <h2 class="b-title">{{ modules[2].form.title }}</h2>
<img class="arrow" src="@/assets/images/arrow.png" alt=""> <p class="intro">{{ modules[2].form.des }}</p>
</div> <div class="cover" @click="toSet(2)">点击更换标题与描述</div>
</li> </div>
<li> <div class="shop-shows">
<img class="pic" src="@/assets/images/about/10.png" alt=""> <div class="left">
<div class="texts"> <img width="100%" height="400" src="@/assets/images/about/5.png" alt="">
<p class="meta">2022-09-09 | Research</p> <div class="texts">
<div class="des">IASF is driven to serve the Science and industry, and solve grand </div> <h6>2022 New Year Messag President Sun Dongbai.</h6>
<img class="arrow" src="@/assets/images/arrow.png" alt=""> <div class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</div>
</div>
</div> </div>
</li> <div class="right">
<li> <ul class="show-card">
<img class="pic" src="@/assets/images/about/11.png" alt=""> <li>
<div class="texts"> <img class="pic" src="@/assets/images/about/9.png" alt="">
<p class="meta">2022-09-09 | Research</p> <div class="des">Comprises the installation and nanostructuri</div>
<div class="des">IASF is driven to serve the Science and industry, and solve grand </div> </li>
<img class="arrow" src="@/assets/images/arrow.png" alt=""> <li>
<img class="pic" src="@/assets/images/about/10.png" alt="">
<div class="des">Prof. Stephan V. Roth's research</div>
</li>
</ul>
<ul class="card-list">
<li>
<img class="pic" src="@/assets/images/about/9.png" alt="">
<div class="texts">
<h6>Hold doctorates or the highest degree in their field</h6>
<div class="des">Characterization in Fibre and Polymer Technology, KTH Royal Institute of Technology.Characteriza Royal Institute of technology.</div>
</div>
</li>
<li>
<img class="pic" src="@/assets/images/about/10.png" alt="">
<div class="texts">
<h6>This 2019 image depicted a Centers for Disease</h6>
<div class="des">laboratory technician, dressed in personal protective equipment (PPE), in thelaboratory technician, dressed in personal in the</div>
</div>
</li>
<li>
<img class="pic" src="@/assets/images/about/11.png" alt="">
<div class="texts">
<h6>Browse premium related images on iStock</h6>
<div class="des">which would undergo analysis, here, in this laboratory environment.which would undergo analysis, here, in this laboratory environment.</div>
</div>
</li>
</ul>
</div> </div>
</li> <div class="cover" @click="toSet(3)">关联栏目</div>
</ul> </div>
<div class="more">More news ></div> </div>
</div> </div>
</div>
<div class="block gray"> <div class="block conference">
<div class="inner lg"> <div class="inner lg">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title">{{ modules[2].form.title }}</h2> <h2 class="b-title">{{ modules[4].form.title }}</h2>
<p class="intro">{{ modules[2].form.des }}</p> <p class="intro">{{ modules[4].form.des }}</p>
<div class="cover" @click="toSet(2)">点击更换标题与描述</div> <div class="cover" @click="toSet(4)">点击更换标题与描述</div>
</div>
<div class="shop-shows">
<div class="left">
<img width="100%" height="400" src="@/assets/images/about/5.png" alt="">
<div class="texts">
<h6>2022 New Year Messag President Sun Dongbai.</h6>
<div class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</div>
</div>
</div> </div>
<div class="right"> <div class="shows">
<ul class="show-card"> <div class="left">
<li> <img width="100%" height="558" src="@/assets/images/about/5.png" alt="">
<img class="pic" src="@/assets/images/about/9.png" alt=""> <div class="texts">
<div class="des">Comprises the installation and nanostructuri</div> <div class="meta">
</li> <p class="date">09</p>
<li> <p class="year">2022-03</p>
<img class="pic" src="@/assets/images/about/10.png" alt="">
<div class="des">Prof. Stephan V. Roth's research</div>
</li>
</ul>
<ul class="card-list">
<li>
<img class="pic" src="@/assets/images/about/9.png" alt="">
<div class="texts">
<h6>Hold doctorates or the highest degree in their field</h6>
<div class="des">Characterization in Fibre and Polymer Technology, KTH Royal Institute of Technology.Characteriza Royal Institute of technology.</div>
</div> </div>
</li> <div>
<li> <h6>Browse premium related images on iStock</h6>
<img class="pic" src="@/assets/images/about/10.png" alt=""> <div class="des">which would undergo analysis, here, in this laboratory environment.which would undergo analysis, here, in this laboratory environment.</div>
<div class="texts">
<h6>This 2019 image depicted a Centers for Disease</h6>
<div class="des">laboratory technician, dressed in personal protective equipment (PPE), in thelaboratory technician, dressed in personal in the</div>
</div> </div>
</li> </div>
</div>
<ul class="card-list">
<li> <li>
<img class="pic" src="@/assets/images/about/11.png" alt=""> <img class="pic" src="@/assets/images/about/9.png" alt="">
<div class="texts"> <div class="texts">
<h6>Browse premium related images on iStock</h6> <h6>Professional technical Free electron laser device</h6>
<div class="des">which would undergo analysis, here, in this laboratory environment.which would undergo analysis, here, in this laboratory environment.</div> <p class="text">
<img class="icon" src="@/assets/images/address.png" alt="">
Jiahang Shao
</p>
<p class="text">
<img class="icon" src="@/assets/images/address.png" alt="">
Time: 2022.8.13 14:30
</p>
<p class="text">
<img class="icon" src="@/assets/images/address.png" alt="">
Address: Big conference room on the fourth floor of headquarters
</p>
</div> </div>
</li> </li>
</ul> </ul>
<div class="cover" @click="toSet(5)">关联栏目</div>
</div> </div>
<div class="cover" @click="toSet(3)">关联栏目</div>
</div>
</div>
</div>
<div class="block conference">
<div class="inner lg">
<div class="c-wrap">
<h2 class="b-title">{{ modules[4].form.title }}</h2>
<p class="intro">{{ modules[4].form.des }}</p>
<div class="cover" @click="toSet(4)">点击更换标题与描述</div>
</div>
<div class="shows">
<div class="left">
<img width="100%" height="558" src="@/assets/images/about/5.png" alt="">
<div class="texts">
<div class="meta">
<p class="date">09</p>
<p class="year">2022-03</p>
</div>
<div>
<h6>Browse premium related images on iStock</h6>
<div class="des">which would undergo analysis, here, in this laboratory environment.which would undergo analysis, here, in this laboratory environment.</div>
</div>
</div>
</div>
<ul class="card-list">
<li>
<img class="pic" src="@/assets/images/about/9.png" alt="">
<div class="texts">
<h6>Professional technical Free electron laser device</h6>
<p class="text">
<img class="icon" src="@/assets/images/address.png" alt="">
Jiahang Shao
</p>
<p class="text">
<img class="icon" src="@/assets/images/address.png" alt="">
Time: 2022.8.13 14:30
</p>
<p class="text">
<img class="icon" src="@/assets/images/address.png" alt="">
Address: Big conference room on the fourth floor of headquarters
</p>
</div>
</li>
</ul>
<div class="cover" @click="toSet(5)">关联栏目</div>
</div> </div>
</div> </div>
</div> </div>
<Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" /> <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
</div> </div>
</template> </template>
@ -190,7 +190,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -209,7 +209,56 @@ export default {
columnTitle: 1, columnTitle: 1,
columnTitleCustom: '' columnTitleCustom: ''
}, },
list: [] list: [
{
columnName: 'General news',
site: '',
column: '',
articleNum: '',
columnTitle: 1,
columnTitleCustom: ''
},
{
columnName: 'Research news',
site: '',
column: '',
articleNum: '',
columnTitle: 1,
columnTitleCustom: ''
},
{
columnName: 'General news',
site: '',
column: '',
articleNum: '',
columnTitle: 1,
columnTitleCustom: ''
},
{
columnName: 'General news',
site: '',
column: '',
articleNum: '',
columnTitle: 1,
columnTitleCustom: ''
},
{
columnName: 'Research news',
site: '',
column: '',
articleNum: '',
columnTitle: 1,
columnTitleCustom: ''
},
{
columnName: 'Journal covers',
site: '',
column: '',
articleNum: '',
columnTitle: 1,
columnTitleCustom: ''
},
]
}, },
{ {
type: 'form', type: 'form',

@ -7,35 +7,38 @@
<el-button @click="$router.back()">放弃编辑</el-button> <el-button @click="$router.back()">放弃编辑</el-button>
</div> </div>
<div class="relative"> <div class="modules">
<el-carousel height="480px"> <p class="page-name mb">页面设置</p>
<template v-for="(item, i) in modules[0].list"> <div class="relative">
<el-carousel-item v-if="item.pic" :key="i"> <el-carousel height="480px">
<img width="100%" height="100%" :src="item.pic" alt=""> <template v-for="(item, i) in modules[0].list">
</el-carousel-item> <el-carousel-item v-if="item.pic" :key="i">
</template> <img width="100%" height="100%" :src="item.pic" alt="">
</el-carousel> </el-carousel-item>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div> </template>
</div> </el-carousel>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div>
</div>
<div class="block"> <div class="block">
<div class="inner c-wrap"> <div class="inner c-wrap">
<ul class="list"> <ul class="list">
<li v-for="(item, i) in modules[1].list" :key="i"> <li v-for="(item, i) in modules[1].list" :key="i">
<img class="pic" :src="item.pic" alt=""> <img class="pic" :src="item.pic" alt="">
<div class="texts"> <div class="texts">
<h6>{{ item.title }}</h6> <h6>{{ item.title }}</h6>
<p class="sub">{{ item.subTitle }}</p> <p class="sub">{{ item.subTitle }}</p>
<div class="des">{{ item.des }}</div> <div class="des">{{ item.des }}</div>
<img src="@/assets/images/arrow.png" alt=""> <img src="@/assets/images/arrow.png" alt="">
</div> </div>
</li> </li>
</ul> </ul>
<div class="cover" @click="toSet(1)">点击更改图片标题概述与链接</div> <div class="cover" @click="toSet(1)">点击更改图片标题概述与链接</div>
</div>
</div> </div>
</div> </div>
<Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" /> <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
</div> </div>
</template> </template>
@ -57,7 +60,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -82,7 +85,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'textarea',
prop: 'subTitle', prop: 'subTitle',
label: '小标题' label: '小标题'
}, },
@ -107,7 +110,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1
@ -125,7 +128,7 @@ export default {
columnId: [], columnId: [],
articleId: '', articleId: '',
linkAddress : '', linkAddress : '',
siteSelection: '', site: '',
otherColumnId: [], otherColumnId: [],
otherArticleId: '', otherArticleId: '',
isOpen: 1 isOpen: 1

@ -509,9 +509,8 @@ export default {
}, },
// //
handleNodeClick(data) { handleNodeClick(data) {
this.$refs.table.clearSelection()
this.staffType = null this.staffType = null
this.getStaff() this.initData()
}, },
// //
closeOrg() { closeOrg() {

@ -8,6 +8,8 @@ router.beforeEach((to, from, next) => {
const role = util.local.get(Setting.tokenKey) const role = util.local.get(Setting.tokenKey)
if (!role && !whiteList.includes(to.path)) { if (!role && !whiteList.includes(to.path)) {
next('/login') next('/login')
} else if (role && to.path === '/login') {
next('/site')
} else { } else {
next() next()
} }

@ -39,17 +39,18 @@
border-radius: 0; border-radius: 0;
} }
} }
.page-name {
font-size: 16px;
font-weight: 600;
color: #333;
&.mb {
margin-bottom: 16px;
}
}
.page { .page {
position: relative; position: relative;
padding: 16px 20px; padding: 16px 20px;
background-color: #fff; background-color: #fff;
.page-name {
font-size: 14px;
color: #333;
&.mb {
margin-bottom: 16px;
}
}
.tool { .tool {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;

@ -37,6 +37,10 @@
background-color: #F2F6F8; background-color: #F2F6F8;
} }
.modules {
height: calc(100vh - 160px);
overflow: auto;
}
.actions { .actions {
margin-bottom: 20px; margin-bottom: 20px;
text-align: right; text-align: right;
@ -70,9 +74,10 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
flex-direction: column;
} }
.set-link { .set-link {
margin-left: 10px; margin-top: 5px;
} }
.del { .del {
margin-left: 5px; margin-left: 5px;

Loading…
Cancel
Save