huoran
/
FE_huoran_server
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix

Browse Source
master
yujialong 6 months ago
parent 0174ea45c0
commit 0a7e561fea
11 changed files with 2412 additions and 2965 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. 16
      src/components/editor.js
  2. 47
      src/components/img-upload/Cropper.vue
  3. 108
      src/components/modules/content.vue
  4. 259
      src/components/modules/module.vue
  5. 7
      src/const/modules.js
  6. 19
      src/pages/article/add/editor.js
  7. 677
      src/pages/article/add/index.vue
  8. 178
      src/pages/column/list/index.vue
  9. 176
      src/pages/column/page/home.vue
  10. 34
      src/pages/seo/index.vue

16
src/components/editor.js
Unescape View File

@ -6,8 +6,8 @@ export default {
//skin:'oxide-dark',
language: 'zh_CN',
language_url: './styles/tinymce/langs/zh_CN.js',
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 paragraphspacing',
toolbar: 'code undo redo restoredraft | cut copy powerpaste pastetext | forecolor backcolor headings fontsize lineHeight bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify | \
plugins: 'print preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template codesample table charmap hr pagebreak nonbreaking anchor insertdatetime advlist lists wordcount imagetools textpattern help emoticons autosave autoresize formatpainter paragraphspacing',
toolbar: 'code undo redo restoredraft | cut copy pastetext | forecolor backcolor headings fontsize lineHeight bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify | \
styleselect fontselect fontsizeselect | bullist numlist | blockquote subscript superscript removeformat | \
table image media charmap emoticons hr pagebreak insertdatetime print preview | fullscreen | indent2em formatpainter | paragraphspacing',
style_formats: [
@ -212,7 +212,8 @@ export default {
},
//为内容模板插件提供预置模板
templates: [
{ title: '中文文章模板1', description: '图片文字流', content: `
{
title: '中文文章模板1', description: '图片文字流', content: `
<div class="tiny-wrap">
<div class="block">
<div class="fl">
@ -237,7 +238,8 @@ export default {
</div>
`
},
{ title: '英文文章模板1', description: '图片文字流', content: `
{
title: '英文文章模板1', description: '图片文字流', content: `
<div class="tiny-wrap">
<div class="block en-block">
<div class="fr">
@ -256,7 +258,8 @@ export default {
</div>
`
},
{ title: '新闻模板', description: '', content: `
{
title: '新闻模板', description: '', content: `
<div class="tiny-wrap">
<div class="block" style="margin-bottom: 70px;">
<div class="fr">
@ -286,7 +289,8 @@ export default {
</div>
`
},
{ title: '图片描述', description: '', content: `
{
title: '图片描述', description: '', content: `
<div class="tiny-wrap">
<div class="block">
<div class="img-wrap">

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

@ -3,31 +3,18 @@
<div class="cropper-content">
<!-- 剪裁框 -->
<div class="cropper">
<vueCropper ref="cropper"
:img="option.img"
:output-size="option.size"
:output-type="option.outputType"
:info="true"
:full="option.full"
:can-move="option.canMove"
:can-move-box="option.canMoveBox"
:original="option.original"
:auto-crop="option.autoCrop"
:auto-crop-width="autoCropWidth"
:auto-crop-height="autoCropHeight"
:fixed-box="option.fixedBox"
:fixed="fixed"
:fixed-number="fixedNumber"
<vueCropper ref="cropper" :img="option.img" :output-size="option.size" :output-type="option.outputType"
:info="true" :full="option.full" :can-move="option.canMove" :can-move-box="option.canMoveBox"
:original="option.original" :auto-crop="option.autoCrop" :auto-crop-width="autoCropWidth"
:auto-crop-height="autoCropHeight" :fixed-box="option.fixedBox" :fixed="fixed" :fixed-number="fixedNumber"
@realTime="realTime" />
<!-- <vueCropper ref="cropper" :img="option.img" :outputSize="option.size" :outputType="option.outputType"></vueCropper> -->
</div>
<!-- 预览框 -->
<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,10 +28,7 @@
</div>-->
<!-- 确认上传按钮 -->
<div class="upload-btn">
<el-button type="primary"
:loading="isUpload"
:disabled="isDisabled"
@click.prevent="uploadImg('blob')">
<el-button type="primary" :loading="isUpload" :disabled="isDisabled" @click.prevent="uploadImg('blob')">
上传
</el-button>
</div>
@ -95,7 +79,11 @@ export default {
autoCropHeight: {
type: Number,
default: 124
}
},
dataType: {
type: String,
default: 'form'
},
},
data () {
return {
@ -114,6 +102,7 @@ export default {
fixedNumber: [1, 0.26], // 截图框比例 (默认:[1:1])
enlarge: 1
},
imgType: this.dataType === 'form' ? 'image/png' : 'image/jpeg',
isDisabled: false
}
},
@ -147,9 +136,13 @@ export default {
const that = this
if (type === 'blob') {
this.$refs.cropper.getCropBlob(data => {
// compress(data, 1).then(res => {
that.$emit('upload', data)
// })
compress(data, {
size: 100,
quality: 0.9,
type: this.imgType
}).then(res => {
that.$emit('upload', res)
})
})
} else {
this.$refs.cropper.getCropData(data => {

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

@ -1,117 +1,64 @@
<template>
<!-- 内容 -->
<div>
<el-dialog title="编辑内容"
:visible.sync="visible"
width="700px"
custom-class="module"
:close-on-click-modal="false"
<el-dialog title="编辑内容" :visible.sync="visible" width="700px" custom-class="module" :close-on-click-modal="false"
:before-close="close">
<el-form ref="form"
:model="data.form"
:rules="rules"
:label-width="data.labelWidth">
<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="请输入"
<el-form ref="form" :model="data.form" :rules="rules" :label-width="data.labelWidth">
<el-form-item v-for="(item, i) in data.forms" :key="i" :prop="item.prop" :label="item.label">
<el-input v-if="item.type === 'input'" v-model="data.form[item.prop]" placeholder="请输入"
maxlength="100"></el-input>
<el-input v-if="item.type === 'textarea'"
v-model="data.form[item.prop]"
type="textarea"
placeholder="请输入"
<el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入"
maxlength="300"></el-input>
<Editor v-if="item.type === 'editor'"
api-key='rnk6zw9v267xqz7pf98twt1vmrvltmd436je7a642pckltda'
v-model="data.form[item.prop]"
:init="editorConfig" />
<el-upload v-if="item.type === 'upload' && item.width"
class="uploader"
accept=".jpg,.png,.jpeg,.gif"
:on-change="res => changeFile(res, data.form)"
:show-file-list="false"
:action="api.upload"
<Editor v-if="item.type === 'editor'" api-key='rnk6zw9v267xqz7pf98twt1vmrvltmd436je7a642pckltda'
v-model="data.form[item.prop]" :init="editorConfig" />
<el-upload v-if="item.type === 'upload' && item.width" class="uploader" accept=".jpg,.png,.jpeg,.gif"
:on-change="res => changeFile(res, data.form)" :show-file-list="false" :action="api.upload"
:auto-upload="false">
<img v-if="data.form[item.prop]"
:src="data.form[item.prop]"
class="avatar">
<div class="uploader-default"
v-else>
<img v-if="data.form[item.prop]" :src="data.form[item.prop]" class="avatar">
<div class="uploader-default" v-else>
<i class="el-icon-plus"></i>
<p>上传图片</p>
</div>
<div slot="tip"
class="el-upload__tip">
<div slot="tip" class="el-upload__tip">
<p>只支持.jpg,.png格式</p>
</div>
</el-upload>
<el-upload v-if="item.type === 'upload' && !item.width"
class="uploader"
accept=".jpg,.png,.jpeg"
:on-success="res => uploadSuccess(res, data.form)"
:show-file-list="false"
:headers="headers"
<el-upload v-if="item.type === 'upload' && !item.width" class="uploader" accept=".jpg,.png,.jpeg"
:on-success="res => uploadSuccess(res, data.form)" :show-file-list="false" :headers="headers"
:action="api.upload">
<img v-if="data.form[item.prop]"
:src="data.form[item.prop]"
class="avatar">
<div class="uploader-default"
v-else>
<img v-if="data.form[item.prop]" :src="data.form[item.prop]" class="avatar">
<div class="uploader-default" v-else>
<i class="el-icon-plus"></i>
<p>上传图片</p>
</div>
<div slot="tip"
class="el-upload__tip">
<div slot="tip" class="el-upload__tip">
<p>只支持.jpg,.png格式</p>
</div>
</el-upload>
<template v-if="item.type === 'pic'">
<img v-if="data.form[item.prop]"
:src="data.form[item.prop]"
class="avatar">
<div class="uploader-default"
v-else>
<img v-if="data.form[item.prop]" :src="data.form[item.prop]" class="avatar">
<div class="uploader-default" v-else>
<i class="el-icon-picture-outline"></i>
</div>
</template>
<div v-if="item.type === 'link'"
class="flex">
<el-input class="m-r-10"
v-model="data.form.link.linkName"></el-input>
<div v-if="item.type === 'link'" class="flex">
<el-input class="m-r-10" v-model="data.form.link.linkName"></el-input>
<el-button @click="toLink(data.form)">设置链接</el-button>
</div>
</el-form-item>
</el-form>
<span slot="footer"
class="dialog-footer">
<span slot="footer" class="dialog-footer">
<el-button @click="$emit('update:visible', false)">取消</el-button>
<el-button type="primary"
@click="contentSubmit">确定</el-button>
<el-button type="primary" @click="contentSubmit">确定</el-button>
</span>
</el-dialog>
<Link ref="link"
:visible.sync="linkVisible"
:data.sync="linkForm"
@linkSubmit="linkSubmit" />
<Link ref="link" :visible.sync="linkVisible" :data.sync="linkForm" @linkSubmit="linkSubmit" />
<!-- 剪裁组件弹窗 -->
<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 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" :dataType="data.type" @upload="customUpload" />
</el-dialog>
</div>
</template>
@ -294,6 +241,7 @@ export default {
.radio-wrap {
display: flex;
align-items: center;
.el-input {
width: 200px;
margin-left: -40px;

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

@ -3,40 +3,22 @@
<!--
模块type: introduce | form | forms | column | columns | history
-->
<el-dialog title="模块管理"
:visible.sync="visible"
:width="dialogWidth"
custom-class="module"
:close-on-click-modal="false"
:before-close="close">
<el-dialog title="模块管理" :visible.sync="visible" :width="dialogWidth" custom-class="module"
:close-on-click-modal="false" :before-close="close">
<template v-if="data.type === 'introduce'">
<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 class="module-table" :data="data.list" header-align="center" row-key="id">
<el-table-column type="index" width="60" label="序号" align="center"></el-table-column>
<el-table-column v-for="(item, i) in data.forms"
:key="i"
:prop="item.prop"
:label="item.label"
min-width="130"
align="center">
<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' && scope.row.link"
class="link-wrap">
<div v-if="item.type === 'link' && scope.row.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">
<div class="upload-none"
v-else>
<img v-if="scope.row.pic" :src="scope.row.pic" class="upload-pic">
<div class="upload-none" v-else>
<i class="el-icon-picture-outline"></i>
</div>
</template>
@ -45,241 +27,137 @@
</template>
</el-table-column>
<el-table-column label="操作"
:width="data.sort ? 150 : 100"
align="center">
<el-table-column label="操作" :width="data.sort ? 150 : 100" align="center">
<template slot-scope="scope">
<div class="flex a-center">
<el-switch v-model="scope.row.isEnable"
:active-value="1"
:inactive-value="0">
<el-switch v-model="scope.row.isEnable" :active-value="1" :inactive-value="0">
</el-switch>
<i class="el-icon-edit-outline del"
@click="editIntro(scope.row, scope.$index)"></i>
<i class="el-icon-edit-outline del" @click="editIntro(scope.row, scope.$index)"></i>
<template v-if="data.sort">
<i v-if="scope.$index != data.list.length - 1"
class="el-icon-bottom del"
<i v-if="scope.$index != data.list.length - 1" class="el-icon-bottom del"
@click="sort(1, scope.$index)"></i>
<i v-if="scope.$index"
class="el-icon-top del"
@click="sort(0, scope.$index)"></i>
<i v-if="scope.$index" class="el-icon-top del" @click="sort(0, scope.$index)"></i>
</template>
<i class="el-icon-delete del"
@click="delRow(data.list, scope.$index)"></i>
<i class="el-icon-delete del" @click="delRow(data.list, scope.$index)"></i>
</div>
</template>
</el-table-column>
</el-table>
<div class="plus">
<i class="el-icon-circle-plus-outline"
@click="addRow"></i>
<i class="el-icon-circle-plus-outline" @click="addRow"></i>
</div>
</template>
<el-form v-else-if="data.type === 'form' || data.type === 'forms'"
ref="form"
:model="data.form"
:rules="rules"
<el-form v-else-if="data.type === 'form' || data.type === 'forms'" ref="form" :model="data.form" :rules="rules"
:label-width="data.labelWidth">
<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="请输入"
<el-form-item v-for="(item, i) in data.forms" :key="i" :prop="item.prop" :label="item.label">
<el-input v-if="item.type === 'input'" v-model="data.form[item.prop]" placeholder="请输入"
maxlength="100"></el-input>
<el-input v-if="item.type === 'textarea'"
v-model="data.form[item.prop]"
type="textarea"
placeholder="请输入"
<el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入"
maxlength="300"></el-input>
<div v-if="item.type === 'upload' || item.type === 'video' || item.type === 'media'"
class="uploader-wrap">
<el-upload 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"
<div v-if="item.type === 'upload' || item.type === 'video' || item.type === 'media'" class="uploader-wrap">
<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">
<img v-if="data.form.pic && !isVideo(data.form.mediaType)"
:src="data.form.pic"
class="avatar">
<div class="uploader-default"
v-else>
<img v-if="data.form.pic && !isVideo(data.form.mediaType)" :src="data.form.pic" class="avatar">
<div class="uploader-default" v-else>
<i class="el-icon-plus"></i>
<p>上传图片</p>
</div>
<div slot="tip"
class="el-upload__tip">
<div slot="tip" class="el-upload__tip">
<p>只支持.jpg,.png格式</p>
</div>
</el-upload>
<el-upload v-if="item.type === 'video'"
accept=".mp4,.mov,.avi"
:on-success="res => uploadSuccess(res, data.form, item)"
:before-remove="beforeRemove"
:on-remove="(file, fileList) => handleRemove(file, fileList, data.form, item.prop)"
:file-list="fileList"
:headers="headers"
:action="api.upload">
<el-upload v-if="item.type === 'video'" accept=".mp4,.mov,.avi"
:on-success="res => uploadSuccess(res, data.form, item)" :before-remove="beforeRemove"
:on-remove="(file, fileList) => handleRemove(file, fileList, data.form, item.prop)" :file-list="fileList"
:headers="headers" :action="api.upload">
<el-button>上传视频</el-button>
<div slot="tip"
class="el-upload__tip">
<div slot="tip" class="el-upload__tip">
<p>请上传大小1G以内的视频</p>
</div>
</el-upload>
<!-- 图片视频都可上传 -->
<el-upload v-if="item.type === 'media'"
:on-success="res => uploadSuccess(res, data.form, item)"
<el-upload v-if="item.type === 'media'" :on-success="res => uploadSuccess(res, data.form, item)"
:before-remove="beforeRemove"
:on-remove="(file, fileList) => handleRemove(file, fileList, data.form, item.prop)"
:file-list="fileList"
:headers="headers"
:action="api.upload">
:on-remove="(file, fileList) => handleRemove(file, fileList, data.form, item.prop)" :file-list="fileList"
:headers="headers" :action="api.upload">
<el-button>上传资源</el-button>
</el-upload>
<i v-if="!item.required"
class="el-icon-delete del"
@click="data.form[item.prop] = ''"></i>
<i v-if="!item.required" class="el-icon-delete del" @click="data.form[item.prop] = ''"></i>
</div>
<div v-if="item.type === 'link'"
class="flex">
<el-input class="m-r-10"
v-model="data.form.link.linkName"></el-input>
<div v-if="item.type === 'link'" class="flex">
<el-input class="m-r-10" v-model="data.form.link.linkName"></el-input>
<el-button @click="toLink(data.form)">设置链接</el-button>
</div>
<Editor v-if="item.type === 'editor'"
api-key='rnk6zw9v267xqz7pf98twt1vmrvltmd436je7a642pckltda'
v-model="data.form[item.prop]"
:init="editorConfig" />
<Editor v-if="item.type === 'editor'" api-key='rnk6zw9v267xqz7pf98twt1vmrvltmd436je7a642pckltda'
v-model="data.form[item.prop]" :init="editorConfig" />
</el-form-item>
</el-form>
<el-form v-else-if="data.type === 'column' || data.type === 'columns'"
ref="form"
:model="data.form"
:rules="columnRules"
label-width="100px">
<el-form-item prop="site"
label="站点选择">
<el-select v-model="data.form.site"
@change="siteChange">
<el-option v-for="item in $refs.link.sites"
:key="item.id"
:label="item.siteName"
:value="item.id">
<el-form v-else-if="data.type === 'column' || data.type === 'columns'" ref="form" :model="data.form"
:rules="columnRules" label-width="100px">
<el-form-item prop="site" label="站点选择">
<el-select v-model="data.form.site" @change="siteChange">
<el-option v-for="item in $refs.link.sites" :key="item.id" :label="item.siteName" :value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="column"
label="关联栏目">
<el-cascader ref="links"
v-model="data.form.column"
:options="columns"
:props="columnProps"
clearable
<el-form-item prop="column" label="关联栏目">
<el-cascader ref="links" v-model="data.form.column" :options="columns" :props="columnProps" clearable
@change="columnChange"></el-cascader>
</el-form-item>
<el-form-item label="文章展示数量">
<el-select v-model="data.form.articleNum">
<el-option v-for="item in articleNums"
:key="item.id"
:label="item.name"
:value="item.id">
<el-option v-for="item in articleNums" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="栏目标题">
<el-radio v-model="data.form.columnTitle"
:label="1"
@change="columnTitleChange">默认读取关联栏目</el-radio>
<el-radio v-model="data.form.columnTitle" :label="1" @change="columnTitleChange">默认读取关联栏目</el-radio>
<div class="radio-wrap">
<el-radio v-model="data.form.columnTitle"
:label="2"
@change="columnTitleChange"></el-radio>
<el-input v-model="data.form.columnTitleCustom"
:disabled="data.form.columnTitle == 1"
size="small"
<el-radio v-model="data.form.columnTitle" :label="2" @change="columnTitleChange"></el-radio>
<el-input v-model="data.form.columnTitleCustom" :disabled="data.form.columnTitle == 1" size="small"
maxlength="100"></el-input>
</div>
</el-form-item>
</el-form>
<template v-else-if="data.type === 'history'">
<el-table class="module-table"
:data="data.list"
header-align="center"
row-key="id">
<el-table-column type="index"
width="60"
label="序号"
align="center"></el-table-column>
<el-table-column prop="title"
label="标题"
min-width="140"
align="center">
<el-table class="module-table" :data="data.list" header-align="center" row-key="id">
<el-table-column type="index" width="60" label="序号" align="center"></el-table-column>
<el-table-column prop="title" label="标题" min-width="140" align="center">
<template slot-scope="scope">
<el-input v-model="scope.row.title"
placeholder="请输入"
maxlength="100"></el-input>
<el-input v-model="scope.row.title" placeholder="请输入" maxlength="100"></el-input>
</template>
</el-table-column>
<el-table-column label="操作"
width="100"
align="center">
<el-table-column label="操作" width="100" align="center">
<template slot-scope="scope">
<div class="flex a-center">
<el-switch v-model="scope.row.isEnable"
:active-value="1"
:inactive-value="0">
<el-switch v-model="scope.row.isEnable" :active-value="1" :inactive-value="0">
</el-switch>
<i class="el-icon-edit-outline del"
@click="editHistory(scope.row, scope.$index)"></i>
<i class="el-icon-delete del"
@click="delRow(data.list, scope.$index)"></i>
<i class="el-icon-edit-outline del" @click="editHistory(scope.row, scope.$index)"></i>
<i class="el-icon-delete del" @click="delRow(data.list, scope.$index)"></i>
</div>
</template>
</el-table-column>
</el-table>
<div class="plus">
<i class="el-icon-circle-plus-outline"
@click="addRow"></i>
<i class="el-icon-circle-plus-outline" @click="addRow"></i>
</div>
</template>
<span slot="footer"
class="dialog-footer">
<span slot="footer" class="dialog-footer">
<el-button @click="$emit('update:visible', false)">取消</el-button>
<el-button type="primary"
@click="moduleSubmit">确定</el-button>
<el-button type="primary" @click="moduleSubmit">确定</el-button>
</span>
</el-dialog>
<Link ref="link"
:data.sync="linkForm"
:visible.sync="linkVisible"
@linkSubmit="linkSubmit" />
<Content :data.sync="data"
:visible.sync="contentVisible"
@contentSubmit="contentSubmit" />
<History :data.sync="data"
:list.sync="historyData"
:form.sync="data.form"
:visible.sync="historyVisible"
<Link ref="link" :data.sync="linkForm" :visible.sync="linkVisible" @linkSubmit="linkSubmit" />
<Content :data.sync="data" :visible.sync="contentVisible" @contentSubmit="contentSubmit" />
<History :data.sync="data" :list.sync="historyData" :form.sync="data.form" :visible.sync="historyVisible"
@historySubmit="historySubmit" />
<!-- 剪裁组件弹窗 -->
<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 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" :dataType="data.type" @upload="customUpload" />
</el-dialog>
</div>
</template>
@ -432,7 +310,7 @@ export default {
this.articleNums = nums
}
form && form.site && this.siteChange(form.site)
this.dialogWidth = dialogWidth || '800px'
this.dialogWidth = dialogWidth || '1000px'
},
// 站点切换回调
siteChange (siteId) {
@ -653,6 +531,7 @@ export default {
.radio-wrap {
display: flex;
align-items: center;
.el-input {
width: 200px;
margin-left: -40px;

7
src/const/modules.js
Unescape View File

@ -3565,6 +3565,12 @@ export default {
{
type: 'form',
forms: [
{
type: 'upload',
prop: 'pic',
label: '图片',
required: true
},
{
type: 'input',
prop: 'title',
@ -3584,6 +3590,7 @@ export default {
}
],
form: {
pic: 'https://huorantech.com/images/home/4.png',
title: 'ABOUT',
link: {
linkName: '无',

19
src/pages/article/add/editor.js
Unescape View File

@ -6,8 +6,8 @@ export default {
//skin:'oxide-dark',
language: 'zh_CN',
language_url: './styles/tinymce/langs/zh_CN.js',
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 headings fontsize lineHeight bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify | \
plugins: 'print preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template 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 pastetext | forecolor backcolor headings fontsize lineHeight bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify | \
styleselect fontselect fontsizeselect | bullist numlist | blockquote subscript superscript removeformat | \
table image media charmap emoticons hr pagebreak insertdatetime print preview | fullscreen | indent2em formatpainter',
style_formats: [
@ -214,7 +214,8 @@ export default {
},
//为内容模板插件提供预置模板
templates: [
{ title: '中文文章模板1', description: '图片文字流', content: `
{
title: '中文文章模板1', description: '图片文字流', content: `
<div class="tiny-wrap">
<div class="block">
<div class="fl">
@ -239,7 +240,8 @@ export default {
</div>
`
},
{ title: '英文文章模板1', description: '图片文字流', content: `
{
title: '英文文章模板1', description: '图片文字流', content: `
<div class="tiny-wrap">
<div class="block en-block">
<div class="fr">
@ -258,7 +260,8 @@ export default {
</div>
`
},
{ title: '新闻模板', description: '', content: `
{
title: '新闻模板', description: '', content: `
<div class="tiny-wrap">
<div class="block" style="margin-bottom: 70px;">
<div class="fr">
@ -288,7 +291,8 @@ export default {
</div>
`
},
{ title: '图片描述', description: '', content: `
{
title: '图片描述', description: '', content: `
<div class="tiny-wrap">
<div class="block">
<div class="img-wrap">
@ -299,7 +303,8 @@ export default {
</div>
`
},
{ title: '人物详情', description: '', content: `
{
title: '人物详情', description: '', content: `
<div class="tiny-wrap">
<div class="people">
<img class="pic" src="http://139.159.254.212/images/team/5.png"/>

677
src/pages/article/add/index.vue
View File

File diff suppressed because it is too large Load Diff

178
src/pages/column/list/index.vue
Unescape View File

@ -2,185 +2,107 @@
<div class="page">
<div class="tool">
<div class="search-wrap">
<el-input placeholder="请输入栏目名称"
v-model.trim="keyword"
clearable></el-input>
<el-input placeholder="请输入栏目名称" v-model.trim="keyword" clearable></el-input>
</div>
<div class="actions">
<el-dropdown class="setting"
trigger="click"
:hide-on-click="false">
<img class="icon"
src="@/assets/images/setting.png"
alt="">
<el-dropdown class="setting" trigger="click" :hide-on-click="false">
<img class="icon" src="@/assets/images/setting.png" alt="">
<el-dropdown-menu>
<el-dropdown-item>
<el-button @click="resetColumns"
type="text">列重置</el-button>
<el-button @click="resetColumns" type="text">列重置</el-button>
</el-dropdown-item>
<el-dropdown-item v-for="(column, i) in settings"
:key="i"
:divided="i === 0">
<el-dropdown-item v-for="(column, i) in settings" :key="i" :divided="i === 0">
<el-checkbox v-model="column.show">{{ column.name }}</el-checkbox>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<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 + ':内容管理:栏目管理:更改排序'"
class="lg"
@click="sort">更改排序</el-button>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:导航样式设置'"
class="lg"
<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 + ':内容管理:栏目管理:更改排序'" class="lg" @click="sort">更改排序</el-button>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:导航样式设置'" class="lg"
@click="styleSet">导航样式设置</el-button>
</div>
</div>
<el-table v-loading="listLoading"
ref="table"
:data="list"
default-expand-all
class="table"
header-align="center"
@selection-change="handleSelectionChange"
@select-all="selectAll"
row-key="id">
<el-table-column v-if="settings[0].show"
type="selection"
width="50"
align="center"
<el-table v-loading="listLoading" ref="table" :data="list" default-expand-all class="table" header-align="center"
@selection-change="handleSelectionChange" @select-all="selectAll" row-key="id">
<el-table-column v-if="settings[0].show" type="selection" width="50" align="center"
:reserve-selection="true"></el-table-column>
<el-table-column prop="columnName"
show-overflow-tooltip
label="名称"
min-width="140"></el-table-column>
<el-table-column v-if="settings[1].show"
prop="typeId"
label="栏目类型"
min-width="100">
<el-table-column prop="columnName" show-overflow-tooltip label="名称" min-width="140"></el-table-column>
<el-table-column v-if="settings[1].show" prop="typeId" label="栏目类型" min-width="100">
<template slot-scope="scope">
{{ types.find(e => e.id == scope.row.typeId) && types.find(e => e.id == scope.row.typeId).name }}
</template>
</el-table-column>
<el-table-column v-if="settings[2].show"
prop="templateName"
label="栏目模板"
min-width="100">
<el-table-column v-if="settings[2].show" prop="templateName" label="栏目模板" min-width="100">
<template slot-scope="scope">
{{ scope.row.typeId === 2 ? '--' : scope.row.templateName }}
</template>
</el-table-column>
<el-table-column v-if="settings[3].show"
prop="listStyle"
label="列表/长页样式"
min-width="100">
<el-table-column v-if="settings[3].show" prop="listStyle" label="列表/长页样式" min-width="100">
<template slot-scope="scope">
{{ scope.row.typeId === 2 ? '--' : scope.row.listStyle }}
</template>
</el-table-column>
<el-table-column v-if="settings[4].show"
prop="detailStyle"
label="详情样式"
min-width="100">
<el-table-column v-if="settings[4].show" prop="detailStyle" label="详情样式" min-width="100">
<template slot-scope="scope">
{{ (scope.row.typeId === 1 || scope.row.typeId === 4) ? scope.row.detailStyle : '--' }}
</template>
</el-table-column>
<el-table-column v-if="settings[5].show"
prop="menuVisible"
label="导航菜单"
min-width="100">
<el-table-column v-if="settings[5].show" prop="menuVisible" label="导航菜单" min-width="100">
<template slot-scope="scope">
<el-switch v-model="scope.row.menuVisible"
:active-value="0"
:inactive-value="1"
<el-switch v-model="scope.row.menuVisible" :active-value="0" :inactive-value="1"
@change="switchOff($event, scope.row, scope.$index)">
</el-switch>
</template>
</el-table-column>
<el-table-column v-if="settings[6].show"
prop="id"
label="ID"
min-width="80"></el-table-column>
<el-table-column v-if="settings[7].show"
label="操作"
width="270">
<el-table-column v-if="settings[6].show" prop="id" label="ID" min-width="80"></el-table-column>
<el-table-column v-if="settings[7].show" label="操作" width="270">
<template slot-scope="scope">
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:新增下级'"
type="text"
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:新增下级'" type="text"
@click="edit(scope.row, 'add')">新增下级</el-button>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:编辑'"
type="text"
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:编辑'" type="text"
@click="edit(scope.row, 'edit')">编辑</el-button>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:删除'"
type="text"
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:删除'" type="text"
@click="del(scope.row)">删除</el-button>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:预览'"
v-if="scope.row.typeId != 2"
type="text"
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:预览'" v-if="scope.row.typeId != 2" type="text"
@click="preview(scope.row)">预览</el-button>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:页面管理'"
v-if="scope.row.typeId == 3"
class="page-set"
type="primary"
size="mini"
@click="page(scope.row)">页面设置</el-button>
<el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:页面管理'" v-if="scope.row.typeId == 3" class="page-set"
type="primary" size="mini" @click="page(scope.row)">页面设置</el-button>
</template>
</el-table-column>
</el-table>
<el-dialog title="编辑栏目排序"
:visible.sync="sortVisible"
width="750px"
:close-on-click-modal="false">
<el-dialog title="编辑栏目排序" :visible.sync="sortVisible" width="750px" :close-on-click-modal="false">
<div class="sort-wrap">
<ul class="thead">
<li style="width: 395px;padding-left: 30px">栏目</li>
<li style="width: 205px">栏目类型</li>
<li>前台可见</li>
</ul>
<el-tree class="sort"
:data="sortColumns"
node-key="id"
default-expand-all
draggable>
<ul class="sort-line"
slot-scope="{ node, data }">
<el-tree class="sort" :data="sortColumns" node-key="id" default-expand-all draggable>
<ul class="sort-line" slot-scope="{ node, data }">
<li>{{ data.columnName }}</li>
<li>{{ types.find(e => e.id == data.typeId) && types.find(e => e.id == data.typeId).name }}</li>
<li>
<el-switch v-model="data.menuVisible"
:active-value="0"
:inactive-value="1"
<el-switch v-model="data.menuVisible" :active-value="0" :inactive-value="1"
@change="switchOff($event, data)">
</el-switch>
</li>
</ul>
</el-tree>
</div>
<span slot="footer"
class="dialog-footer">
<span slot="footer" class="dialog-footer">
<el-button @click="sortVisible = false">取 消</el-button>
<el-button type="primary"
@click="sortSubmit">确 定</el-button>
<el-button type="primary" @click="sortSubmit">确 定</el-button>
</span>
</el-dialog>
<el-dialog title="导航样式设置"
:visible.sync="styleVisible"
width="850px"
:close-on-click-modal="false">
<el-form class="input-form"
label-width="100px">
<el-dialog title="导航样式设置" :visible.sync="styleVisible" width="850px" :close-on-click-modal="false">
<el-form class="input-form" label-width="100px">
<el-form-item label="导航样式">
<el-select v-model="form.navigationStyle">
<el-option v-for="item in styleTypes"
:key="item.id"
:label="item.name"
:value="item.id">
<el-option v-for="item in styleTypes" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item>
@ -188,11 +110,9 @@
<ul class="styles">
<li>
<div class="review">
<img src="@/assets/images/style1.png"
alt="">
<img src="@/assets/images/style1.png" alt="">
</div>
<el-radio v-model="form.styleTemplate"
:label="1">竖行导航</el-radio>
<el-radio v-model="form.styleTemplate" :label="1">竖行导航</el-radio>
</li>
<!-- <li>
<div class="review">
@ -203,11 +123,9 @@
</ul>
</el-form-item>
</el-form>
<span slot="footer"
class="dialog-footer">
<span slot="footer" class="dialog-footer">
<el-button @click="styleVisible = false">取 消</el-button>
<el-button type="primary"
@click="styleSubmit">确 定</el-button>
<el-button type="primary" @click="styleSubmit">确 定</el-button>
</span>
</el-dialog>
</div>
@ -364,7 +282,7 @@ export default {
// 预览
preview (row) {
// 常规/子级优先栏目，则跳转到column；长页则跳转到对应的长页模板
window.open((Setting.isDev ? `http://${location.hostname}:8097` : this.$store.state.content.site.domainName) + `#/${row.typeId === 3 ? row.path : 'column'}?id=${row.id}&siteId=${row.siteId}`)
window.open((Setting.isDev ? `http://${location.hostname}:8097` : this.$store.state.content.site.domainName) + `#/${row.typeId === 3 ? row.path : 'column'}?id=${row.id}&siteId=${row.siteId}&listPreview=1`)
},
// 页面管理
page (row) {
@ -483,10 +401,12 @@ export default {
max-height: 400px;
overflow: auto;
}
.thead {
display: flex;
line-height: 44px;
background-color: #f7f7f7;
li {
padding: 0 10px;
font-size: 12px;
@ -495,42 +415,53 @@ export default {
color: #323232;
}
}
/deep/.sort {
.el-tree-node__content {
height: auto;
border-bottom: 1px solid #ebedf0;
}
// .el-tree-node__expand-icon {
// display: none;
// }
}
.sort-line {
display: flex;
width: 100%;
li {
padding: 12px 0;
&:first-child {
width: 230px;
}
&:nth-child(2) {
position: absolute;
left: 400px;
}
&:last-child {
position: absolute;
right: 50px;
}
}
}
.styles {
display: inline-flex;
li {
margin-right: 20px;
text-align: center;
&:hover .review {
border-color: #2962ff;
}
}
.review {
padding: 18px;
margin-bottom: 10px;
@ -538,6 +469,7 @@ export default {
border-radius: 2px;
}
}
.page-set {
padding: 6px;
}

176
src/pages/column/page/home.vue
Unescape View File

@ -3,11 +3,9 @@
<div class="actions">
<p class="page-name">页面设置/HOME</p>
<div>
<el-button type="primary"
@click="preview">预览</el-button>
<el-button type="primary" @click="preview">预览</el-button>
<el-button @click="save(0)">保存为草稿</el-button>
<el-button type="primary"
@click="save(1)">发布</el-button>
<el-button type="primary" @click="save(1)">发布</el-button>
<el-button @click="back">放弃编辑</el-button>
</div>
</div>
@ -17,17 +15,12 @@
<el-carousel height="500px"
:indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
<template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable"
:key="i">
<img width="100%"
height="100%"
:src="item.pic"
alt="">
<el-carousel-item v-if="item.pic && item.isEnable" :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 class="cover" @click="toSet(0)">点击更换banner与链接</div>
</div>
<div class="block">
@ -35,37 +28,26 @@
<div class="c-wrap">
<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 class="cover" @click="toSet(1)">点击更换标题与描述</div>
</div>
<ul class="card">
<li>
<img width="100%"
:src="modules[2].form.pic"
alt="">
<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="">
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
<div class="cover"
@click="toSet(2)">点击更改图片、标题概述与链接</div>
<div class="cover" @click="toSet(2)">点击更改图片、标题概述与链接</div>
</li>
<li>
<img width="100%"
:src="modules[3].form.pic"
alt="">
<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="">
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
<div class="cover"
@click="toSet(3)">点击更改图片、标题概述与链接</div>
<div class="cover" @click="toSet(3)">点击更改图片、标题概述与链接</div>
</li>
</ul>
</div>
@ -76,66 +58,70 @@
<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 class="cover" @click="toSet(4)">点击更换标题与描述</div>
</div>
<ul class="news">
<li>
<img src="https://huorantech.com/images/home/3.png"
alt="">
<img src="https://huorantech.com/images/home/3.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>
<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="https://huorantech.com/images/home/3.png"
alt="">
<img src="https://huorantech.com/images/home/3.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>
<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="https://huorantech.com/images/home/3.png"
alt="">
<img src="https://huorantech.com/images/home/3.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>
<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="https://huorantech.com/images/home/3.png"
alt="">
<img src="https://huorantech.com/images/home/3.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>
<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="https://huorantech.com/images/home/3.png"
alt="">
<img src="https://huorantech.com/images/home/3.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>
<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="https://huorantech.com/images/home/3.png"
alt="">
<img src="https://huorantech.com/images/home/3.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>
<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>
<div class="cover" @click="toSet(5)">点击更换标题与描述</div>
</ul>
</div>
</div>
@ -145,98 +131,77 @@
<div class="c-wrap">
<h2 class="b-title">{{ modules[6].form.title }}</h2>
<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">
<template v-for="(item, i) in modules[7].list">
<li v-if="item.isEnable"
:key="i">
<img class="pic"
:src="item.pic"
alt="">
<li v-if="item.isEnable" :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="">
<img class="arrow" src="@/assets/images/arrow.png" alt="">
</div>
</li>
</template>
<div class="cover"
@click="toSet(7)">点击更改图片、标题概述与链接</div>
<div class="cover" @click="toSet(7)">点击更改图片、标题概述与链接</div>
</ul>
</div>
</div>
<div class="about">
<div class="about" :style="{ backgroundImage: 'url(' + modules[8].form.pic + ')' }">
<div class="inner">
<img src="@/assets/images/about.png"
alt="">
<img src="@/assets/images/about.png" alt="">
<div class="line"></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 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="c-wrap">
<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>
<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>
<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>
<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>
<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>
<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>
<div class="cover" @click="toSet(15)">点击更换标题与描述</div>
</li>
</ul>
</div>
</div>
</div>
<Module ref="module"
:data.sync="curData"
:visible.sync="diaVisible"
@moduleSubmit="moduleSubmit" />
<Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
</div>
</template>
@ -277,29 +242,35 @@ export default {
<style lang="scss" scoped>
@import '../../../styles/page/page.scss';
.block {
.card {
display: flex;
justify-content: space-between;
li {
position: relative;
width: 660px;
}
.texts {
padding-left: 22px;
margin-top: 60px;
border-left: 2px solid #dfe4e9;
}
h6 {
margin-bottom: 25px;
font-size: 24px;
color: #333;
}
.des {
font-size: 18px;
color: #222;
line-height: 30px;
}
.arrow {
cursor: pointer;
}
@ -308,37 +279,45 @@ export default {
&.news-block {
background: url(../../../assets/images/info-bg.png) 0 0/100% 100% no-repeat;
}
.news {
position: relative;
display: flex;
flex-wrap: wrap;
li {
display: inline-flex;
width: 686px;
padding: 34px;
margin-bottom: 28px;
background-color: #fff;
&:nth-child(odd) {
margin-right: 28px;
}
}
img {
width: 237px;
height: 167px;
}
.texts {
margin-left: 34px;
}
h6 {
font-size: 18px;
color: #0648a8;
}
.des {
margin: 14px 0;
font-size: 16px;
color: #333;
line-height: 22px;
}
.meta {
font-size: 16px;
color: #999;
@ -347,25 +326,31 @@ export default {
.people {
position: relative;
li {
display: flex;
justify-content: space-between;
margin-bottom: 126px;
&:nth-child(even) {
flex-direction: row-reverse;
}
}
.pic {
width: 660px;
height: 465px;
}
.texts {
width: 680px;
padding-top: 150px;
}
h6 {
font-size: 40px;
}
.des {
font-size: 18px;
color: #020202;
@ -381,16 +366,19 @@ export default {
text-align: center;
border-bottom: 1px solid #dedede;
}
.stat {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
margin-top: 60px;
li {
position: relative;
width: 30%;
margin-bottom: 50px;
}
.num {
margin-bottom: 10px;
font-size: 60px;
@ -398,15 +386,18 @@ export default {
color: #035ce1;
line-height: 49px;
}
.text {
font-size: 24px;
}
}
}
.about {
position: relative;
padding: 77px 0 198px;
background: url(../../../assets/images/about-bg.png) 0 0/100% 100% no-repeat;
.line {
display: flex;
align-items: center;
@ -414,16 +405,19 @@ export default {
width: 88px;
height: 6px;
background-color: #fff;
&:after {
content: '';
width: 6px;
height: 6px;
}
}
.text {
font-size: 30px;
color: #fff;
}
.des {
padding: 38px 60px;
margin-top: 84px;

34
src/pages/seo/index.vue
Unescape View File

@ -1,40 +1,23 @@
<template>
<div class="page">
<p class="page-name mb">SEO管理</p>
<el-form ref="form"
:model="form"
:rules="rules"
class="input-form"
label-width="140px">
<el-form-item prop="title"
label="SEO标题">
<el-input placeholder="SEO标题"
v-model="form.title"
clearable
maxlength="100"></el-input>
<el-form ref="form" :model="form" :rules="rules" class="input-form" label-width="140px">
<el-form-item prop="title" label="SEO标题">
<el-input placeholder="SEO标题" v-model="form.title" clearable maxlength="100"></el-input>
</el-form-item>
<el-form-item prop="keyword"
label="SEO关键词">
<el-input placeholder="SEO关键词"
v-model="form.keyword"
clearable></el-input>
<el-form-item prop="keyword" label="SEO关键词">
<el-input placeholder="SEO关键词" v-model="form.keyword" clearable></el-input>
</el-form-item>
<el-form-item prop="description"
label="SEO描述">
<el-input type="textarea"
placeholder="SEO标题"
v-model="form.description"
clearable></el-input>
<el-form-item prop="description" label="SEO描述">
<el-input type="textarea" placeholder="SEO标题" v-model="form.description" clearable :rows="7"></el-input>
</el-form-item>
</el-form>
<div class="text-center">
<el-button type="primary"
@click="submit">保存</el-button>
<el-button type="primary" @click="submit">保存</el-button>
</div>
</div>
</template>
<script>
import Setting from '@/setting'
import Util from '@/libs/util'
export default {
data () {
@ -104,6 +87,7 @@ export default {
<style lang="scss" scoped>
.input-form {
.el-input,
.el-textarea {
width: 940px;

Write Preview
Loading…
Cancel
Save