wuhui_zzw
/
wyyl
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

页尾编辑

This commit is contained in:
pushuo 2022-08-09 10:53:32 +08:00
parent c273d52f54
commit 2e4115dbe6
16 changed files with 495 additions and 144 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
beike/Admin/Http/Controllers/DesignFooterController.php
View File

@ -19,7 +19,7 @@ class DesignFooterController extends Controller
public function index(Request $request): View public function index(Request $request): View
{ {
$data = [ $data = [
'languages' => LanguageRepo::all(), // 'languages' => LanguageRepo::all(),
'design_settings' => system_setting('base.footer_setting'), 'design_settings' => system_setting('base.footer_setting'),
]; ];
return view('admin::pages.design.builder.footer', $data); return view('admin::pages.design.builder.footer', $data);

34
public/build/beike/admin/css/design.css vendored
View File

@ -339,6 +339,40 @@ body.page-design .autocomplete-group-wrapper .item-group-wrapper .item i.right:h
color: #222; color: #222;
} }
.footer-link-item {
padding: 6px 10px;
background: #f5f5f5;
margin-bottom: 10px;
position: relative;
}
.footer-link-item:hover .remove-item {
display: block;
}
.footer-link-item .icon-rank {
position: absolute;
top: 11px;
left: 10px;
z-index: 9;
}
.footer-link-item .link-selector-wrap > .title {
padding-left: 20px;
}
.footer-link-item .remove-item {
position: absolute;
display: none;
top: 0;
right: 0;
background: red;
color: #fff;
z-index: 9;
padding: 0 4px;
cursor: pointer;
border-radius: 0 0 0 4px;
}
.footer-link-item .remove-item:hover {
background: #c70000;
}
.file-manager-box .layui-layer-title { .file-manager-box .layui-layer-title {
background-color: #293042; background-color: #293042;
color: #fff; color: #fff;

111
public/build/beike/admin/js/app.js vendored
View File

@ -2063,34 +2063,18 @@ module.exports = {
"use strict"; "use strict";
__webpack_require__.r(__webpack_exports__); __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _js_http__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../js/http */ "./resources/js/http.js"); /* harmony import */ var _js_http__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../js/http */ "./resources/js/http.js");
/* harmony import */ var _common__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./common */ "./resources/beike/admin/js/common.js");
var _document$querySelect; var _document$querySelect;
window.$http = _js_http__WEBPACK_IMPORTED_MODULE_0__["default"]; window.$http = _js_http__WEBPACK_IMPORTED_MODULE_0__["default"];
window.bk = _common__WEBPACK_IMPORTED_MODULE_1__["default"];
var base = document.querySelector('base').href; var base = document.querySelector('base').href;
var asset = document.querySelector('meta[name="asset"]').content; var asset = document.querySelector('meta[name="asset"]').content;
var editor_language = ((_document$querySelect = document.querySelector('meta[name="editor_language"]')) === null || _document$querySelect === void 0 ? void 0 : _document$querySelect.content) || 'zh_cn'; var editor_language = ((_document$querySelect = document.querySelector('meta[name="editor_language"]')) === null || _document$querySelect === void 0 ? void 0 : _document$querySelect.content) || 'zh_cn';
$(document).on('click', '.open-file-manager', function (event) { $(document).on('click', '.open-file-manager', function (event) {
var $this = $(this); bk.fileManagerIframe();
layer.open({
type: 2,
title: '图片管理器',
shadeClose: false,
skin: 'file-manager-box',
scrollbar: false,
shade: 0.4,
area: ['1060px', '680px'],
content: "".concat(base, "/file_manager"),
success: function success(layerInstance, index) {
var iframeWindow = window[layerInstance.find("iframe")[0]["name"]];
iframeWindow.callback = function (images) {
$this.find('img').prop('src', images[0].url);
$this.next('input').val(images[0].path);
$this.next('input')[0].dispatchEvent(new Event('input'));
};
}
});
}); });
if (typeof Vue != 'undefined') { if (typeof Vue != 'undefined') {
@ -2126,7 +2110,7 @@ $(document).ready(function ($) {
tinymceInit(); tinymceInit();
}); });
function tinymceInit() { var tinymceInit = function tinymceInit() {
if (typeof tinymce == 'undefined') { if (typeof tinymce == 'undefined') {
return; return;
} }
@ -2148,40 +2132,75 @@ function tinymceInit() {
fontsize_formats: "10px 12px 14px 18px 24px 36px", fontsize_formats: "10px 12px 14px 18px 24px 36px",
relative_urls: true, relative_urls: true,
setup: function setup(ed) { setup: function setup(ed) {
var height = ed.getElement().dataset.tinymceHeight; // console.log(ed);
// 修改 tinymce 的高度
// if (height) {
// ed.theme.resizeTo(null, height);
// }
ed.ui.registry.addButton('toolbarImageButton', { ed.ui.registry.addButton('toolbarImageButton', {
// text: '', // text: '',
icon: 'image', icon: 'image',
onAction: function onAction() { onAction: function onAction() {
layer.open({ bk.fileManagerIframe(function (images) {
type: 2, if (images.length) {
title: '图片管理器', images.forEach(function (e) {
shadeClose: false, ed.insertContent("<img src='/".concat(e.path, "' class=\"img-fluid\" />"));
skin: 'file-manager-box', });
scrollbar: false,
shade: 0.4,
area: ['1060px', '680px'],
content: "".concat(base, "/file_manager"),
success: function success(layerInstance, index) {
var iframeWindow = window[layerInstance.find("iframe")[0]["name"]];
iframeWindow.callback = function (images) {
if (images.length) {
images.forEach(function (e) {
ed.insertContent("<img src='/".concat(e.path, "' class=\"img-fluid\" />"));
});
}
};
} }
}); });
} }
}); // ed.on('change', function(e) { });
// if (e.target.targetElm.dataset.key) {
// app.form[e.target.targetElm.dataset.key] = ed.getContent()
// }
// });
} }
}); });
} };
/***/ }),
/***/ "./resources/beike/admin/js/common.js":
/*!********************************************!*\
!*** ./resources/beike/admin/js/common.js ***!
\********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/*
* @copyright 2022 opencart.cn - All Rights Reserved.
* @link https://www.guangdawangluo.com
* @Author PS <pushuo@opencart.cn>
* @Date 2022-08-09 09:39:34
* @LastEditTime 2022-08-09 09:43:18
*/
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({
fileManagerIframe: function fileManagerIframe(callback) {
var base = document.querySelector('base').href;
var $this = $(this);
layer.open({
type: 2,
title: '图片管理器',
shadeClose: false,
skin: 'file-manager-box',
scrollbar: false,
shade: 0.4,
area: ['1060px', '680px'],
content: "".concat(base, "/file_manager"),
success: function success(layerInstance, index) {
var iframeWindow = window[layerInstance.find("iframe")[0]["name"]];
iframeWindow.callback = function (images) {
if (callback && typeof callback === "function") return callback(images);
$this.find('img').prop('src', images[0].url);
$this.next('input').val(images[0].path);
$this.next('input')[0].dispatchEvent(new Event('input'));
};
}
});
}
});
/***/ }), /***/ }),

