微信小程序支持页面可视化拖拽

application/api/controller/Design.php

+<?php
+// +----------------------------------------------------------------------
+// | ShopXO 国内领先企业级B2C免费开源电商系统
+// +----------------------------------------------------------------------
+// | Copyright (c) 2011~2099 http://shopxo.net All rights reserved.
+// +----------------------------------------------------------------------
+// | Licensed ( https://opensource.org/licenses/mit-license.php )
+// +----------------------------------------------------------------------
+// | Author: Devil
+// +----------------------------------------------------------------------
+namespace app\api\controller;
+
+use app\service\DesignService;
+use app\service\SystemBaseService;
+use app\layout\service\BaseLayout;
+
+/**
+ * 页面设计
+ * @author  Devil
+ * @blog    http://gong.gg/
+ * @version 1.0.0
+ * @date    2020-09-10
+ * @desc    description
+ */
+class Design extends Common
+{
+    /**
+     * 首页
+     * @author  Devil
+     * @blog    http://gong.gg/
+     * @version 1.0.0
+     * @date    2020-09-10
+     * @desc    description
+     */
+    public function Index()
+    {
+        $data = [];
+        $layout_data = [];
+        if(!empty($this->data_request['id']))
+        {
+            $data_params = [
+                'where' => [
+                    'id' => intval($this->data_request['id']),
+                ],
+                'm' => 0,
+                'n' => 1,
+            ];
+            $ret = DesignService::DesignList($data_params);
+            if($ret['code'] == 0 && !empty($ret['data']) && !empty($ret['data'][0]))
+            {
+                $data = $ret['data'][0];
+            }
+        }
+        if(!empty($data))
+        {
+            // 访问统计
+            DesignService::DesignAccessCountInc(['design_id'=>$data['id']]);
+
+            // 配置处理
+            $layout_data = BaseLayout::ConfigHandle($data['config']);
+
+            // 去除布局配置数据、避免很多配置数据造成带宽浪费
+            unset($data['config']);
+        }
+
+        // 返回数据
+        $result = [
+            'data'          => $data,
+            'layout_data'   => $layout_data,
+        ];
+        return SystemBaseService::DataReturn($result);
+    }
+}
+?>
\ No newline at end of file

sourcecode/weixin/default/app.js

