|
|
@@ -1,14 +1,541 @@
|
|
|
<template>
|
|
|
- <div id="app">
|
|
|
- <nav>
|
|
|
- <router-link to="/">Home</router-link> |
|
|
|
- <router-link to="/about">About</router-link>
|
|
|
- </nav>
|
|
|
- <router-view/>
|
|
|
+ <div>
|
|
|
+ <div class="header">
|
|
|
+ <!-- <img src="/statics/image/loginLogo.png" class="logo" alt="华讯时代" style="height: 26px;width: 184px"/> -->
|
|
|
+ <div class="tplName">
|
|
|
+ <label>
|
|
|
+ <input v-model="viewTitle" placeholder="请输入标题名称" type="text" />
|
|
|
+ </label>
|
|
|
+ <i class="el-icon-edit"></i>
|
|
|
+ </div>
|
|
|
+ <div class="button-group">
|
|
|
+ <!-- <el-button type="primary" @click="previewAdvert" size="mini">预览</el-button>-->
|
|
|
+ <!-- <el-button type="primary" @click="lookJson" size="mini">查看JSON</el-button> -->
|
|
|
+ <el-button type="primary" @click="submit" size="mini">提交页面</el-button>
|
|
|
+ <el-button size="mini" @click="closeOpenWindows">关闭</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="editor">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <section class="decoration-edit">
|
|
|
+ <section class="l">
|
|
|
+ <div class="title">封面图片</div>
|
|
|
+ <div>
|
|
|
+ <div class="cover">
|
|
|
+ <img v-if="pic" :src="pic" />
|
|
|
+ <img v-else src="@/assets/images/defaultimg.jpg" />
|
|
|
+ </div>
|
|
|
+ <!-- 上传图片 -->
|
|
|
+ <div class="updataBtn">
|
|
|
+ <el-button style="width:100%" type="primary" size="mini" @click="updataImage">上传封面</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <ul>
|
|
|
+ <div class="title">组件选择</div>
|
|
|
+ <li v-for="(val, index) in typeList" :key="index + 1" @click="clickType(val)">
|
|
|
+ <img :src="require('./assets/images/' + val.icon)">
|
|
|
+ <!-- <img src="./assets/images/l-kefu.png"> -->
|
|
|
+ <!-- <span :class="val.icon"></span> -->
|
|
|
+ <p>{{ val.name }}</p>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section class="c">
|
|
|
+ <div class="top-nav">
|
|
|
+ <img src="./assets/images/topNavBlack.png">
|
|
|
+ <span class="tit">{{ viewTitle }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="view-content">
|
|
|
+ <div v-for="(item, index) in view" :key="index">
|
|
|
+ <div v-if="!item.isHover" :data-index="index" :key="index" class="item" @click="selectType(item)">
|
|
|
+ <component :is="item.com" :data="item" :key="index + '_'"></component>
|
|
|
+ <i @click="deleteItem($event, index)" class="el-icon-error"></i>
|
|
|
+ <div class="control-tool-bar">
|
|
|
+ <el-tooltip class="item" effect="light" content="上移" placement="bottom">
|
|
|
+ <el-button class="ctrl-icon icon-up" type="text" size="small" @click.stop="upItem(item)"
|
|
|
+ :disabled="index == 0"></el-button>
|
|
|
+ </el-tooltip>
|
|
|
+ <el-tooltip class="item" effect="light" content="下移" placement="bottom">
|
|
|
+ <el-button class="ctrl-icon icon-down" type="text" size="small" @click.stop="downItem(item)"
|
|
|
+ :disabled="index == view.length - getHoverList().length - 1"></el-button>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.isHover" :data-index="index" :key="index" class="item nobackground" :class="item.position"
|
|
|
+ :style="'width:' + (item.width ? item.width : 100) + 'px;height:' + (item.height ? item.height : 100) + 'px;'"
|
|
|
+ @click="selectType(item)">
|
|
|
+ <component :is="item.com" :data="item" :key="index + '_'"></component>
|
|
|
+ <i @click="deleteItem($event, index)" class="el-icon-error"></i>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section class="r" :class="isRight ? '' : 'nobackground'">
|
|
|
+ <component v-if="isRight" :is="propsData.setCom" :data="propsData"
|
|
|
+ @closeRightTemplateHandle="closeRightTemplateHandle" @updataContent="updataContent"></component>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <!-- <div class="submit-btn">
|
|
|
+ <el-button @click="submit">提交页面</el-button>
|
|
|
+ </div> -->
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <materialManage v-if="materialVisible" :on-success="chooseImageHandle" :file-type="1" item-or-src="item">
|
|
|
+ </materialManage>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
-<style lang="scss">
|
|
|
+
|
|
|
+<script>
|
|
|
+import service from './utlis/axios'
|
|
|
+import { setCookie, getCookie, clearCookie } from '@/utlis/utli'
|
|
|
+import materialManage from './components/materialManage.vue'
|
|
|
+import editorImage from '@/components/View/editorImage'
|
|
|
+import settingImage from '@/components/setting/settingImage'
|
|
|
+import editorBanner from '@/components/View/editorBanner'
|
|
|
+import settingBanner from '@/components/setting/settingBanner'
|
|
|
+import editorText from '@/components/View/editorText'
|
|
|
+import settingText from '@/components/setting/settingText'
|
|
|
+import editorApplicationForm from '@/components/View/editorApplicationForm'
|
|
|
+import settingApplicationForm from '@/components/setting/settingApplicationForm'
|
|
|
+import editorCustomerService from '@/components/View/editorCustomerService'
|
|
|
+import settingCustomerService from '@/components/setting/settingCustomerService'
|
|
|
+import editorProduct from '@/components/View/editorProduct'
|
|
|
+import settingProduct from '@/components/setting/settingProduct'
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ editorImage,
|
|
|
+ editorBanner,
|
|
|
+ settingImage,
|
|
|
+ settingBanner,
|
|
|
+ editorText,
|
|
|
+ settingText,
|
|
|
+ editorApplicationForm,
|
|
|
+ settingApplicationForm,
|
|
|
+ editorCustomerService,
|
|
|
+ settingCustomerService,
|
|
|
+ editorProduct,
|
|
|
+ settingProduct,
|
|
|
+ materialManage
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ pic: '',//封面
|
|
|
+ typeList: [
|
|
|
+ {
|
|
|
+ name: '轮播图',
|
|
|
+ key: 'banner',
|
|
|
+ icon: 'l-lunbo.png',
|
|
|
+ com: 'editorBanner',
|
|
|
+ setCom: 'settingBanner',
|
|
|
+ value: {
|
|
|
+ imageList: [{ src: '' }]
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ name: '图片',
|
|
|
+ key: 'images',
|
|
|
+ icon: 'l-tupian.png',
|
|
|
+ com: 'editorImage',
|
|
|
+ setCom: 'settingImage',
|
|
|
+ value: {
|
|
|
+ src: ''
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ name: '文本',
|
|
|
+ key: 'text',
|
|
|
+ icon: 'l-wenbeng.png',
|
|
|
+ com: 'editorText',
|
|
|
+ setCom: 'settingText',
|
|
|
+ value: {
|
|
|
+ content: '',
|
|
|
+ isTitle: false
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ name: '报名表',
|
|
|
+ key: 'applicationForm',
|
|
|
+ icon: 'l-baomingbiao.png',
|
|
|
+ com: 'editorApplicationForm',
|
|
|
+ setCom: 'settingApplicationForm',
|
|
|
+ value: {
|
|
|
+ title: { value: '报名表', isShow: true },
|
|
|
+ database: '',
|
|
|
+ formItemList: [{
|
|
|
+ label: '', databaseLabel: '', type: 1, required: true
|
|
|
+ }, {
|
|
|
+ label: '', databaseLabel: '', type: 1, required: true
|
|
|
+ }, {
|
|
|
+ label: '', databaseLabel: '', type: 5, required: true, option: [{ label: '', value: '' }, { label: '', value: '' }]
|
|
|
+ }],
|
|
|
+ buttonName: ''
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ name: '客服',
|
|
|
+ key: 'customerService',
|
|
|
+ icon: 'l-kefu.png',
|
|
|
+ com: 'editorCustomerService',
|
|
|
+ setCom: 'settingCustomerService',
|
|
|
+ isHover: true,
|
|
|
+ position: 'right-bottom',//left-top
|
|
|
+ width: '70',
|
|
|
+ height: '70',
|
|
|
+ value: {
|
|
|
+ type: '',
|
|
|
+ text: ''
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ name: '商品',
|
|
|
+ key: 'product',
|
|
|
+ icon: 'l-shangping.png',
|
|
|
+ com: 'editorProduct',
|
|
|
+ setCom: 'settingProduct',
|
|
|
+ value: {
|
|
|
+ layoutNum: 1,
|
|
|
+ productList: [],
|
|
|
+ showOriginalPrice: false
|
|
|
+ }
|
|
|
+ }],
|
|
|
+ view: [],
|
|
|
+ type: '',
|
|
|
+ propsData: {},
|
|
|
+ isRight: false,
|
|
|
+ materialVisible: false,
|
|
|
+ pass: true,//校验
|
|
|
+ id: null,
|
|
|
+ libraryExtendId: null,
|
|
|
+ viewTitle: '',
|
|
|
+ bindId: null,
|
|
|
+ bindType: null
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ info() {
|
|
|
+ return this.view[0]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ var sid = this.getUrlParamValue('sid');
|
|
|
+ sessionStorage.setItem('shiro.sesssion', sid)
|
|
|
+ if (sid) {
|
|
|
+ setCookie('shiro.sesssion', sid, 1)
|
|
|
+ } else {
|
|
|
+ setCookie('shiro.sesssion', "", -1);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 编辑
|
|
|
+ var id = this.getUrlParamValue('id');
|
|
|
+ var bindId = this.getUrlParamValue('bindId');
|
|
|
+ var bindType = this.getUrlParamValue('bindType');
|
|
|
+ this.id = id
|
|
|
+ this.bindId = bindId
|
|
|
+ this.bindType = bindType
|
|
|
+ if (id) {
|
|
|
+ this.getMaterialLibrary(id)
|
|
|
+ } else if (bindId) {
|
|
|
+ this.getMaterialLibraryByBindId(bindId, bindType)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 关闭窗口
|
|
|
+ closeOpenWindows() {
|
|
|
+ window.open("about:blank", "_top").close();
|
|
|
+ },
|
|
|
+ getImage(url) {
|
|
|
+ return require(url)
|
|
|
+ },
|
|
|
+ // 上传图片
|
|
|
+ updataImage() {
|
|
|
+ this.materialVisible = true
|
|
|
+ },
|
|
|
+ // 选择图片
|
|
|
+ chooseImageHandle(val) {
|
|
|
+ this.pic = val.url
|
|
|
+ this.materialVisible = false
|
|
|
+ },
|
|
|
+ getUrlParamValue(name) {
|
|
|
+ var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
|
|
|
+ var r = window.location.search.substr(1).match(reg);
|
|
|
+ if (r != null) return unescape(r[2]);
|
|
|
+ return null;
|
|
|
+ },
|
|
|
+ // 编辑，根据id查询
|
|
|
+ getMaterialLibrary(id) {
|
|
|
+ service.get("/material/library/" + id).then((res) => {
|
|
|
+ if (res.data.data) {
|
|
|
+ this.pic = res.data.data.pic
|
|
|
+ this.view = JSON.parse(res.data.data.libraryExtend.params)
|
|
|
+ this.id = res.data.data.id
|
|
|
+ this.libraryExtendId = res.data.data.libraryExtend.id
|
|
|
+ this.viewTitle = res.data.data.title
|
|
|
+ }
|
|
|
+ }).catch(function () {
|
|
|
+
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getMaterialLibraryByBindId(bindId, bindType) {
|
|
|
+ service.get(`/material/library/info?bindId=${bindId}&bindType=${bindType}`).then((res) => {
|
|
|
+ if (res.data.data) {
|
|
|
+ this.pic = res.data.data.pic
|
|
|
+ this.view = JSON.parse(res.data.data.libraryExtend.params)
|
|
|
+ this.id = res.data.data.id
|
|
|
+ this.libraryExtendId = res.data.data.libraryExtend.id
|
|
|
+ this.viewTitle = res.data.data.title
|
|
|
+ }
|
|
|
+ }).catch(() => {
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // index排序
|
|
|
+ position() {
|
|
|
+ let commonList = this.view.filter((item) => { return item.isHover != true })
|
|
|
+ let hoverList = this.view.filter((item) => { return item.isHover == true })
|
|
|
+ this.view = [...commonList, ...hoverList]
|
|
|
+ this.view.forEach((item, index) => {
|
|
|
+ item.index = index
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getHoverList() {
|
|
|
+ return this.view.filter((item) => { return item.isHover == true })
|
|
|
+ },
|
|
|
+ clickType(val) {
|
|
|
+ this.view.push(JSON.parse(JSON.stringify(val)))
|
|
|
+ this.position()
|
|
|
+ },
|
|
|
+ deleteItem(e, index) {
|
|
|
+ e.preventDefault()
|
|
|
+ e.stopPropagation()
|
|
|
+ this.view.splice(index, 1)
|
|
|
+ this.isRight = false
|
|
|
+ this.propsData = {}
|
|
|
+ this.position()
|
|
|
+ },
|
|
|
+ selectType(val) {
|
|
|
+ this.isRight = false
|
|
|
+ this.propsData = val
|
|
|
+ this.$nextTick(() => this.isRight = true)
|
|
|
+ },
|
|
|
+ closeRightTemplateHandle(val) {
|
|
|
+ this.isRight = val
|
|
|
+ },
|
|
|
+ updataContent(val) {
|
|
|
+ this.$set(this.view, val.index, JSON.parse(JSON.stringify(val)))
|
|
|
+ // this.view.forEach(item => {
|
|
|
+ // if(item.key==val.key&&item.index==val.index) item = JSON.parse(JSON.stringify(val))
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ lookJson() {
|
|
|
+ this.$alert(JSON.stringify(this.view), 'JSON', {
|
|
|
+ confirmButtonText: '确定'
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 上移
|
|
|
+ upItem(item) {
|
|
|
+ if (item.index == 0) return
|
|
|
+ if (this.view[item.index - 1].isHover) {
|
|
|
+ this.swapArray(this.view, item.index - 2, item.index);
|
|
|
+ } else {
|
|
|
+ this.swapArray(this.view, item.index - 1, item.index);
|
|
|
+ }
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.selectType(item);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 下移
|
|
|
+ downItem(item) {
|
|
|
+ if (item.index == this.view.length) return
|
|
|
+ if (this.view[item.index + 1].isHover) {
|
|
|
+ this.swapArray(this.view, item.index, item.index + 2);
|
|
|
+ } else {
|
|
|
+ this.swapArray(this.view, item.index, item.index + 1);
|
|
|
+ }
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.selectType(item);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //数组元素互换位置
|
|
|
+ swapArray(arr, index1, index2) {
|
|
|
+ arr[index1] = arr.splice(index2, 1, arr[index1])[0];
|
|
|
+ this.position()
|
|
|
+ return arr;
|
|
|
+ },
|
|
|
+ // 提交
|
|
|
+ submit() {
|
|
|
+ this.checkSubmit()
|
|
|
+ if (this.pass) {
|
|
|
+ let posObj = {
|
|
|
+ pic: this.pic,
|
|
|
+ libraryExtend: {
|
|
|
+ params: JSON.stringify(this.view)
|
|
|
+ },
|
|
|
+ title: this.viewTitle,
|
|
|
+ rootCode: 'brochure'
|
|
|
+ }
|
|
|
+ if (this.id) {
|
|
|
+ posObj.id = this.id
|
|
|
+ posObj.libraryExtend.id = this.libraryExtendId
|
|
|
+ service.put("/material/library", posObj).then((res) => {
|
|
|
+ this.$message.success('编辑成功')
|
|
|
+ }).catch(function () {
|
|
|
+
|
|
|
+ });
|
|
|
+ }else {
|
|
|
+ if (this.bindId) {
|
|
|
+ posObj.bindId = this.bindId
|
|
|
+ posObj.bindType = this.bindType
|
|
|
+ }
|
|
|
+ service.post("/material/library", posObj).then((res) => {
|
|
|
+ if (res.data.data.code)
|
|
|
+ this.$message.success('提交成功')
|
|
|
+ }).catch(function () {
|
|
|
+
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 校验
|
|
|
+ checkSubmit() {
|
|
|
+ let that = this
|
|
|
+ that.pass = true
|
|
|
+ if (this.view.length == 0) {
|
|
|
+ that.pass = false
|
|
|
+ return this.$message.error("请添加组件");
|
|
|
+ }
|
|
|
+ if (!this.pic || this.pic == '') {
|
|
|
+ that.pass = false
|
|
|
+ return this.$message.error("请上传封面");
|
|
|
+ }
|
|
|
+ if (!this.viewTitle || this.viewTitle == '') {
|
|
|
+ that.pass = false
|
|
|
+ return this.$message.error("请填写标题");
|
|
|
+ }
|
|
|
+ this.view.forEach(item => {
|
|
|
+ if (!that.pass) return
|
|
|
+ switch (item.key) {
|
|
|
+ case 'banner':
|
|
|
+ {
|
|
|
+ item.value.imageList.forEach((src) => {
|
|
|
+ if (!src.src || src.src == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("请选择banner图图片");
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 'images':
|
|
|
+ {
|
|
|
+ if (!item.value.src || item.value.src == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("请选择图片");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 'text':
|
|
|
+ {
|
|
|
+ if (!item.value.content || item.value.content == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("文本不能为空");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 'applicationForm':
|
|
|
+ {
|
|
|
+ if (item.value.title.isShow && (!item.value.title.value || item.value.title.value == '')) {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("已开启显示标题，标题不能为空");
|
|
|
+ } else if (!item.value.database || item.value.database == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("表单数据库名不能为空");
|
|
|
+ } else if (!item.value.buttonName || item.value.buttonName == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("表单按钮名称不能为空");
|
|
|
+ } else if (item.value.formItemList) {
|
|
|
+ item.value.formItemList.forEach(sitem => {
|
|
|
+ if (!that.pass) return
|
|
|
+ if (!sitem.label || sitem.label == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("表单字段名不能为空");
|
|
|
+ } else if (!sitem.databaseLabel || sitem.databaseLabel == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("表单数据库字段名不能为空");
|
|
|
+ } else if (sitem.type == 'select') {
|
|
|
+ if (!sitem.option) {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("表单下拉框选项不能为空");
|
|
|
+ } else {
|
|
|
+ sitem.option.forEach(ssitem => {
|
|
|
+ if (!ssitem.label || ssitem.label == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("表单下拉框选项标签不能为空");
|
|
|
+ } else if (!ssitem.value || ssitem.value == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("表单下拉框选项值不能为空");
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 'customerService':
|
|
|
+ {
|
|
|
+ if (item.value.type == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("请填写客服类型");
|
|
|
+ } else if (item.value.type == 1) {
|
|
|
+ if (!item.value.id || item.value.id == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("请填写企业ID");
|
|
|
+ } else if (!item.value.target || item.value.target == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("请填写跳转地址");
|
|
|
+ }
|
|
|
+ } else if (item.value.type == 2) {
|
|
|
+ if (!item.value.target || item.value.target == '') {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("请填写跳转地址");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 'product':
|
|
|
+ {
|
|
|
+ if (!item.value.productList || item.value.productList.length == 0) {
|
|
|
+ that.pass = false
|
|
|
+ this.selectType(item)
|
|
|
+ return this.$message.error("请选择商品");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return that.pass
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
#app {
|
|
|
font-family: Avenir, Helvetica, Arial, sans-serif;
|
|
|
-webkit-font-smoothing: antialiased;
|
|
|
@@ -17,16 +544,345 @@
|
|
|
color: #2c3e50;
|
|
|
}
|
|
|
|
|
|
-nav {
|
|
|
- padding: 30px;
|
|
|
+.header {
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ height: 44px;
|
|
|
+ background-color: #fff;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+}
|
|
|
|
|
|
- a {
|
|
|
- font-weight: bold;
|
|
|
- color: #2c3e50;
|
|
|
+.tplName {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ height: 100%;
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
|
|
|
- &.router-link-exact-active {
|
|
|
- color: #42b983;
|
|
|
- }
|
|
|
- }
|
|
|
+.tplName input {
|
|
|
+ width: 199px;
|
|
|
+ font-size: 16px;
|
|
|
+ outline: none;
|
|
|
+ border: 0;
|
|
|
+ border-bottom: 1px solid #ddd;
|
|
|
+ height: 30px;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.button-group {
|
|
|
+ margin-right: 15px;
|
|
|
+ position: absolute;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0 0 10px 0;
|
|
|
+ background: #f7f8f9;
|
|
|
+ height: calc(100vh - 70px);
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .cover {
|
|
|
+ padding: 10px 20px 10px 10px;
|
|
|
+ height: 110px;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .cover img {
|
|
|
+ max-width: 100%;
|
|
|
+ max-height: 100%;
|
|
|
+ position: relative;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .updataBtn {
|
|
|
+ padding: 0px 30px 10px 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .l,
|
|
|
+.r {
|
|
|
+ width: 380px;
|
|
|
+ height: 100%;
|
|
|
+ padding: 0 0 15px 0;
|
|
|
+ background: #fff;
|
|
|
+ overflow-y: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .l {
|
|
|
+ width: 220px;
|
|
|
+ margin-right: 160px;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .l .title {
|
|
|
+ position: relative;
|
|
|
+ font-weight: bold;
|
|
|
+ padding-left: 10px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .l .title:before {
|
|
|
+ content: "";
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 0;
|
|
|
+ transform: translateY(-50%);
|
|
|
+ width: 3px;
|
|
|
+ height: 18px;
|
|
|
+ background: #1890ff;
|
|
|
+ opacity: 1;
|
|
|
+ border-radius: 2px;
|
|
|
+}
|
|
|
+
|
|
|
+.nobackground {
|
|
|
+ background: unset !important;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .l::-webkit-scrollbar,
|
|
|
+.r::-webkit-scrollbar {
|
|
|
+ width: 6px;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .l::-webkit-scrollbar-thumb,
|
|
|
+.r::-webkit-scrollbar-thumb {
|
|
|
+ background: #dbdbdb;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .l::-webkit-scrollbar-track,
|
|
|
+.r::-webkit-scrollbar-track {
|
|
|
+ background: #f6f6f6;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .l ul {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit ul li {
|
|
|
+ width: 80px;
|
|
|
+ height: 80px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+ cursor: default;
|
|
|
+ list-style: none;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #666;
|
|
|
+ float: left;
|
|
|
+ margin: 0 10px;
|
|
|
+ border-radius: 6px;
|
|
|
+ transition: all .3s;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit ul li:hover {
|
|
|
+ background: #efefef;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit ul span {
|
|
|
+ display: block;
|
|
|
+ font-size: 40px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit ul img {
|
|
|
+ display: block;
|
|
|
+ width: 50px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+}
|
|
|
+
|
|
|
+ul p {
|
|
|
+ display: block;
|
|
|
+ margin: 0;
|
|
|
+ font-size: 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .c {
|
|
|
+ width: auto;
|
|
|
+ /* max-width: 400px; */
|
|
|
+ max-width: 370px;
|
|
|
+ position: relative;
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .c .top-nav {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ background: #fff;
|
|
|
+ z-index: 999;
|
|
|
+ transition: all .3s;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .c .top-nav * {
|
|
|
+ pointer-events: none;
|
|
|
+}
|
|
|
+
|
|
|
+/* .decoration-edit .top-nav:hover {
|
|
|
+ transform: scale(0.95);
|
|
|
+ border-radius: 10px;
|
|
|
+ overflow: hidden;
|
|
|
+ box-shadow: 0 0 10px #afafaf;
|
|
|
+} */
|
|
|
+
|
|
|
+.decoration-edit .top-nav .tit {
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ bottom: 10px;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ max-width: 50%;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .top-nav img {
|
|
|
+ max-width: 100%;
|
|
|
+ image-rendering: -moz-crisp-edges;
|
|
|
+ image-rendering: -o-crisp-edges;
|
|
|
+ image-rendering: -webkit-optimize-contrast;
|
|
|
+ image-rendering: crisp-edges;
|
|
|
+ -ms-interpolation-mode: nearest-neighbor;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content {
|
|
|
+ /* width: 400px; */
|
|
|
+ /* height: 700px; */
|
|
|
+ width: 370px;
|
|
|
+ height: 560px;
|
|
|
+ background: #f5f5f5;
|
|
|
+ overflow-y: auto;
|
|
|
+ overflow-x: hidden;
|
|
|
+ padding-top: 72px;
|
|
|
+ box-shadow: 0 2px 6px #ccc;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content::-webkit-scrollbar {
|
|
|
+ width: 6px;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content::-webkit-scrollbar-thumb {
|
|
|
+ background: #dbdbdb;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content::-webkit-scrollbar-track {
|
|
|
+ background: #f6f6f6;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item {
|
|
|
+ transition: all .3s;
|
|
|
+ background: #fff;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item:hover {
|
|
|
+ transform: scale(0.95);
|
|
|
+ border-radius: 10px;
|
|
|
+ box-shadow: 0 0 10px #afafaf;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item:hover .el-icon-error {
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item:hover .control-tool-bar {
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item div {
|
|
|
+ pointer-events: none;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item .wait {
|
|
|
+ background: #deedff;
|
|
|
+ height: 35px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 35px;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #666;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item .el-icon-error {
|
|
|
+ position: absolute;
|
|
|
+ right: -10px;
|
|
|
+ top: -6px;
|
|
|
+ color: red;
|
|
|
+ font-size: 25px;
|
|
|
+ cursor: pointer;
|
|
|
+ display: none;
|
|
|
+ z-index: 9999;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item .control-tool-bar {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 50%;
|
|
|
+ width: 66px;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ z-index: 9998;
|
|
|
+ pointer-events: unset;
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item .control-tool-bar .ctrl-icon {
|
|
|
+ width: 33px;
|
|
|
+ height: 33px;
|
|
|
+ margin-left: 0;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ background-color: #fff;
|
|
|
+ -webkit-box-shadow: 0 0 4px 2px rgb(0 0 0 / 10%);
|
|
|
+ box-shadow: 0 0 4px 2px rgb(0 0 0 / 10%);
|
|
|
+ border-radius: 4px;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-position: 50%;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item .control-tool-bar .icon-up {
|
|
|
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3BpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo1ZjA2NzFlZS0yODUwLWMyNDMtYWQzNS00YzEzY2I2ZDFhZmIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6Q0VGMTU4N0Y3RTJEMTFFQTgwMUNFQjgwRkEwOUFENzkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6Q0VGMTU4N0U3RTJEMTFFQTgwMUNFQjgwRkEwOUFENzkiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBNUJFQTg0MTdENkUxMUVBODc0MkE4MTAxQTY0ODkxQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBNUJFQTg0MjdENkUxMUVBODc0MkE4MTAxQTY0ODkxQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Psjmc8UAAADNSURBVHjaYvz//z8DLQATA43AwBtcV1c3B4hNiVXPSEwYAw2cBKRygfg1EMs3NTV9p9jFQEMroIaCgCgQH6U4KICGFgCpdjRhQ6D4cbKDAqg5CEitxaN3PTBIgkhyMdBQCwKGgkAgUN0Eog0GKo4CUseJjPx8oPo12CRYsIgJAfFeIP4AxFxA7IlFzRUgvg7EnGQnN6CLsClIBYbvHEpShSQOKQFK0zEzuel/GBdC1DaYBYc4DwOZGmHgMxC/A2JWNPGHVCk2R0bkAQQYAEdHPS1kdX1UAAAAAElFTkSuQmCC);
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item .control-tool-bar .icon-up.is-disabled,
|
|
|
+.decoration-edit .view-content .item .control-tool-bar .icon-up.is-disabled:hover {
|
|
|
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo1ZjA2NzFlZS0yODUwLWMyNDMtYWQzNS00YzEzY2I2ZDFhZmIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QTVCRUE4NDI3RDZFMTFFQTg3NDJBODEwMUE2NDg5MUIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QTVCRUE4NDE3RDZFMTFFQTg3NDJBODEwMUE2NDg5MUIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4YWNlODEyNi1kZWFkLTQzNDYtOGRhOC00MmFlMDYxMmI0ZGYiIHN0UmVmOmRvY3VtZW50SUQ9ImFkb2JlOmRvY2lkOnBob3Rvc2hvcDpiMzgxMjliYS02OTNiLTJmNDgtOThhZS1mYzkxMGE4ZGYzZTAiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5lL4zAAAAAzUlEQVR42mL8//8/Ay0AEwONwMAb/Pz58zlAbEqsekZiwhho4CQglQvEr4FYXlJS8jvFLgYaWgE1FAREgfgoxUEBNLQASLWjCRsCxY+THRRAzUFAai0eveuBQRJEkouBhloQMBQEAoHqJhBtMFBxFJA6TmTk5wPVr8EmwYJFTAiI9wLxByDmAmJPLGquAPF1IOYkO7kBXYRNQSowfOdQkiokcUgJUJqOmclN/8O4EKK2wSw4xHkYyNQIA5+B+B0Qs6KJP6RKsTkyIg8gwABPpUl7JDE4ewAAAABJRU5ErkJggg==);
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item .control-tool-bar .icon-down {
|
|
|
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3BpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo1ZjA2NzFlZS0yODUwLWMyNDMtYWQzNS00YzEzY2I2ZDFhZmIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QTNBRUJGODk3RTJGMTFFQUI4NkRDMzY1NkIyMzY1M0EiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QTNBRUJGODg3RTJGMTFFQUI4NkRDMzY1NkIyMzY1M0EiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpCOEQyMTUwMTdENkUxMUVBODc0MkE4MTAxQTY0ODkxQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpCOEQyMTUwMjdENkUxMUVBODc0MkE4MTAxQTY0ODkxQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PqOiNT4AAADgSURBVHjaYvz//z8DLQATA40ACyEFdXV10kCqHYiFoULfgbirqanpFEUGA0ELEMeiiRkDsSKlQcFOqzD+QaQYfSJveBr8F4vYf2oY/J8cgxmxZWlgprgDTeO/gFgciPnQlIDEH0EdxgXMLJLEungrEMsDsSoWQ0GADYhVgFgJiK8QHRRAF+QDqQ4igukQUK0r0UGBFCTLgFQkDunzQEONyIo8oMYoILUPi9Q7ILYiOfKwuPw8kDJAKt20gJY+oEYGsUVimxIylGgXQ11tCqTkgIauJUY945CrmmhmMECAAQCTB0MOORfSxwAAAABJRU5ErkJggg==);
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item .control-tool-bar .icon-down.is-disabled,
|
|
|
+.decoration-edit .view-content .item .control-tool-bar .icon-down.is-disabled:hover {
|
|
|
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3BpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo1ZjA2NzFlZS0yODUwLWMyNDMtYWQzNS00YzEzY2I2ZDFhZmIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTExNDM5QjQ3RTJFMTFFQTlFQjdEMTA2RjhFQzc3QTAiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTExNDM5QjM3RTJFMTFFQTlFQjdEMTA2RjhFQzc3QTAiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpCOEQyMTUwMTdENkUxMUVBODc0MkE4MTAxQTY0ODkxQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpCOEQyMTUwMjdENkUxMUVBODc0MkE4MTAxQTY0ODkxQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Poa9sGQAAADjSURBVHjaYvz//z8DLQATA40ACyEFz58/lwZS7UAsDBX6DsRdkpKSpygyGAhagDgWTcwYiBUpDQp2WoXxDyLF6BN5w9Pgv1jE/lPD4P/kGMyILUsDM8UdaBr/BcTiQMyHpgQk/gjqMC5gZpEk1sVbgVgeiFWxGAoCbECsAsRKQHyF6KAAOiAfSHUQEUyHgGpdiQ4KpCBZBqQicUifBxpqRFbkATVGAal9WKTeAbEVRakCaLgzkLqAJAQq3YyB4j+okUFskdimQEMfkJXccIS3KZCSAxq6lhj1jEOuaqKZwQABBgC4Mzjx6VYCZQAAAABJRU5ErkJggg==);
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .view-content .item .control-tool-bar .ctrl-icon.is-disabled {
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.decoration-edit .submit-btn {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 30px;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+}
|
|
|
+
|
|
|
+/* 悬浮组件 */
|
|
|
+.left-top {
|
|
|
+ position: absolute;
|
|
|
+ top: 100px;
|
|
|
+ left: 20px;
|
|
|
+ z-index: 200;
|
|
|
+}
|
|
|
+
|
|
|
+.right-bottom {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 50px;
|
|
|
+ right: 20px;
|
|
|
+ z-index: 200;
|
|
|
}
|
|
|
</style>
|
xionghaojie