12
public/build/beike/shop/default/css/app.css vendored
View File

@ -582,27 +582,27 @@ footer {
background: #fafafa; background: #fafafa;
margin-top: 5rem; margin-top: 5rem;
} }
footer .footer-top { footer .services-wrap {
padding: 2.2rem 0; padding: 2.2rem 0;
border-bottom: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4;
} }
footer .footer-top .service-item { footer .services-wrap .service-item {
display: flex; display: flex;
align-items: center; align-items: center;
} }
footer .footer-top .service-item .icon { footer .services-wrap .service-item .icon {
width: 34px; width: 34px;
margin-right: 14px; margin-right: 14px;
} }
footer .footer-top .service-item p { footer .services-wrap .service-item p {
margin-bottom: 0; margin-bottom: 0;
} }
footer .footer-top .service-item .title { footer .services-wrap .service-item .title {
margin-bottom: 2px; margin-bottom: 2px;
font-weight: bold; font-weight: bold;
color: #333; color: #333;
} }
footer .footer-top .service-item .sub-title { footer .services-wrap .service-item .sub-title {
font-size: 0.6rem; font-size: 0.6rem;
color: #8D94A0; color: #8D94A0;
} }

7
public/build/beike/shop/default/js/app.js vendored
View File

@ -2065,6 +2065,13 @@ __webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ }); /* harmony export */ });
/*
* @copyright 2022 opencart.cn - All Rights Reserved.
* @link https://www.guangdawangluo.com
* @Author PS <pushuo@opencart.cn>
* @Date 2022-08-04 17:22:54
* @LastEditTime 2022-08-09 09:40:08
*/
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({
/** /**
* @description: 获取购物车数据 * @description: 获取购物车数据

46
resources/beike/admin/css/design/app.scss vendored
View File

@ -430,6 +430,52 @@ body.page-design {
} }
} }
.footer-link-item {
padding: 6px 10px;
background: #f5f5f5;
margin-bottom: 10px;
position: relative;
&:hover {
.remove-item {
display: block;
}
}
.icon-rank {
position: absolute;
top: 11px;
left: 10px;
z-index: 9;
}
.link-selector-wrap {
> .title {
padding-left: 20px;
}
.selector-type .title {
// line-height: 1.42857;
}
}
.remove-item {
position: absolute;
display: none;
top: 0;
right: 0;
background: red;
color: #fff;
z-index: 9;
padding: 0 4px;
cursor: pointer;
border-radius: 0 0 0 4px;
&:hover {
background: #c70000;
}
}
}
.file-manager-box { .file-manager-box {
.layui-layer-title { .layui-layer-title {
background-color: #293042; background-color: #293042;

68
resources/beike/admin/js/app.js vendored
View File

@ -1,30 +1,14 @@
import http from "../../../js/http"; import http from "../../../js/http";
window.$http = http; window.$http = http;
import common from "./common";
window.bk = common;
const base = document.querySelector('base').href; const base = document.querySelector('base').href;
const asset = document.querySelector('meta[name="asset"]').content; const asset = document.querySelector('meta[name="asset"]').content;
const editor_language = document.querySelector('meta[name="editor_language"]')?.content || 'zh_cn'; const editor_language = document.querySelector('meta[name="editor_language"]')?.content || 'zh_cn';
$(document).on('click', '.open-file-manager', function(event) { $(document).on('click', '.open-file-manager', function(event) {
const $this = $(this); bk.fileManagerIframe();
layer.open({
type: 2,
title: '图片管理器',
shadeClose: false,
skin: 'file-manager-box',
scrollbar: false,
shade: 0.4,
area: ['1060px', '680px'],
content: `${base}/file_manager`,
success: function(layerInstance, index) {
var iframeWindow = window[layerInstance.find("iframe")[0]["name"]];
iframeWindow.callback = function(images) {
$this.find('img').prop('src', images[0].url);
$this.next('input').val(images[0].path)
$this.next('input')[0].dispatchEvent(new Event('input'));
}
}
});
}); });
if (typeof Vue != 'undefined') { if (typeof Vue != 'undefined') {
@ -53,7 +37,7 @@ $(document).ready(function ($) {
tinymceInit() tinymceInit()
}); });
function tinymceInit() { const tinymceInit = () => {
if (typeof tinymce == 'undefined') { if (typeof tinymce == 'undefined') {
return; return;
} }
@ -75,38 +59,28 @@ function tinymceInit() {
"微软雅黑='Microsoft YaHei';黑体=黑体;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Georgia=georgia,palatino;Helvetica=helvetica;Times New Roman=times new roman,times;Verdana=verdana,geneva", "微软雅黑='Microsoft YaHei';黑体=黑体;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Georgia=georgia,palatino;Helvetica=helvetica;Times New Roman=times new roman,times;Verdana=verdana,geneva",
fontsize_formats: "10px 12px 14px 18px 24px 36px", fontsize_formats: "10px 12px 14px 18px 24px 36px",
relative_urls : true, relative_urls : true,
setup:function(ed) { setup: function(ed) {
const height = ed.getElement().dataset.tinymceHeight;
// console.log(ed);
// 修改 tinymce 的高度
// if (height) {
// ed.theme.resizeTo(null, height);
// }
ed.ui.registry.addButton('toolbarImageButton',{ ed.ui.registry.addButton('toolbarImageButton',{
// text: '', // text: '',
icon: 'image', icon: 'image',
onAction:function() { onAction:function() {
layer.open({ bk.fileManagerIframe(images => {
type: 2, if (images.length) {
title: '图片管理器', images.forEach(e => {
shadeClose: false, ed.insertContent(`<img src='/${e.path}' class="img-fluid" />`);
skin: 'file-manager-box', });
scrollbar: false,
shade: 0.4,
area: ['1060px', '680px'],
content: `${base}/file_manager`,
success: function(layerInstance, index) {
var iframeWindow = window[layerInstance.find("iframe")[0]["name"]];
iframeWindow.callback = function(images) {
if (images.length) {
images.forEach(e => {
ed.insertContent(`<img src='/${e.path}' class="img-fluid" />`);
});
}
}
} }
}); })
} }
}); });
// ed.on('change', function(e) {
// if (e.target.targetElm.dataset.key) {
// app.form[e.target.targetElm.dataset.key] = ed.getContent()
// }
// });
} }
}); });
} }

34
resources/beike/admin/js/common.js vendored Normal file
View File

@ -0,0 +1,34 @@
/*
* @copyright 2022 opencart.cn - All Rights Reserved.
* @link https://www.guangdawangluo.com
* @Author PS <pushuo@opencart.cn>
* @Date 2022-08-09 09:39:34
* @LastEditTime 2022-08-09 09:43:18
*/
export default {
fileManagerIframe(callback) {
const base = document.querySelector('base').href;
const $this = $(this);
layer.open({
type: 2,
title: '图片管理器',
shadeClose: false,
skin: 'file-manager-box',
scrollbar: false,
shade: 0.4,
area: ['1060px', '680px'],
content: `${base}/file_manager`,
success: function(layerInstance, index) {
var iframeWindow = window[layerInstance.find("iframe")[0]["name"]];
iframeWindow.callback = function(images) {
if (callback && typeof(callback) === "function") return callback(images);
$this.find('img').prop('src', images[0].url);
$this.next('input').val(images[0].path)
$this.next('input')[0].dispatchEvent(new Event('input'));
}
}
});
},
}

11
resources/beike/admin/views/pages/design/builder/component/image_selector.blade.php
View File

@ -23,7 +23,14 @@
</el-tabs> </el-tabs>
<div class="i18n-inner" v-else> <div class="i18n-inner" v-else>
<img :src="type == 'image' ? thumbnail(value) : 'image/video.png'" @click="selectButtonClicked" style="max-width: 60px; cursor: pointer;border: 1px solid #eee;"> <div class="img">
<el-image :src="type == 'image' ? thumbnail(value) : 'image/video.png'" :id="'thumb-' + id" @click="selectButtonClicked">
<div slot="error" class="image-slot">
<i class="el-icon-picture-outline"></i>
</div>
</el-image>
</div>
<div class="btns"> <div class="btns">
<el-button type="primary" size="mini" plain @click="selectButtonClicked">选择</el-button> <el-button type="primary" size="mini" plain @click="selectButtonClicked">选择</el-button>
<el-button size="mini" plain style="margin-left: 4px;" @click="removeImage">删除</el-button> <el-button size="mini" plain style="margin-left: 4px;" @click="removeImage">删除</el-button>
@ -51,7 +58,7 @@
data: function () { data: function () {
return { return {
tabActiveId: $language_id, tabActiveId: $locale,
languages: $languages, languages: $languages,
internalValues: {}, internalValues: {},
id: 'image-selector-'+ randomString(4), id: 'image-selector-'+ randomString(4),

4
resources/beike/admin/views/pages/design/builder/component/link_selector.blade.php
View File

@ -288,8 +288,8 @@
}, },
updateData() { updateData() {
this.value.type = this.value.type || 'category'; this.value.type = this.value?.type || 'category';
this.value.link = this.value.link || ''; this.value.link = this.value?.link || '';
this.link = JSON.parse(JSON.stringify(this.value)); this.link = JSON.parse(JSON.stringify(this.value));
if (this.type) { if (this.type) {
this.types = this.types.filter(e => e.type == this.type); this.types = this.types.filter(e => e.type == this.type);

153
resources/beike/admin/views/pages/design/builder/component/rich_text_i18n.blade.php Normal file
View File

@ -0,0 +1,153 @@
<template id="rich-text-i18n-template">
<div class="rich-text-i18n-template">
<el-button style="width: 100%;" icon="el-icon-edit-outline" plain @click="richTextDialogChecked('open')">编辑内容</el-button>
<el-dialog
custom-class="rich-text-dialog"
:modal-append-to-body="false"
title="编辑"
:visible.sync="richTextDialog.show"
width="800px">
<el-tabs v-if="languages.length > 1" value="language-{{ locale() }}" :stretch="languages.length > 5 ? true : false" type="card">
<el-tab-pane v-for="(item, index) in languages" :key="index" :label="item.name" :name="'language-' + item.code">
<span slot="label" style="padding: 0 8px; font-size: 12px">@{{ item.name }}</span>
<div class="i18n-inner">
<textarea class="tinymce" :id="randomNumber + '-' +item.code" :data-code="item.code">@{{ richTextDialog.content[item.code] }}</textarea>
</div>
</el-tab-pane>
</el-tabs>
<div class="i18n-inner" v-else>
<textarea class="tinymce">@{{ value[languages[0].code] }}</textarea>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="richTextDialog.show = false">取 消</el-button>
<el-button type="primary" @click="richTextDialogSave">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script type="text/javascript">
Vue.component('rich-text-i18n', {
template: '#rich-text-i18n-template',
props: {
value: {
default: null
},
},
data: function () {
return {
richTextDialog: {
show: false,
content: {}
},
languages: $languages,
}
},
created: function () {
this.initInternalValues();
},
// 计算属性
computed: {
randomNumber() {
return (Math.random() * 1000000).toFixed(0);
}
},
methods: {
initInternalValues() {
let internalValues = {};
this.languages.forEach(e => {
Vue.set(internalValues, e.code, this.value[e.code] || '');
})
this.$emit('input', internalValues);
this.richTextDialog.content = JSON.parse(JSON.stringify(internalValues));
},
richTextDialogChecked(type) {
if (type == 'open') {
this.richTextDialog.show = true;
this.$nextTick(() => {
this.tinymceInit()
for (let key in this.value) {
tinymce.get(this.randomNumber + '-' + key).setContent(this.value[key]);
}
});
}
},
richTextDialogSave() {
this.$emit('input', this.richTextDialog.content);
this.richTextDialog.show = false;
},
tinymceInit() {
const self = this;
tinymce.init({
selector: '.tinymce',
language: '{{ locale() }}',
branding: false,
height: 300,
plugins: "link lists fullscreen table hr wordcount image imagetools code",
menubar: "",
toolbar: "undo redo | toolbarImageButton | bold italic underline strikethrough | forecolor backcolor | fontselect fontsizeselect | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | formatpainter removeformat | charmap emoticons | preview | template link anchor | code",
toolbar_items_size: 'small',
image_caption: true,
toolbar_mode: 'wrap',
font_formats:
"微软雅黑='Microsoft YaHei';黑体=黑体;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Georgia=georgia,palatino;Helvetica=helvetica;Times New Roman=times new roman,times;Verdana=verdana,geneva",
fontsize_formats: "10px 12px 14px 18px 24px 36px",
relative_urls : true,
// init_instance_callback: function (ed) {
// let code = ed.getElement().dataset.code
// ed.setContent(self.value[code])
// },
setup: function(ed) {
ed.ui.registry.addButton('toolbarImageButton', {
// text: '',
icon: 'image',
onAction:function() {
bk.fileManagerIframe(images => {
if (images.length) {
images.forEach(e => {
ed.insertContent(`<img src='/${e.path}' class="img-fluid" />`);
});
}
})
}
});
ed.on('change', function(e) {
let code = e.target.targetElm.dataset.code
self.richTextDialog.content[code] = ed.getContent()
});
}
});
},
}
});
</script>
<style>
.rich-text-i18n-template .el-dialog__wrapper {
z-index: 1000 !important;
}
.rich-text-i18n-template .v-modal {
z-index: 999 !important;
}
.rich-text-i18n-template .el-tabs__nav {
display: flex;
/* border-color: #ebecf5; */
}
.rich-text-i18n-template .i18n-inner {
margin-top: 20px;
}
</style>

140
resources/beike/admin/views/pages/design/builder/footer.blade.php
View File

@ -16,6 +16,7 @@
<script src="{{ asset('vendor/vue/2.6.14/vue.js') }}"></script> <script src="{{ asset('vendor/vue/2.6.14/vue.js') }}"></script>
<script src="{{ asset('vendor/vue/Sortable.min.js') }}"></script> <script src="{{ asset('vendor/vue/Sortable.min.js') }}"></script>
<script src="{{ asset('vendor/vue/vuedraggable.js') }}"></script> <script src="{{ asset('vendor/vue/vuedraggable.js') }}"></script>
<script src="{{ asset('vendor/tinymce/5.9.1/tinymce.min.js') }}"></script>
<script src="{{ asset('vendor/element-ui/2.15.6/js.js') }}"></script> <script src="{{ asset('vendor/element-ui/2.15.6/js.js') }}"></script>
<link rel="stylesheet" href="{{ asset('vendor/element-ui/2.15.6/css.css') }}"> <link rel="stylesheet" href="{{ asset('vendor/element-ui/2.15.6/css.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('/build/beike/admin/css/design.css') }}"> <link rel="stylesheet" type="text/css" href="{{ asset('/build/beike/admin/css/design.css') }}">
@ -31,7 +32,7 @@
</div> </div>
<div class="module-edit"> <div class="module-edit">
<el-collapse value="intro" @change="footerItemChange" accordion> <el-collapse value="intro" @change="footerItemChange" accordion>
<el-collapse-item title="服务图标" name="service_icon"> <el-collapse-item title="服务图标" name="services-wrap">
<div class="module-edit-group"> <div class="module-edit-group">
<div class="module-edit-group"> <div class="module-edit-group">
<div class="module-edit-title">启用</div> <div class="module-edit-title">启用</div>
@ -69,27 +70,102 @@
</draggable> </draggable>
</div> </div>
</el-collapse-item> </el-collapse-item>
<el-collapse-item title="Logo/介绍" name="footer-content-left">
<div class="module-edit-group">
<div class="module-edit-title">logo</div>
<pb-image-selector v-model="form.content.intro.logo" :is-language="false"></pb-image-selector>
</div>
<div class="module-edit-group">
<div class="module-edit-title">简介</div>
<rich-text-i18n v-model="form.content.intro.text"></rich-text-i18n>
</div>
</el-collapse-item>
@for ($i = 1; $i <= 3; $i++)
<el-collapse-item title="链接栏{{ $i }}" name="top_link{{ $i }}">
<div class="module-edit-group">
<div class="module-edit-title">配置标题</div>
<text-i18n v-model="form.content.link{{ $i }}.title"></text-i18n>
</div>
<div class="module-edit-group">
<div class="module-edit-title">链接</div>
<draggable
ghost-class="dragabble-ghost"
:list="form.content.link{{ $i }}.links"
:options="{animation: 330, handle: '.icon-rank'}">
<div v-for="(item, index) in form.content.link{{ $i }}.links" :key="index" class="footer-link-item">
<el-tooltip class="icon-rank" effect="dark" content="拖动排序" placement="left">
<i class="el-icon-rank"></i>
</el-tooltip>
<link-selector :show-text="true" v-model="form.content.link{{ $i }}.links[index]"></link-selector>
<div class="remove-item" @click="removeLink('link{{ $i }}', index)"><i class="iconfont">&#xe63a;</i></div>
</div>
</draggable>
</div>
<el-button class="add-item" size="mini" type="primary" plain @click="topLinkAddLinkButtonClicked({{ $i }})">添加链接</el-button>
</el-collapse-item>
@endfor
<el-collapse-item title="联系我们" name="top_contact">
<div class="module-edit-group">
<div class="module-edit-title">联系电话</div>
<el-input placeholder="联系电话" size="small" v-model="form.content.contact.telephone"></el-input>
</div>
<div class="module-edit-group">
<div class="module-edit-title">地址</div>
<el-input placeholder="地址" size="small" v-model="form.content.contact.address"></el-input>
</div>
<div class="module-edit-group">
<div class="module-edit-title">邮箱</div>
<el-input placeholder="邮箱" size="small" v-model="form.content.contact.email"></el-input>
</div>
</el-collapse-item>
<el-collapse-item title="版权设置" name="bottom_copyright">
<rich-text-i18n v-model="form.bottom.copyright"></rich-text-i18n>
</el-collapse-item>
<el-collapse-item title="更多链接" name="bottom_link">
<draggable
v-if="form.bottom.links.length"
ghost-class="dragabble-ghost"
:list="form.bottom.links"
:options="{animation: 330, handle: '.icon-rank'}"
>
<div v-for="(item, index) in form.bottom.links" :key="index" class="footer-link-item">
<el-tooltip class="icon-rank" effect="dark" content="拖动排序" placement="left">
<i class="el-icon-rank"></i>
</el-tooltip>
<link-selector :show-text="true" v-model="item.link"></link-selector>
<div class="remove-item" @click="removeBottomLink(index)"><i class="iconfont">&#xe63a;</i>
</div>
</div>
</draggable>
<div class="add-item">
<el-button type="primary" size="small" @click="addBottomLink" icon="el-icon-circle-plus-outline">添加链接</el-button>
</div>
</el-collapse-item>
</el-collapse> </el-collapse>
</div> </div>
</div> </div>
<div class="preview-iframe"> <div class="preview-iframe">
<iframe src="{{ url('/') }}?design=1" frameborder="0" id="preview-iframe" width="100%" height="100%"></iframe> <iframe src="{{ url('/') }}" frameborder="0" id="preview-iframe" width="100%" height="100%"></iframe>
</div> </div>
</div> </div>
<script> <script>
var $languages = @json($languages); var $languages = @json($languages);
var $language_id = '{{ locale() }}'; var $locale = '{{ locale() }}';
// function languagesFill(text) { function languagesFill(text) {
// var obj = {}; var obj = {};
// $languages.map(e => { $languages.map(e => {
// obj[e.code] = text obj[e.code] = text
// }) })
// return obj; return obj;
// } }
Vue.prototype.thumbnail = function thumbnail(image, width, height) { Vue.prototype.thumbnail = function thumbnail(image, width, height) {
if (!image) { if (!image) {
@ -112,13 +188,17 @@
app.design.ready = true; app.design.ready = true;
app.design.sidebar = true; app.design.sidebar = true;
// 页面滚动到最底部
$(previewWindow.document).ready(function() {
previewWindow.scrollTo(0, $(previewWindow.document).height());
});
}); });
</script> </script>
@include('admin::pages.design.builder.component.image_selector') @include('admin::pages.design.builder.component.image_selector')
@include('admin::pages.design.builder.component.link_selector') @include('admin::pages.design.builder.component.link_selector')
@include('admin::pages.design.builder.component.text_i18n') @include('admin::pages.design.builder.component.text_i18n')
@include('admin::pages.design.builder.component.rich_text_i18n')
<script> <script>
let app = new Vue({ let app = new Vue({
@ -152,43 +232,31 @@
}, },
footerItemChange(val) { footerItemChange(val) {
console.log(val)
// $footer = $("#preview-iframe").contents().find('footer'); // $footer = $("#preview-iframe").contents().find('footer');
// $footer.find("div").removeClass('footer-active'); // $footer.find("div").removeClass('footer-active');
// if (!val) return; // if (!val) return;
// $footer.find(`.${val}`).addClass('footer-active'); // $footer.find(`.${val}`).addClass('footer-active');
}, },
// addModuleButtonClicked(code) {
// const sourceModule = this.source.modules.find(e => e.code == code)
// const module_id = randomString(16)
// const _data = {
// code: code,
// content: sourceModule.make,
// module_id: module_id,
// name: sourceModule.name,
// }
// $http.post('design/builder/preview?design=1', _data, {hload: true}).then((res) => {
// $(previewWindow.document).find('.modules-box').append(res);
// this.form.modules.push(_data);
// this.design.editingModuleIndex = this.form.modules.length - 1;
// this.design.editType = 'module';
// setTimeout(() => {
// $(previewWindow.document).find("html, body").animate({
// scrollTop: $(previewWindow.document).find('#module-' + module_id).offset().top - 30
// }, 50);
// }, 200)
// })
// },
// 编辑模块 // 编辑模块
editModuleButtonClicked(index) { editModuleButtonClicked(index) {
this.design.editingModuleIndex = index; this.design.editingModuleIndex = index;
this.design.editType = 'module'; this.design.editType = 'module';
}, },
topLinkAddLinkButtonClicked(index) {
this.form.content['link' + index].links.push({type: '', value: '', text: {}});
},
removeLink(item, index) {
this.form.content[item].links.splice(index, 1);
},
addBottomLink: function () {
this.form.bottom.links.push({link: {type: '', value: '', text: {}}})
},
saveButtonClicked() { saveButtonClicked() {
$http.put('design/builder', this.form).then((res) => { $http.put('design/builder', this.form).then((res) => {
layer.msg(res.message) layer.msg(res.message)

2
resources/beike/admin/views/pages/pages/form.blade.php
View File

@ -27,7 +27,7 @@
<x-admin-form-input name="title[{{ $language['code'] }}]" title="信息标题" value="{{ old('title', '') }}" /> <x-admin-form-input name="title[{{ $language['code'] }}]" title="信息标题" value="{{ old('title', '') }}" />
<x-admin::form.row title="内容"> <x-admin::form.row title="内容">
<div class="w-max-1000"> <div class="w-max-1000">
<textarea name="content[{{ $language['code'] }}]" class="form-control tinymce"> <textarea name="content[{{ $language['code'] }}]" data-tinymce-height="600" class="form-control tinymce">
{{ old('content', '') }} {{ old('content', '') }}
</textarea> </textarea>
</div> </div>

2
resources/beike/shop/default/css/footer.scss vendored
View File

@ -5,7 +5,7 @@ footer {
background: #fafafa; background: #fafafa;
margin-top: 5rem; margin-top: 5rem;
.footer-top { .services-wrap {
padding: 2.2rem 0; padding: 2.2rem 0;
border-bottom: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4;

7
resources/beike/shop/default/js/common.js vendored
View File

@ -1,3 +1,10 @@
/*
* @copyright 2022 opencart.cn - All Rights Reserved.
* @link https://www.guangdawangluo.com
* @Author PS <pushuo@opencart.cn>
* @Date 2022-08-04 17:22:54
* @LastEditTime 2022-08-09 09:40:08
*/
export default { export default {
/** /**
* @description: 获取购物车数据 * @description: 获取购物车数据

6
themes/default/layout/footer.blade.php
View File

@ -1,6 +1,6 @@
<footer> <footer>
<div class="container"> <div class="services-wrap">
<div class="footer-top"> <div class="container">
<div class="row"> <div class="row">
@for ($i = 0; $i < 4; $i++) @for ($i = 0; $i < 4; $i++)
<div class="col-lg-3"> <div class="col-lg-3">
@ -15,6 +15,8 @@
@endfor @endfor
</div> </div>
</div> </div>
</div>
<div class="container">
<div class="footer-content"> <div class="footer-content">
<div class="row"> <div class="row">
<div class="col-12 col-md-4"> <div class="col-12 col-md-4">