@@ -74,7 +74,7 @@ App({
     // 请求地址
     request_url: "{{request_url}}",
      request_url: 'http://shopxo.com/',
-     request_url: 'https://dev.shopxo.net/',
+    // request_url: 'https://dev.shopxo.net/',
 
     // 基础信息
     application_title: "{{application_title}}",

sourcecode/weixin/default/app.json

@@ -27,6 +27,7 @@
     "pages/user-orderaftersale-detail/user-orderaftersale-detail",
     "pages/extraction-address/extraction-address",
     "pages/common/open-setting-location/open-setting-location",
+    "pages/design/design",
     "pages/plugins/coupon/index/index",
     "pages/plugins/coupon/user/user",
     "pages/plugins/membershiplevelvip/index/index",

sourcecode/weixin/default/pages/design/design.js

+const app = getApp();
+Page({
+  data: {
+    data_bottom_line_status: false,
+    data_list_loding_status: 1,
+    data_list_loding_msg: '',
+    params: null,
+    data: null,
+    layout_data: []
+  },
+
+  onLoad(params) {
+    params['id'] = 1;
+    this.setData({
+      params: params,
+    });
+  },
+
+  onShow() {
+    this.get_data();
+
+    // 显示分享菜单
+    app.show_share_menu();
+  },
+
+  // 获取数据
+  get_data() {
+    var self = this;
+    wx.request({
+      url: app.get_request_url("index", "design"),
+      method: "POST",
+      data: {"id": this.data.params.id || 0},
+      dataType: "json",
+      success: res => {
+        wx.stopPullDownRefresh();
+        if (res.data.code == 0) {
+          var data = res.data.data;
+          self.setData({
+            data: data.data || null,
+            layout_data: data.layout_data || [],
+            data_list_loding_msg: '',
+            data_list_loding_status: 0,
+            data_bottom_line_status: true,
+          });
+
+          // 标题名称
+          if((this.data.data || null) != null)
+          {
+            wx.setNavigationBarTitle({title: this.data.data.name});
+          }
+        } else {
+          self.setData({
+            data_bottom_line_status: false,
+            data_list_loding_status: 2,
+            data_list_loding_msg: res.data.msg,
+          });
+        }
+      },
+      fail: () => {
+        wx.stopPullDownRefresh();
+        self.setData({
+          data_bottom_line_status: false,
+          data_list_loding_status: 2,
+          data_list_loding_msg: '服务器请求出错',
+        });
+        app.showToast("服务器请求出错");
+      }
+    });
+  },
+
+  // 下拉刷新
+  onPullDownRefresh() {
+    this.get_data();
+  },
+
+  // 自定义分享
+  onShareAppMessage() {
+    var user_id = app.get_user_cache_info('id', 0) || 0;
+    return {
+      title: this.data.data.name || this.data.data.seo_title || app.data.application_title,
+      desc: this.data.data.seo_desc || app.data.application_describe,
+      path: '/pages/design/design?id='+this.data.data.id+'&referrer=' + user_id
+    };
+  },
+
+  // 分享朋友圈
+  onShareTimeline() {
+    var user_id = app.get_user_cache_info('id', 0) || 0;
+    return {
+      title: this.data.data.name || this.data.data.seo_title || app.data.application_title,
+      query: 'id='+this.data.data.id+'&referrer=' + user_id,
+      imageUrl: this.data.data.logo || ''
+    };
+  },
+});
\ No newline at end of file

sourcecode/weixin/default/pages/design/design.json

+{
+  "enablePullDownRefresh": true,
+  "usingComponents": {
+    "component-layout": "/components/layout/layout"
+  }
+}
\ No newline at end of file

sourcecode/weixin/default/pages/design/design.wxml

+<view wx:if="{{(data || null) != null}}">
+  <!-- 拖拽模式、引入拖拽数据模块 -->
+  <component-layout prop-data="{{layout_data}}"></component-layout>
+
+  <!-- 结尾 -->
+  <block wx:if="{{(data.is_footer || 0) == 1}}">
+    <import src="/pages/common/bottom_line.wxml" />
+    <template is="bottom_line" data="{{status: data_bottom_line_status}}"></template>
+  </block>
+</view>
+<view wx:else>
+  <import src="/pages/common/nodata.wxml" />
+  <template is="nodata" data="{{status: data_list_loding_status, msg: data_list_loding_msg}}"></template>
+</view>
\ No newline at end of file

sourcecode/weixin/default/pages/design/design.wxss

+/**
+ * 搜索
+ */
+.search {
+  background: #d2364c;
+  padding: 20rpx 10rpx 25rpx 20rpx;
+  position: relative;
+}
+.search input {
+  width: calc(100% - 328rpx);
+  padding-left: 15rpx;
+  font-size: 24rpx;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.search input,.search-btn button {
+  height: 52rpx;
+  line-height: 52rpx;
+  border-radius: 6rpx;
+}
+.search-btn {
+  position: absolute;
+  top: 20rpx;
+  right: 20rpx;
+}
+.search-btn button {
+  color: #fff;
+  width: 150rpx;
+  font-size: 24rpx;
+}
+.search-btn button:first-child {
+  background: #ff8c00;
+  border: 1px solid #ff8c00;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+.search-btn button:last-child {
+  background: #483E39;
+  border: 1px solid #483E39;
+  margin-left: 10rpx;
+}
+
+/**
+ * 头部
+ */
+.header {
+  padding: 20rpx 10rpx;
+}
+.shop-logo {
+  width: 280rpx;
+  margin-top: 5rpx;
+}
+.base-bottom image {
+  width: 28rpx;
+  height: 28rpx;
+  margin-right: 5rpx;
+}
+.header .base {
+  width: calc(100% - 320rpx);
+}
+.shop-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  line-height: 40rpx;
+}
+.shop-auth-icon {
+  background-color: #f4c985;
+  border: 1px solid #e7ba77;
+  border-radius: 6rpx;
+  color: #856651;
+  text-align: center;
+  padding: 2rpx 12rpx;
+  font-size: 24rpx;
+  font-weight: bold;
+  margin-right: 10rpx;
+}
+
+/**
+ * 客服
+ */
+.header-service {
+  width: 390rpx;
+  position: absolute;
+  left: 80rpx;
+  top: 210rpx;
+  z-index: 2;
+  font-size: 24rpx;
+  -webkit-box-shadow: 0 10px 10px rgb(0 0 0 / 30%);
+  box-shadow: 0 10px 10px rgb(0 0 0 / 30%);
+}
+.header-service image {
+  width: 260rpx;
+  height: 260rpx;
+}
+.header-service .item {
+  padding: 20rpx;
+}
+
+/**
+ * 滚动
+ */
+.nav-roll {
+  width: 100%;
+  white-space: nowrap;
+  box-sizing: border-box;
+}
+.nav-roll .item {
+  display: inline-block;
+}
+
+/**
+ * 导航
+ */
+.nav {
+  height: 70rpx;
+  border-bottom: 1px solid #d2364c;
+}
+.nav .nav-scroll {
+  float: right;
+  width: calc(100% - 230rpx);
+}
+.nav .item {
+  padding: 0 20rpx;
+  font-weight: bold;
+}
+.nav-shop-category {
+  padding-right: 38rpx !important;
+  background-size: 14px 14px;
+}
+
+/**
+ * 导航商品分类
+ */
+.nav-category {
+  background: #d2364c;
+  width: 220rpx;
+  z-index: 1;
+  position: absolute;
+  margin-top: 50rpx;
+  border: 1px solid #d2364c;
+  -webkit-box-shadow: 0 10px 10px rgb(0 0 0 / 30%);
+  box-shadow: 0 10px 10px rgb(0 0 0 / 30%);
+}
+.nav-category .category-scroll {
+  max-height: 600rpx;
+}
+.nav-category .item {
+  padding: 15rpx 20rpx;
+  display: block;
+  font-weight: inherit;
+  color: #f1f1f1;
+}
+.nav-category .item:not(:last-child) {
+  border-bottom: 1px solid #c72e44;
+}
\ No newline at end of file

sourcecode/weixin/default/pages/plugins/shop/design/design.js

@@ -27,7 +27,6 @@ Page({
   },
 
   onLoad(params) {
-    params['id'] = 1;
     this.setData({
       params: params,
       user: app.get_user_cache_info(),
@@ -207,7 +206,7 @@ Page({
     return {
       title: this.data.data.name || this.data.data.seo_title || app.data.application_title,
       query: 'id='+this.data.data.id+'&referrer=' + user_id,
-      imageUrl: ''
+      imageUrl: this.data.data.logo || ''
     };
   },
 });
\ No newline at end of file