jialong.yu
/
FE_IASF_server
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

fix

Browse Source
master
yujialong 1 year ago
parent dbe5b0d2f9
commit 18e94e69bf
11 changed files with 682 additions and 513 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 31
      src/components/img-upload/Cropper.vue
  2. 40
      src/components/modules/content.vue
  3. 167
      src/components/modules/module.vue
  4. 337
      src/const/modules.js
  5. 13
      src/mixins/page/index.js
  6. 3
      src/pages/article/add/index.vue
  7. 4
      src/pages/column/page/contactUs.vue
  8. 24
      src/pages/column/page/lightSources.vue
  9. 37
      src/pages/column/page/overview.vue
  10. 8
      src/pages/column/page/talentCenter.vue
  11. 21
      src/styles/page/page.scss

31
src/components/img-upload/Cropper.vue
Unescape View File

@ -3,8 +3,7 @@
<div class="cropper-content">
<!-- 剪裁框 -->
<div class="cropper">
<vueCropper
ref="cropper"
<vueCropper ref="cropper"
:img="option.img"
:output-size="option.size"
:output-type="option.outputType"
@ -14,8 +13,8 @@
:can-move-box="option.canMoveBox"
:original="option.original"
:auto-crop="option.autoCrop"
:auto-crop-width="option.autoCropWidth"
:auto-crop-height="option.autoCropHeight"
:auto-crop-width="autoCropWidth"
:auto-crop-height="autoCropHeight"
:fixed-box="option.fixedBox"
:fixed="fixed"
:fixed-number="fixedNumber"
@ -23,11 +22,12 @@
<!-- <vueCropper ref="cropper" :img="option.img" :outputSize="option.size" :outputType="option.outputType"></vueCropper> -->
</div>
<!-- 预览框 -->
<div
class="show-preview"
<div class="show-preview"
:style="{'width': '500px', 'height': '400px', 'overflow': 'hidden', 'margin': '0 25px', 'display':'flex', 'align-items' : 'center'}">
<div :style="previews.div" class="preview">
<img :src="previews.url" :style="previews.img" />
<div :style="previews.div"
class="preview">
<img :src="previews.url"
:style="previews.img" />
</div>
</div>
</div>
@ -41,8 +41,7 @@
</div>-->
<!-- 确认上传按钮 -->
<div class="upload-btn">
<el-button
type="primary"
<el-button type="primary"
:loading="isUpload"
:disabled="isDisabled"
@click.prevent="uploadImg('blob')">
@ -86,6 +85,16 @@ export default {
fixed: {
type: Boolean,
default: true
},
// 默认生成截图框宽度 (默认:80%)
autoCropWidth: {
type: Number,
default: 480
},
// 默认生成截图框高度 (默认:80%)
autoCropHeight: {
type: Number,
default: 124
}
},
data () {
@ -100,8 +109,6 @@ export default {
original: false, // 上传图片按照原始比例渲染 (默认:false)
canMoveBox: true, // 截图框能否拖动 (默认:true)
autoCrop: true, // 是否默认生成截图框 (默认:false)
autoCropWidth: 480, // 默认生成截图框宽度 (默认:80%)
autoCropHeight: 124, // 默认生成截图框高度 (默认:80%)
fixedBox: false, // 固定截图框大小 不允许改变 (默认:false)
fixed: true, // 是否开启截图框宽高固定比例 (默认:true)
fixedNumber: [1, 0.26], // 截图框比例 (默认:[1:1])

40
src/components/modules/content.vue
Unescape View File

@ -10,7 +10,7 @@
<el-form ref="form"
:model="data.form"
:rules="rules"
label-width="60px">
:label-width="data.labelWidth">
<el-form-item v-for="(item, i) in data.forms"
:key="i"
:prop="item.prop"
@ -142,7 +142,6 @@ export default {
cropperModel: false,
isUpload: false,
file: {}, // 当前被选择的图片文件
fileId: '',
curForm: {},
fixed: false,
fixedNumber: [0.88, 1]
@ -193,43 +192,6 @@ export default {
formData.append('file', data, this.file.name)
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
},
// base64转成bolb对象
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

167
src/components/modules/module.vue
Unescape View File

@ -1,7 +1,7 @@
<template>
<div>
<!--
模块type: introduce | form | forms | column | columns | history | customList
模块type: introduce | customList | form | forms | column | columns | history
-->
<el-dialog title="模块管理"
:visible.sync="visible"
@ -9,38 +9,9 @@
custom-class="module"
:close-on-click-modal="false"
:before-close="close">
<template v-if="data.type === 'introduce' || data.type === 'label' || data.type === 'customList'">
<el-table v-if="data.type === 'label'"
class="module-table"
:data="data.list"
header-align="center"
row-key="id">
<el-table-column type="index"
width="60"
label="序号"
align="center"></el-table-column>
<el-table-column prop="title"
label="标题"
min-width="140"
align="center">
<template slot-scope="scope">
<el-input v-model="scope.row.title"
placeholder="请输入"
maxlength="100"></el-input>
</template>
</el-table-column>
<el-table-column label="操作"
width="60"
align="center">
<template slot-scope="scope">
<div class="flex j-center a-center">
<i class="el-icon-delete del"
@click="delRow(data.list, scope.$index)"></i>
</div>
</template>
</el-table-column>
</el-table>
<el-table v-else-if="data.type === 'customList'"
<template v-if="data.type === 'introduce' || data.type === 'customList'">
<!-- introduce是可以设置图片和链接的，且大弹框内只会显示标题、图片、链接三个字段，其他能输入的字段只会在小弹框里显示； customList是纯输入框，会递归forms里面的字段显示在大弹框里面 -->
<el-table v-if="data.type === 'customList'"
class="module-table"
:data="data.list"
header-align="center"
@ -81,11 +52,20 @@
width="60"
label="序号"
align="center"></el-table-column>
<el-table-column v-if="data.forms.find(e => e.type === 'upload')"
label="图片"
min-width="140"
<el-table-column v-for="(item, i) in data.forms"
:key="i"
:prop="item.prop"
:label="item.label"
min-width="130"
align="center">
<template slot-scope="scope">
<div v-if="item.type === 'link'"
class="link-wrap">
<span>{{ scope.row.link.linkName }}</span>
</div>
<template v-else-if="item.type === 'upload'">
<img v-if="scope.row.pic"
:src="scope.row.pic"
class="upload-pic">
@ -94,21 +74,11 @@
<i class="el-icon-picture-outline"></i>
</div>
</template>
</el-table-column>
<el-table-column prop="title"
label="标题"
min-width="140"
align="center"></el-table-column>
<el-table-column v-if="data.forms.find(e => e.type === 'link')"
label="链接"
min-width="140"
align="center">
<template slot-scope="scope">
<div class="link-wrap">
<span>{{ scope.row.link.linkName }}</span>
</div>
<p v-else>{{ scope.row[item.prop] }}</p>
</template>
</el-table-column>
<el-table-column label="操作"
width="100"
align="center">
@ -135,7 +105,7 @@
ref="form"
:model="data.form"
:rules="rules"
label-width="60px">
label-width="70px">
<el-form-item v-for="(item, i) in data.forms"
:key="i"
:prop="item.prop"
@ -151,9 +121,10 @@
maxlength="300"></el-input>
<div v-if="item.type === 'upload' || item.type === 'video' || item.type === 'media'"
class="uploader-wrap">
<el-upload class="uploader"
accept=".jpg,.png,.jpeg"
:on-success="res => uploadSuccess(res, data.form)"
<el-upload v-if="item.type === 'upload'"
class="uploader"
accept=".jpg,.png,.jpeg,.gif"
:on-change="res => changeFile(res, data.form)"
:show-file-list="false"
:headers="headers"
:action="api.upload">
@ -315,6 +286,22 @@
:form.sync="data.form"
:visible.sync="historyVisible"
@historySubmit="historySubmit" />
<!-- 剪裁组件弹窗 -->
<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="fixed"
:fixedNumber.sync="fixedNumber"
:autoCropWidth="autoCropWidth"
:autoCropHeight="autoCropHeight"
@upload="customUpload" />
</el-dialog>
</div>
</template>
@ -326,6 +313,8 @@ import Editor from '@tinymce/tinymce-vue'
import Setting from '@/setting'
import Util from '@/libs/util'
import editorConfig from '@/components/editor'
import Cropper from '@/components/img-upload/Cropper'
import Axios from 'axios'
import { mapActions } from 'vuex'
export default {
name: 'module',
@ -334,7 +323,8 @@ export default {
Link,
Content,
Editor,
History
History,
Cropper
},
data () {
return {
@ -388,7 +378,15 @@ export default {
curData: {},
historyVisible: false,
historyData: []
historyData: [],
cropperModel: false,
isUpload: false,
file: {}, // 当前被选择的图片文件
fixed: false,
fixedNumber: [0.88, 1],
autoCropWidth: 480,
autoCropHeight: 124,
};
},
watch: {
@ -407,7 +405,7 @@ export default {
// 处理form表单参数
handleForm () {
const { type, forms, form } = this.data
if (type === 'form') {
if (type === 'form' || type === 'forms') {
forms.map(e => {
if (e.type === 'video' || e.type === 'media') {
this.fileList = [
@ -417,6 +415,12 @@ export default {
}
]
}
if (e.type === 'upload' && e.width) {
this.autoCropWidth = e.width
this.autoCropHeight = e.height
this.fixed = true
this.fixedNumber = [e.width / e.height, 1]
}
// 加必填
if (e.required) {
this.rules[e.prop] = [
@ -445,7 +449,7 @@ export default {
this.articleNums = nums
}
form && form.site && this.siteChange(form.site)
console.log(333, this.data)
console.log(333, this.fixedNumber)
},
// 站点切换回调
siteChange (siteId) {
@ -480,7 +484,7 @@ export default {
// 添加行
addRow () {
const { type } = this.data
if (type === 'label' || type === 'customList') {
if (type === 'customList') {
this.data.list.push(JSON.parse(JSON.stringify(this.data.originForm)))
} else if (type === 'history') {
this.data.list.push(JSON.parse(JSON.stringify(this.data.historyForm)))
@ -491,6 +495,52 @@ export default {
close () {
this.$emit('update:visible', false)
},
// 图片裁剪上传事件
customUpload (data) {
const formData = new FormData()
formData.append('file', data, this.file.name)
this.imgUpload(formData)
},
// 图片上传到服务器
imgUpload (formData) {
this.isUpload = true
Axios({
method: 'post',
url: this.api.upload,
data: formData,
headers: {
'Content-Type': 'multipart/form-data',
token: Util.local.get(Setting.tokenKey)
},
}).then(({ data }) => {
this.$set(this.curForm, 'pic', data.url)
}).catch(res => { })
this.$refs.cropper.isDisabled = false
this.isUpload = false
this.cropperModel = false
},
// 图片改变钩子
changeFile (file, form) {
const { size, name } = file
const ext = name.substring(name.lastIndexOf('.') + 1)
if (!Util.isImg(ext)) {
this.$message.error('请上传图片！')
return false
}
if (size / 1024 / 1024 > 5) {
this.$message.error('请上传5M以内的图片！')
return false
}
this.file = file
this.curForm = form
this.cropperModel = true
this.$nextTick(() => {
this.$refs.cropper.updateImg({
url: window.URL.createObjectURL(file.raw),
size: file.size
})
})
},
// 上传成功
uploadSuccess (res, row, item = {}) {
if (res.code === 401) {
@ -541,6 +591,7 @@ export default {
// 编辑内容
editIntro (row, i = 0) {
this.data.form = JSON.parse(JSON.stringify(row))
if (!this.data.labelWidth) this.data.labelWidth = '60px'
this.curModule = i
this.contentVisible = true
},

337
src/const/modules.js
Unescape View File

@ -1430,7 +1430,8 @@ export default {
prop: 'pic',
label: '图片',
required: true,
fixedNumber: [0.88, 1]
width: 540,
height: 506
},
{
type: 'input',
@ -4986,7 +4987,7 @@ export default {
type: 'form',
forms: [
{
type: 'input',
type: 'editor',
prop: 'title',
label: '标题',
required: true
@ -5007,7 +5008,7 @@ export default {
type: 'form',
forms: [
{
type: 'input',
type: 'editor',
prop: 'title',
label: '标题',
required: true
@ -5147,7 +5148,7 @@ export default {
type: 'form',
forms: [
{
type: 'input',
type: 'editor',
prop: 'title',
label: '标题',
required: true
@ -5156,7 +5157,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 986,
height: 293
},
],
form: {
@ -5294,7 +5297,7 @@ export default {
type: 'form',
forms: [
{
type: 'input',
type: 'editor',
prop: 'title',
label: '标题',
required: true
@ -6306,7 +6309,7 @@ export default {
}
},
{
type: 'label',
type: 'introduce',
forms: [
{
type: 'input',
@ -6317,10 +6320,12 @@ export default {
],
form: {
title: '',
isEnable: 1,
},
list: [
{
title: '实验室综合管理岗',
isEnable: 1
}
]
},
@ -6377,7 +6382,7 @@ export default {
}
},
{
type: 'label',
type: 'introduce',
forms: [
{
type: 'input',
@ -6388,10 +6393,12 @@ export default {
],
form: {
title: '',
isEnable: 1,
},
list: [
{
title: '实验室综合管理岗',
isEnable: 1
}
]
},
@ -6479,7 +6486,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -6516,7 +6525,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 562,
height: 467
},
{
type: 'editor',
@ -6728,7 +6739,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -6785,7 +6798,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: false
required: false,
width: 1242,
height: 1012
},
],
form: {
@ -6801,7 +6816,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -6896,7 +6913,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -6933,7 +6952,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 660,
height: 492
},
{
type: 'editor',
@ -6976,7 +6997,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1320,
height: 467
},
{
type: 'editor',
@ -6990,7 +7013,7 @@ export default {
label: '链接'
},
{
type: 'textarea',
type: 'editor',
prop: 'des',
label: '描述'
}
@ -7019,10 +7042,12 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1320,
height: 467
},
{
type: 'input',
type: 'editor',
prop: 'title',
label: '标题',
required: true
@ -7033,7 +7058,7 @@ export default {
label: '链接'
},
{
type: 'textarea',
type: 'editor',
prop: 'des',
label: '描述'
}
@ -7106,7 +7131,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 426,
height: 396
},
{
type: 'input',
@ -7149,7 +7176,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 426,
height: 396
},
{
type: 'input',
@ -7192,7 +7221,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 426,
height: 396
},
{
type: 'input',
@ -7249,8 +7280,15 @@ export default {
}
},
{
type: 'label',
type: 'introduce',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true,
crop: false
},
{
type: 'input',
prop: 'title',
@ -7259,29 +7297,45 @@ export default {
},
],
form: {
pic: '',
title: '',
isEnable: 1,
},
list: [
{
pic: 'http://10.10.11.7/images/overview/7.png',
title: '公益性科研事业单位、新型研发机构、重大科技基础设施法人单位。',
isEnable: 1
},
{
pic: 'http://10.10.11.7/images/overview/8.png',
title: '实行理事会领导下的院长负责制，市场化、国际化、法制化下实行企业化运营。',
isEnable: 1
},
{
pic: 'http://10.10.11.7/images/overview/9.png',
title: '承担重大科技基础设施全生命周期的规划、设计、建设、运营任务。',
isEnable: 1
},
{
pic: 'http://10.10.11.7/images/overview/10.png',
title: '聚焦服务粤港澳大湾区科学研究和高新技术产业发展需要。',
isEnable: 1
},
{
pic: 'http://10.10.11.7/images/overview/11.png',
title: ' 位置：深圳北部光明科学城的大装置集群核心区。',
isEnable: 1
},
{
pic: 'http://10.10.11.7/images/overview/12.png',
title: '距离：光明高铁站(6km), 松山湖科学城(10km) 深圳大学城(21km)，深圳机场(23km)，皇岗口岸(32km)。',
isEnable: 1
},
{
pic: 'http://10.10.11.7/images/overview/13.png',
title: '成立日期，2020年5月13日。',
isEnable: 1
},
]
},
@ -7352,7 +7406,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 933,
height: 836
},
],
form: {
@ -7368,7 +7424,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -7411,7 +7469,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1200,
height: 400
},
{
type: 'link',
@ -7459,7 +7519,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1200,
height: 400
},
{
type: 'link',
@ -7593,7 +7655,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -7636,7 +7700,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1200,
height: 559
},
{
type: 'editor',
@ -7679,7 +7745,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1200,
height: 559
},
{
type: 'editor',
@ -7798,7 +7866,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 560,
height: 500
},
{
type: 'editor',
@ -7841,7 +7911,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 600,
height: 450
},
{
type: 'editor',
@ -7891,7 +7963,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 576,
height: 423
},
{
type: 'editor',
@ -7934,7 +8008,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 576,
height: 423
},
{
type: 'editor',
@ -8287,7 +8363,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -8336,7 +8414,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -8373,7 +8453,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 474,
height: 474
},
{
type: 'editor',
@ -8426,7 +8508,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -8485,7 +8569,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 985,
height: 474
},
{
type: 'input',
@ -8528,7 +8614,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 985,
height: 474
},
{
type: 'input',
@ -8629,7 +8717,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -8669,29 +8759,17 @@ export default {
required: true
},
{
type: 'input',
prop: 'address',
label: '地址',
required: false
},
{
type: 'input',
prop: 'phone',
label: '电话',
required: false
},
{
type: 'input',
prop: 'email',
label: '邮箱',
type: 'editor',
prop: 'info',
label: '信息',
required: false
},
],
form: {
title: 'Contact us',
address: '深圳市光明区新湖街道圳园路268号3号楼3—6层',
phone: '0755-21096000',
email: 'gad@mail.iasf.ac.cn',
info: `<p class="text">地址 深圳市光明区新湖街道圳园路268号3号楼3—6层</p>
<p class="text">电话 0755-21096000</p>
<p class="text">邮箱 gad@mail.iasf.ac.cn</p>`
}
},
{
@ -8762,7 +8840,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -8810,7 +8890,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1200,
height: 536
},
],
form: {
@ -8831,8 +8913,13 @@ export default {
}
},
{
type: 'customList',
type: 'introduce',
forms: [
{
type: 'link',
prop: 'link',
label: '链接'
},
{
type: 'input',
prop: 'name',
@ -8842,13 +8929,19 @@ export default {
{
type: 'input',
prop: 'country',
label: '国家',
label: '国家和地区',
required: false
},
{
type: 'input',
prop: 'address',
label: '地点',
required: false
},
{
type: 'input',
prop: 'gev',
label: '电子束能量（GeV）',
label: '能量（GeV）',
required: false
},
{
@ -8860,7 +8953,7 @@ export default {
{
type: 'input',
prop: 'stations',
label: '实验站数量',
label: '光束线/条',
required: false
},
{
@ -8869,12 +8962,6 @@ export default {
label: '代际',
required: false
},
{
type: 'input',
prop: 'time',
label: '建成/改造时间',
required: false
},
{
type: 'input',
prop: 'emittance',
@ -8887,35 +8974,70 @@ export default {
label: '状态',
required: false
},
{
type: 'input',
prop: 'time',
label: '建成时间',
required: false
},
],
form: {
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
},
name: '',
country: '',
gev: '',
storage: '',
stations: '',
intergenerational: '',
time: '',
emittance: '',
status: '',
time: '',
},
list: [
{
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
},
name: '',
country: '',
gev: '',
storage: '',
stations: '',
intergenerational: '',
time: '',
emittance: '',
status: '',
time: '',
isEnable: 1,
}
]
],
labelWidth: '120px'
},
{
type: 'customList',
type: 'introduce',
forms: [
{
type: 'link',
prop: 'link',
label: '链接'
},
{
type: 'input',
prop: 'name',
@ -8925,7 +9047,7 @@ export default {
{
type: 'input',
prop: 'country',
label: '国家',
label: '国家和地区',
required: false
},
{
@ -8955,19 +9077,19 @@ export default {
{
type: 'input',
prop: 'repetitive',
label: '重复频率/Hz Repetition rate',
label: '重复频率/Hz',
required: false
},
{
type: 'input',
prop: 'facility',
label: '设施长度/m Overall length',
label: '设施长度/m',
required: false
},
{
type: 'input',
prop: 'stations',
label: '线站数量',
label: '实验站/个',
required: false
},
{
@ -8979,11 +9101,22 @@ export default {
{
type: 'input',
prop: 'time',
label: '出光时间',
label: '建成时间',
required: false
},
],
form: {
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
},
name: '',
country: '',
address: '',
@ -8998,6 +9131,17 @@ export default {
},
list: [
{
link: {
linkName: '无',
connectionType: 1,
columnId: [],
articleId: '',
linkAddress : '',
site: '',
otherColumnId: [],
otherArticleId: '',
isOpen: 1
},
name: '',
country: '',
address: '',
@ -9011,7 +9155,8 @@ export default {
time: '',
status: '',
}
]
],
labelWidth: '120px'
},
],
team: [
@ -9022,7 +9167,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 1912,
height: 384
},
{
type: 'input',
@ -9059,7 +9206,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 224,
height: 268
},
{
type: 'input',
@ -9301,7 +9450,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 690,
height: 488
},
{
type: 'input',
@ -9344,7 +9495,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 690,
height: 488
},
{
type: 'input',
@ -9500,7 +9653,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 722,
height: 560
},
{
type: 'input',
@ -9552,7 +9707,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图片',
required: true
required: true,
width: 744,
height: 657
},
{
type: 'input',
@ -9745,7 +9902,9 @@ export default {
type: 'upload',
prop: 'pic',
label: '图标',
required: true
required: true,
width: 98,
height: 98
},
{
type: 'input',

13
src/mixins/page/index.js
Unescape View File

@ -8,7 +8,7 @@ export default {
userId: +this.$store.state.user.userId,
site: this.$store.state.content.site,
columnId: +this.$route.query.id,
withOriginForm: ['banner', 'introduce', 'history', 'label', 'customList'], // 要添加origiinForm的模块类型
withOriginForm: ['introduce', 'history', 'label', 'customList'], // 要添加origiinForm的模块类型
id: '',
modules: [],
originModules: '[]',
@ -72,16 +72,15 @@ export default {
const str = json[json.state ? 'theEditedJson' : 'jsonBeforeEditing']
const list = JSON.parse(str)
list.map((e, i) => {
if (this.modules[i].forms) e.forms = this.modules[i].forms // forms即数据结构，直接用本地配置文件里的，方便随时更改结构
if (this.modules[i].forms && this.modules[i].forms.length !== e.forms.length) e = this.modules[i]
this.modules.map((e, i) => {
e.form = list[i].form
if (list[i].list) e.list = list[i].list
if (this.withOriginForm.includes(e.type) && !e.originForm) {
e.originForm = modules[i].originForm
}
})
this.originModules = JSON.stringify(list) // 原始json，用以页面离开的时候判断是否需要提示保存
this.modules = list
console.log("🚀 ~ file: index.js:85 ~ this.$post ~ list:", list)
this.originModules = JSON.stringify(this.modules) // 原始json，用以页面离开的时候判断是否需要提示保存
console.log("🚀 ~ file: index.js:85 ~ this.$post ~ list:", this.modules)
}
}).catch(err => {})
},

3
src/pages/article/add/index.vue
Unescape View File

@ -1501,7 +1501,8 @@ export default {
},
// 预览
preview () {
window.open((Setting.isDev ? `http://${location.hostname}:8095` : this.$store.state.content.site.domainName) + `#/article?articleId=${this.form.id}&siteId=${this.form.siteId}&id=${this.form.columnId}`)
localStorage.setItem('article', JSON.stringify(this.form))
window.open((Setting.isDev ? `http://${location.hostname}:8095` : this.$store.state.content.site.domainName) + `#/article?articleId=${this.form.id}&siteId=${this.form.siteId}&id=${this.form.columnId}&preview=1`)
},
// 返回
back () {

4
src/pages/column/page/contactUs.vue
Unescape View File

@ -32,9 +32,7 @@
<div class="contact">
<div class="fields">
<h6>{{ modules[1].form.title }}</h6>
<p class="text">{{ modules[1].form.address }}</p>
<p class="text">{{ modules[1].form.phone }}</p>
<p class="text">{{ modules[1].form.email }}</p>
<div v-html="modules[1].form.info"></div>
<div class="cover"
style="top: -20px;"
@click="toSet(1)">点击更换文本</div>

24
src/pages/column/page/lightSources.vue
Unescape View File

@ -56,16 +56,16 @@
<table class="table">
<thead>
<tr>
<th>序号</th>
<th>光源名称</th>
<th>国家</th>
<th>电子束能量（GeV）</th>
<th>国家和地区</th>
<th>地点</th>
<th>能量（GeV）</th>
<th>储存环周长(m)</th>
<th>实验站数量</th>
<th>光束线/条</th>
<th>代际</th>
<th>建成/改造时间</th>
<th>发射度(nm.rad)</th>
<th>状态</th>
<th>建成时间</th>
</tr>
</thead>
<template v-if="modules[2].list.length">
@ -73,14 +73,14 @@
:key="i">
<td>{{ item.name }}</td>
<td>{{ item.country }}</td>
<td>{{ item.address }}</td>
<td>{{ item.gev }}</td>
<td>{{ item.storage }}</td>
<td>{{ item.stations }}</td>
<td>{{ item.intergenerational }}</td>
<td>{{ item.time }}</td>
<td>{{ item.name }}</td>
<td>{{ item.emittance }}</td>
<td>{{ item.status }}</td>
<td>{{ item.time }}</td>
</tr>
</template>
<tr v-else>
@ -96,16 +96,16 @@
<thead>
<tr>
<th>光源名称</th>
<th>国家</th>
<th>国家和地区</th>
<th>地点</th>
<th>加速器技术</th>
<th>能量/GeV</th>
<th>波长范围/nm</th>
<th>重复频率/Hz Repetition rate</th>
<th>设施长度/m Overall length</th>
<th>线站数量</th>
<th>重复频率/Hz</th>
<th>设施长度/m</th>
<th>实验站/个</th>
<th>状态</th>
<th>出光时间</th>
<th>建成时间</th>
</tr>
</thead>
<template v-if="modules[3].list.length">

37
src/pages/column/page/overview.vue
Unescape View File

@ -142,9 +142,17 @@
<div class="scan-inner">
<div class="left">
<div class="c-wrap">
<div class="line"
v-for="(item, i) in modules[9].list"
:key="i">{{ item.title }}</div>
<template v-for="(item, i) in modules[9].list">
<div v-if="item.isEnable"
class="line"
:key="i">
<img v-if="item.pic"
:src="item.pic"
alt=""
class="icon">
<p class="text">{{ item.title }}</p>
</div>
</template>
<div class="cover"
@click="toSet(9)">点击更换标题</div>
</div>
@ -375,31 +383,10 @@ export default {
display: flex;
align-items: center;
margin-bottom: 30px;
&:before {
content: '';
min-width: 50px;
.icon {
width: 50px;
height: 50px;
margin-right: 20px;
background: url(http://10.10.11.7/images/overview/7.png) 0 0/100% 100% no-repeat;
}
&:nth-child(2):before {
background-image: url(http://10.10.11.7/images/overview/8.png);
}
&:nth-child(3):before {
background-image: url(http://10.10.11.7/images/overview/9.png);
}
&:nth-child(4):before {
background-image: url(http://10.10.11.7/images/overview/10.png);
}
&:nth-child(5):before {
background-image: url(http://10.10.11.7/images/overview/11.png);
}
&:nth-child(6):before {
background-image: url(http://10.10.11.7/images/overview/12.png);
}
&:nth-child(7):before {
background-image: url(http://10.10.11.7/images/overview/13.png);
}
.text {
font-size: 1rem;

8
src/pages/column/page/talentCenter.vue
Unescape View File

@ -58,9 +58,11 @@
</div>
<p class="hot">热门岗位</p>
<div class="labels">
<p v-for="(item, i) in modules[4].list"
<template v-for="(item, i) in modules[4].list">
<p v-if="item.isEnable"
:key="i"
class="label">{{ item.title }}</p>
</template>
<div class="cover"
@click="toSet(4)">点击更换标签</div>
</div>
@ -87,9 +89,11 @@
</div>
<p class="hot">热门岗位</p>
<div class="labels">
<p v-for="(item, i) in modules[7].list"
<template v-for="(item, i) in modules[7].list">
<p v-if="item.isEnable"
:key="i"
class="label">{{ item.title }}</p>
</template>
<div class="cover"
@click="toSet(7)">点击更换标签</div>
</div>

21
src/styles/page/page.scss
Unescape View File

@ -9,7 +9,7 @@
color: #333333;
line-height: 60px;
text-align: center;
color: #1F1F1F;
color: #1f1f1f;
&:after {
content: '';
position: absolute;
@ -18,14 +18,14 @@
width: 136px;
height: 4px;
transform: translateX(-50%);
background: #1583FF;
background: #1583ff;
}
}
.intro {
margin-bottom: 80px;
font-size: 30px;
text-align: center;
color: #5B5B5E;
color: #5b5b5e;
line-height: 40px;
}
}
@ -69,7 +69,7 @@
}
}
.gray {
background-color: #F2F6F8;
background-color: #f2f6f8;
}
.modules {
@ -98,10 +98,10 @@
font-size: 22px;
white-space: nowrap;
color: #fff;
background-color: rgba(0, 0, 0, .5);
background-color: rgba(0, 0, 0, 0.5);
cursor: pointer;
&:hover {
background-color: rgba(0, 0, 0, .7);
background-color: rgba(0, 0, 0, 0.7);
}
}
/deep/.module {
@ -135,9 +135,10 @@
}
$avatar-width: 140px;
$avatar-height: 80px;
/deep/.upload-pic, /deep/.upload-none {
width: $avatar-width;
height: $avatar-height;
/deep/.upload-pic,
/deep/.upload-none {
max-width: $avatar-width;
max-height: $avatar-height;
}
/deep/.upload-none {
display: flex;
@ -166,7 +167,7 @@ $avatar-height: 80px;
cursor: pointer;
overflow: hidden;
&:hover {
border-color: #409EFF;
border-color: #409eff;
}
.uploader-default {
display: flex;

Write Preview
Loading…
Cancel
Save