增加插件

index.html

@@ -9,3 +9,5 @@
     <div id="app"></div>
   </body>
 </html>
+<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=OV7BZ-ZT3HP-6W3DE-LKHM3-RSYRV-ULFZV"></script>
+

src/assets/css/zkcss.css

@@ -49,3 +49,60 @@ input, textarea, select{
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
 }
+.zk_pic_box{
+    width: 70px;
+    height: 70px;
+    border: 1px solid #ccc;
+    cursor: pointer;
+    background-color: #fff;
+    background-size: contain;
+    background-position: center;
+    background-repeat: no-repeat;
+    position: relative;
+}
+.zk_pic_box .size-tip {
+    line-height: 1.35;
+    text-align: center;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-size: 12px;
+    color: #fff;
+    background: rgba(0, 0, 0, 0.2);
+    letter-spacing: -1px;
+}
+.zk_pic_box i {
+    font-size: 22px;
+    color: #909399;
+}
+.zk_pic_box .image-delete {
+    position: absolute;
+    top: -10px;
+    right: -10px;
+    padding: 5px;
+    visibility: hidden;
+    z-index: 1;
+}
+.zk_pic_box .image-delete i {
+    font-size: 12px;
+    color: #fff;
+}
+.zk_pic_box .image-delete {
+    position: absolute;
+    top: -10px;
+    right: -10px;
+    padding: 5px;
+    visibility: hidden;
+    z-index: 1;
+}
+.zk_pic_box .image-delete i {
+    font-size: 12px;
+    color: #fff;
+}
+.zk_pic_box:hover .image-delete{
+    visibility: visible;
+}
\ No newline at end of file

src/components/Ftemplate.vue

@@ -166,7 +166,7 @@
           </div>
         </div>
         <ul class="FsettingUU">
-          <li class="menu_item" :class="{'Fchecked':isChecked==1}"  @click="isChecked=1,CommonJump('wexinappconfig')">
+          <li class="menu_item" :class="{'Fchecked':isChecked==1}"  @click="isChecked=1,CommonJump('templateManage')">
               <i class="el-icon-menu"></i><span>模板管理</span>
           </li>
           <li class="menu_item" :class="{'Fchecked':isChecked==2}" @click="isChecked=2,CommonJump('wexinappmsg')">
@@ -236,7 +236,7 @@
     methods: {
     },
     mounted() {
-      this.CommonJump('templateManage');
+      // this.CommonJump('templateManage');
       this.Height = document.documentElement.clientHeight - 60;
       //监听浏览器窗口变化　
       window.onresize = () => {

src/components/common/commonMap.vue

+<template id="app-map">
+  <div class="app-map">
+    <el-form label-width="80px" size="small">
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="地址搜索">
+            <el-input placeholder="请输入具体地址" v-model="mapKeyword">
+              <el-button @keyup.enter.native="mapSearch" @click="mapSearch" slot="append" icon="el-icon-search">
+              </el-button>
+            </el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="地址">
+            <el-input disabled v-model="newAddress"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="纬度|经度">
+            <el-input disabled v-model="lat_long"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <div class="app-map" id="container" :style="style"></div>
+    <span style="height:30px;display:none" id="city"></span>
+    <div slot="footer" class="dialog-footer" style="text-align:right;margin-top:30px;">
+      <el-button type="primary" @click="confirm">确 定</el-button>
+    </div>
+  </div>
+</template>
+<script>
+  export default {
+    props: {
+      width: String,
+      height: String,
+      lat: String,
+      long: String,
+      address: {
+        type: String,
+        default: '',
+      },
+      title: String,
+    },
+    data() {
+      return {
+        longitude: '', // 经度(大)
+        latitude: '', // 纬度(小)
+        lat_long: '',
+        markers: [],
+        map: [],
+        searchService: {},
+        mapKeyword: '',
+        dialogVisible: false,
+        newAddress: '',
+        city: '',
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      // 初始化地图
+      initMap() {
+        let self = this;
+        let center = new qq.maps.LatLng(self.latitude, self.longitude); // 默认坐标
+        self.map = new qq.maps.Map(
+          document.getElementById("container"), {
+            center: center,
+            zoom: 13, // 缩放级别
+          }
+        );
+
+        let citylocation = new qq.maps.CityService({
+          map: self.map,
+          complete: function (results) {
+            self.city = results.detail.name;
+            self.map.setCenter(results.detail.latLng);
+            let marker = self.setMarker(results.detail.latLng);
+            self.markers.push(marker);
+          }
+        });
+
+        // 搜索服务 默认获取当前地址
+        if (!self.lat && !self.long) {
+          citylocation.searchLocalCity()
+        } else {
+          self.latitude = self.lat;
+          self.longitude = self.long;
+          self.lat_long = self.lat + ',' + self.long;
+          citylocation.searchCityByLatLng(new qq.maps.LatLng(self.latitude, self.longitude));
+        }
+
+        this.clickEvent(center);
+        this.initSearch();
+      },
+      // 地图点击事件
+      clickEvent(center) {
+        let self = this;
+        let listener = qq.maps.event.addListener(this.map, 'click', function (event) {
+          self.longitude = event.latLng.getLng().toFixed(6);
+          self.latitude = event.latLng.getLat().toFixed(6);
+          self.lat_long = self.latitude + ',' + self.longitude;
+
+          self.getAddressBylatLong();
+          let coord = new qq.maps.LatLng(self.latitude, self.longitude);
+          let marker = self.setMarker(coord);
+          self.markers.push(marker);
+        });
+      },
+      // 根据经纬度获取地址信息
+      getAddressBylatLong() {
+        let self = this;
+        // 根据经纬度查询城市信息
+        let geocoder = new qq.maps.Geocoder({
+          complete: function (result) {
+            self.newAddress = result.detail.address;
+          }
+        });
+        let coord = new qq.maps.LatLng(self.latitude, self.longitude);
+        geocoder.getAddress(coord);
+      },
+      // 添加标注
+      setMarker(coord) {
+        let self = this;
+        // 添加标注
+        let marker = new qq.maps.Marker({
+          map: self.map,
+          position: coord
+        });
+        //获取标记的点击事件
+        qq.maps.event.addListener(marker, 'click', function (event) {
+          self.longitude = event.latLng.getLng().toFixed(6);
+          self.latitude = event.latLng.getLat().toFixed(6);
+          self.lat_long = self.latitude + ',' + self.longitude;
+
+          self.getAddressBylatLong();
+        });
+
+        return marker;
+      },
+      // 清除地址坐标
+      clearOverLays() {
+        //清除地图上的marker
+        let overlay;
+        while (overlay = this.markers.pop()) {
+          overlay.setMap(null);
+        }
+      },
+      initSearch() {
+        let self = this;
+        let latlngBounds = new qq.maps.LatLngBounds();
+        //设置Poi检索服务，用于本地检索、周边检索
+        self.searchService = new qq.maps.SearchService({
+          //设置搜索范围为
+          location: self.city,
+          //设置动扩大检索区域。默认值true，会自动检索指定城市以外区域。
+          autoExtend: true,
+          //检索成功的回调函数
+          complete: function (results) {
+            //设置回调函数参数
+            let pois = results.detail.pois;
+            if (!pois) {
+              alert("输入详细地址搜索更准确");
+              return false;
+            }
+            for (let i = 0, l = pois.length; i < l; i++) {
+              let poi = pois[i];
+              //扩展边界范围，用来包含搜索到的Poi点
+              latlngBounds.extend(poi.latLng);
+
+              let marker = self.setMarker(poi.latLng)
+              marker.setTitle(i + 1);
+              self.markers.push(marker);
+            }
+            //调整地图视野
+            self.map.fitBounds(latlngBounds);
+          },
+          //若服务请求失败，则运行以下函数
+          error: function () {
+            alert("出错了。");
+          }
+        });
+      },
+      // 地址搜索
+      mapSearch() {
+        this.clearOverLays();
+        this.searchService.search(this.mapKeyword);
+      },
+      confirm() {
+        this.$emit('map-submit', {
+          lat: this.latitude,
+          long: this.longitude,
+          address: this.newAddress
+        });
+      },
+    },
+    computed: {
+      style() {
+        let width = '100%';
+        let height = '400px';
+        if (this.width) {
+          width = this.width + (isNaN(this.width) ? '' : 'px');
+        }
+        if (this.height) {
+          height = this.height + (isNaN(this.height) ? '' : 'px');
+        }
+
+        return `width:${width};height:${height};`;
+      },
+    },
+    mounted() {
+        this.newAddress = this.address ? this.address : '';
+        this.initMap();
+    }
+  };
+
+</script>

src/components/sallCenter/plugin/check-in.vue

+<style>
+    .diy-component-preview .checkInhotspot {
+        border: 1px dashed #5CB3FD;
+        background-color: rgba(92, 179, 253, 0.2);
+        z-index: 1;
+        position: absolute;
+    }
+</style>
+<template>
+  <div :class="{'active':checkData.isCked}">
+    <div class="diy-component-options" v-if="checkData.isCked">
+      <el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
+      <el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
+        style="right: -25px; top: 0;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
+        style="right: -25px; top: 30px;"></el-button>
+    </div>
+    <div class="diy-component-preview">
+      <div style="height: 200px;padding: 0 50px;background-size: 100% 100%;position: relative;"
+        :style="'background-image: url('+getIconLink(data.backgroundPicUrl)+');'" flex="cross:center">
+        <div v-if="data.showText" :style="cTextStyle" style="width: 100%;">
+          <div style="margin-bottom: 10px;">今日签到可获得5积分</div>
+          <div>已连续签到10天</div>
+        </div>
+        <div v-if="data.hotspot" class="checkInhotspot" :style="cHotspotStyle"></div>
+      </div>
+    </div>
+    <div class="diy-component-edit" v-if="checkData.isCked">
+      <el-form label-width="100px" @submit.native.prevent>
+        <el-form-item label="背景图">
+          <div class="zk_pic_box" @click="choicImg=true" flex="main:center cross:center"
+            :style="{backgroundImage:'url(' + getIconLink(data.backgroundPicUrl) + ')'}">
+            <i v-if="data.backgroundPicUrl==''" class="el-icon-picture-outline"></i>
+            <div class="size-tip">50 × 50</div>
+            <el-button type="danger" v-if="data.backgroundPicUrl!=''" class="image-delete" size="mini"
+              icon="el-icon-close" @click.stop="data.backgroundPicUrl=''" circle></el-button>
+          </div>
+        </el-form-item>
+        <el-form-item label="点击热区">
+          <choiceArea :multiple="false" :pic-url="data.backgroundPicUrl" :hotspot-array="data.hotspot?[data.hotspot]:[]"
+                width="750px" height="200px" @confirm="selectHotspot" :is-link="false">
+            <el-button size="mini">设置热区</el-button>
+          </choiceArea>
+        </el-form-item>
+        <el-form-item label="显示文字">
+          <el-switch v-model="data.showText"></el-switch>
+        </el-form-item>
+        <el-form-item label="文字位置">
+          <el-radio v-model="data.textPosition" label="left">靠左</el-radio>
+          <el-radio v-model="data.textPosition" label="center">居中</el-radio>
+          <el-radio v-model="data.textPosition" label="right">靠右</el-radio>
+        </el-form-item>
+        <el-form-item label="文字颜色">
+          <el-color-picker v-model="data.textColor"></el-color-picker>
+        </el-form-item>
+      </el-form>
+    </div>
+    <!-- 选择图片文件 -->
+    <el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
+      <ChooseImg @SelectId="SelectId"></ChooseImg>
+    </el-dialog>
+  </div>
+</template>
+<script>
+  import ChooseImg from "@/components/global/ChooseImg.vue";
+  import choiceArea from "../../common/choiceArea.vue";
+
+  export default {
+    props: ["checkData", "index", "dataLeng"],
+    components: {
+      ChooseImg,
+      choiceArea
+    },
+    data() {
+      return {
+        choicImg: false,
+        data: this.checkData.data,
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      //向父组件传值 并调用排序
+      resetSord(IsUp) {
+        this.$emit('getSord', this.index, IsUp);
+      },
+      //点击触发父组件删除
+      delPlugin() {
+        this.$emit('comDelPlugin', this.index);
+      },
+      //选择图片
+      SelectId(msg) {
+        this.data.backgroundPicUrl = msg.url;
+        this.choicImg = false;
+      },
+      //判断是否包含http
+      getIconLink(url) {
+        let str = ''
+        if (url.indexOf('http') != -1) {
+          str = url
+        } else {
+          str = 'http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + url
+        }
+        return str;
+      },
+      // 热区选择(edit)
+      selectHotspot(e) {
+        if (e && e.length) {
+            this.data.hotspot = e[0];
+        }
+      },
+    },
+    computed: {
+      cTextStyle() {
+        return `color: ${this.data.textColor};text-align: ${this.data.textPosition};`;
+      },
+      cHotspotStyle() {
+        if (!this.data.hotspot)
+          return '';
+        return `width: ${this.data.hotspot.width}px;` +
+          `height: ${this.data.hotspot.height}px;` +
+          `left: ${this.data.hotspot.left}px;` +
+          `top: ${this.data.hotspot.top}px;`;
+      },
+    },
+    mounted() {
+
+    }
+  };
+
+</script>

src/components/sallCenter/plugin/copyright.vue

+<style>
+
+</style>
+<template>
+  <div :class="{'active':copyData.isCked}">
+    <div class="diy-component-options" v-if="copyData.isCked">
+      <el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
+      <el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
+        style="right: -25px; top: 0;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
+        style="right: -25px; top: 30px;"></el-button>
+    </div>
+    <div class="diy-component-preview">
+      <div style="padding: 28px 28px;" :style="cStyle" flex="main:center cross:center">
+        <div>
+          <div v-if="data.picUrl" style="text-align: center;">
+            <img :src="getIconLink(data.picUrl)" style="width: 160px;height: 50px;">
+          </div>
+          <div style="text-align: center;color: #333;">{{data.text}}</div>
+        </div>
+      </div>
+    </div>
+    <div class="diy-component-edit" v-if="copyData.isCked">
+      <el-form label-width="100px" @submit.native.prevent>
+        <el-form-item label="版权文字">
+          <el-input size="small" v-model="data.text"></el-input>
+        </el-form-item>
+        <el-form-item label="版权图标">
+          <div class="zk_pic_box" @click="choicImg=true" flex="main:center cross:center"
+            :style="{backgroundImage:'url(' + getIconLink(data.picUrl) + ')'}">
+            <i v-if="data.picUrl==''" class="el-icon-picture-outline"></i>
+            <div class="size-tip">50 × 50</div>
+            <el-button type="danger" v-if="data.picUrl!=''" class="image-delete" size="mini" icon="el-icon-close"
+              @click.stop="data.picUrl=''" circle></el-button>
+          </div>
+        </el-form-item>
+        <el-form-item class="chooseLink" label="版权链接">
+          <el-input v-model="data.link.url" placeholder="点击选择链接" :disabled="true" size="small">
+            <el-button slot="append" size="small" @click="isShowLink=true">选择链接</el-button>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="背景颜色">
+          <el-color-picker size="small" v-model="data.backgroundColor"></el-color-picker>
+          <el-input size="small" style="width: 80px;margin-right: 25px;" v-model="data.backgroundColor"></el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+    <!-- 选择图片文件 -->
+    <el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
+      <ChooseImg @SelectId="SelectId"></ChooseImg>
+    </el-dialog>
+    <el-dialog title="选择链接" :visible.sync="isShowLink" width="800px">
+      <chooseMeun ref="chooseMeun"></chooseMeun>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="small" @click="isShowLink=false">取 消</el-button>
+        <el-button size="small" type="danger" @click="getChoiceLink()">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+<script>
+  import ChooseImg from "@/components/global/ChooseImg.vue";
+  import chooseMeun from "../../common/chooseMeun.vue";
+  export default {
+    props: ["copyData", "index", "dataLeng"],
+    components: {
+      ChooseImg,
+      chooseMeun
+    },
+    data() {
+      return {
+        choicImg: false,
+        isShowLink: false,
+        data: this.copyData.data,
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      //向父组件传值 并调用排序
+      resetSord(IsUp) {
+        this.$emit('getSord', this.index, IsUp);
+      },
+      //点击触发父组件删除
+      delPlugin() {
+        this.$emit('comDelPlugin', this.index);
+      },
+      //选择图片
+      SelectId(msg) {
+        this.data.picUrl = msg.url;
+        this.choicImg = false;
+      },
+      //判断是否包含http
+      getIconLink(url) {
+        let str = ''
+        if (url.indexOf('http') != -1) {
+          str = url
+        } else {
+          str = 'http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + url
+        }
+        return str;
+      },
+      //获取选择链接
+      getChoiceLink() {
+        //调用子组件方法
+        var obj = this.$refs.chooseMeun.getChooseMenu();
+        this.data.link.url=obj.PageUrl
+        this.isShowLink = false;
+      },
+    },
+    computed: {
+      cStyle() {
+        if (this.data.backgroundColor) {
+          return `background-color: ${this.data.backgroundColor};`
+        } else {
+          return ``
+        }
+      },
+
+    },
+    mounted() {
+
+    }
+  };
+
+</script>

src/components/sallCenter/plugin/map.vue

+<style>
+  .my_map-container {
+    background-size: cover;
+    background-position: center;
+  }
+
+</style>
+<template>
+  <div :class="{'active':mapData.isCked}">
+    <div class="diy-component-options" v-if="mapData.isCked">
+      <el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
+      <el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
+        style="right: -25px; top: 0;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
+        style="right: -25px; top: 30px;"></el-button>
+    </div>
+    <div class="diy-component-preview">
+      <div :style="'padding-top: '+data.marginTop+'px; background-color: '+data.marginTopColor">
+        <div :style="cContainerStyle" class="my_map-container">
+          <div :style="cMapStyle" style="background-size: cover;background-position: center;"></div>
+        </div>
+      </div>
+    </div>
+    <div class="diy-component-edit" v-if="mapData.isCked">
+      <el-form label-width="100px" @submit.native.prevent>
+        <el-form-item label="地图">
+          <el-button type="primary" @click="isShowMap=true" size="small">地图选点</el-button>
+        </el-form-item>
+        <el-form-item label="经纬度">
+          <el-input size="small" v-model="data.location" placeholder="请使用地图选点选择经纬度"></el-input>
+        </el-form-item>
+        <el-form-item label="地图高度">
+          <el-slider v-model="data.height" :max="1500" show-input></el-slider>
+        </el-form-item>
+        <el-form-item label="上下边距">
+          <el-slider v-model="data.paddingY" :max="1500" show-input></el-slider>
+        </el-form-item>
+        <el-form-item label="左右边距">
+          <el-slider v-model="data.paddingX" :max="375" show-input></el-slider>
+        </el-form-item>
+        <el-form-item label="顶部外边距">
+          <el-slider v-model="data.marginTop" :max="1500" show-input></el-slider>
+        </el-form-item>
+        <el-form-item label="外边距颜色">
+          <el-color-picker v-model="data.marginTopColor"></el-color-picker>
+        </el-form-item>
+        <el-form-item label="背景颜色">
+          <el-color-picker v-model="data.backgroundColor"></el-color-picker>
+        </el-form-item>
+        <el-form-item label="背景图片">
+          <div class="zk_pic_box" @click="choicImg=true" flex="main:center cross:center"
+            :style="{backgroundImage:'url(' + getIconLink(data.backgroundPicUrl) + ')'}">
+            <i v-if="data.backgroundPicUrl==''" class="el-icon-picture-outline"></i>
+            <el-button type="danger" v-if="data.backgroundPicUrl!=''" class="image-delete" size="mini"
+              icon="el-icon-close" @click.stop="data.backgroundPicUrl=''" circle></el-button>
+          </div>
+        </el-form-item>
+      </el-form>
+    </div>
+    <!-- 选择图片文件 -->
+    <el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
+      <ChooseImg @SelectId="SelectId"></ChooseImg>
+    </el-dialog>
+    <!-- 地图选址 -->
+    <el-dialog title="地图展示" :visible.sync="isShowMap" width="960px">
+      <commonMap @map-submit="mapEvent"></commonMap>
+    </el-dialog>
+  </div>
+</template>
+<script>
+  import ChooseImg from "@/components/global/ChooseImg.vue";
+  import commonMap from "../../common/commonMap.vue";
+
+  export default {
+    props: ["mapData", "index", "dataLeng"],
+    components: {
+      ChooseImg,
+      commonMap
+    },
+    data() {
+      return {
+        choicImg: false,
+        isShowMap: false,
+        mapDemoPic: 'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/map-demo.png',
+        data: this.mapData.data,
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      //向父组件传值 并调用排序
+      resetSord(IsUp) {
+        this.$emit('getSord', this.index, IsUp);
+      },
+      //点击触发父组件删除
+      delPlugin() {
+        this.$emit('comDelPlugin', this.index);
+      },
+      //选择图片
+      SelectId(msg) {
+        this.data.backgroundPicUrl = msg.url;
+        this.choicImg = false;
+      },
+      //判断是否包含http
+      getIconLink(url) {
+        let str = ''
+        if (url.indexOf('http') != -1) {
+          str = url
+        } else {
+          str = 'http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + url
+        }
+        return str;
+      },
+      //得到地图信息
+      mapEvent(e) {
+        this.data.location = e.lat + ',' + e.long;
+        this.isShowMap=false;
+      },
+
+    },
+    computed: {
+      cContainerStyle() {
+        let style = `padding: ${this.data.paddingY}px ${this.data.paddingX}px;` +
+          `background-color: ${this.data.backgroundColor};` +
+          `background-image: url(${this.getIconLink(this.data.backgroundPicUrl)});`;
+        return style;
+      },
+      cMapStyle() {
+        let style = `height: ${this.data.height}px;` +
+          `background-image: url(${this.mapDemoPic});`;
+        return style;
+      },
+    },
+    mounted() {
+
+    }
+  };
+
+</script>

src/components/sallCenter/plugin/mp-link.vue

+<style>
+    .mp_lookbtn {
+        height: 52px;
+        line-height: 50px;
+        text-align: center;
+        width: 120px;
+        background-color: #fff;
+        border: 1px solid #308e20;
+        color: #308e20;
+        font-size: 24px;
+        border-radius: 8px;
+    }
+
+</style>
+<template>
+  <div :class="{'active':mpData.isCked}">
+    <div class="diy-component-options" v-if="mpData.isCked">
+      <el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
+      <el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
+        style="right: -25px; top: 0;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
+        style="right: -25px; top: 30px;"></el-button>
+    </div>
+    <div class="diy-component-preview">
+      <div style="background: #fff;border: 1px solid #e2e2e2;border-width: 1px 0;padding: 20px;">
+        <div style="color: #909399;font-size: 20px;margin-bottom: 10px;">小程序关联的公众号</div>
+        <div flex="box:justify cross:center">
+          <div>
+            <div style="height: 80px;width: 80px;background: #333;border-radius: 100px; margin-right: 20px;"></div>
+          </div>
+          <div>
+            <div style="font-size: 30px;">公众号名称</div>
+            <div style="font-size: 24px;color: #666;">公众号简介</div>
+          </div>
+          <div>
+            <div class="mp_lookbtn">查看</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="diy-component-edit" v-if="mpData.isCked">
+      <el-form label-width="100px" @submit.native.prevent>
+        <el-form-item label="组件位置">
+          <el-radio v-model="data.position" label="auto">自动</el-radio>
+          <el-radio v-model="data.position" label="top">悬浮顶部</el-radio>
+        </el-form-item>
+      </el-form>
+    </div>
+  </div>
+</template>
+<script>
+  import ChooseImg from "@/components/global/ChooseImg.vue";
+
+  export default {
+    props: ["mpData", "index", "dataLeng"],
+    components: {
+      ChooseImg
+    },
+    data() {
+      return {
+        data: this.mpData.data,
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      //向父组件传值 并调用排序
+      resetSord(IsUp) {
+        this.$emit('getSord', this.index, IsUp);
+      },
+      //点击触发父组件删除
+      delPlugin() {
+        this.$emit('comDelPlugin', this.index);
+      },
+    },
+    computed: {
+
+    },
+    mounted() {
+
+    }
+  };
+
+</script>

src/components/sallCenter/plugin/store.vue

+<style>
+  .myStore_list {
+    min-height: 100px;
+    background: #fff;
+  }
+
+  .myStore_item {
+    border-bottom: 1px solid #e2e2e2;
+    padding: 20px;
+    color: #606266;
+  }
+
+  .myEdit_item {
+    border: 1px solid #dcdfe6;
+    padding: 5px;
+    margin-bottom: 5px;
+    line-height: normal;
+    color: #606266;
+  }
+
+  .myEdit_item-options {
+    position: relative;
+  }
+
+  .myEdit_item-options .el-button {
+    height: 25px;
+    line-height: 25px;
+    width: 25px;
+    padding: 0;
+    text-align: center;
+    border: none;
+    border-radius: 0;
+    position: absolute;
+    margin-left: 0;
+  }
+
+  .store_pic_box {
+    width: 70px;
+    height: 70px;
+    border: 1px solid #ccc;
+    cursor: pointer;
+    background-color: #fff;
+    background-size: contain;
+    background-position: center;
+    background-repeat: no-repeat;
+    position: relative;
+  }
+
+  .store_size_tip {
+    line-height: 1.35;
+    text-align: center;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-size: 12px;
+    color: #fff;
+    background: rgba(0, 0, 0, 0.2);
+    letter-spacing: -1px;
+  }
+
+  .store_image_delete {
+    position: absolute;
+    top: -10px;
+    right: -10px;
+    padding: 5px!important;
+    visibility: hidden;
+    z-index: 1;
+  }
+
+  .store_pic_box:hover .store_image_delete {
+    visibility: visible;
+  }
+
+  .store_pic_box i {
+    font-size: 22px;
+    color: #909399;
+  }
+
+  .store_image_delete i {
+    font-size: 12px;
+    color: #fff;
+  }
+
+</style>
+<template>
+  <div :class="{'active':storeData.isCked}">
+    <div class="diy-component-options" v-if="storeData.isCked">
+      <el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
+      <el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
+        style="right: -25px; top: 0;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
+        style="right: -25px; top: 30px;"></el-button>
+    </div>
+    <div class="diy-component-preview">
+      <div class="myStore_list">
+        <div class="myStore_item" v-for="(item,index) in data.list" flex="box:last cross:center" :key="index">
+          <div flex="box:first cross:center">
+            <div>
+              <img :src="getIconLink(item.picUrl)" style="width: 120px;height: 120px;margin-right: 20px">
+            </div>
+            <div style="line-height: 42px">
+              <div v-if="data.showName">{{item.name}}</div>
+              <div v-if="data.showScore" flex>
+                <div>评分：</div>
+                <div>
+                  <img :src="getIconLink(data.scorePicUrl)" style="width: 20px;height: 20px;margin-right: 5px;">
+                  <img :src="getIconLink(data.scorePicUrl)" style="width: 20px;height: 20px;margin-right: 5px;">
+                  <img :src="getIconLink(data.scorePicUrl)" style="width: 20px;height: 20px;margin-right: 5px;">
+                  <img :src="getIconLink(data.scorePicUrl)" style="width: 20px;height: 20px;margin-right: 5px;">
+                  <img :src="getIconLink(data.scorePicUrl)" style="width: 20px;height: 20px;margin-right: 5px;">
+                </div>
+              </div>
+              <div v-if="data.showTel">
+                <span>电话: </span>
+                <span>{{item.mobile}}</span>
+              </div>
+            </div>
+          </div>
+          <div style="text-align: center">
+            <img :src="getIconLink(data.navPicUrl)" style="width: 50px;height: 50px;display: block;margin: 0 auto;">
+            <div>一键导航</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="diy-component-edit" v-if="storeData.isCked">
+      <el-form label-width="100px" @submit.native.prevent>
+        <el-form-item label="导航图标">
+          <div class="store_pic_box" @click="choicImg=true,checkIndex=1" flex="main:center cross:center"
+            :style="{backgroundImage:'url(' + getIconLink(data.navPicUrl) + ')'}">
+            <i v-if="data.navPicUrl==''" class="el-icon-picture-outline"></i>
+            <div class="store_size_tip">50 × 50</div>
+            <el-button type="danger" v-if="data.navPicUrl!=''" class="store_image_delete" size="mini"
+              icon="el-icon-close" @click.stop="data.navPicUrl=''" circle></el-button>
+          </div>
+        </el-form-item>
+        <el-form-item label="评分图标">
+          <div class="store_pic_box" @click="choicImg=true,checkIndex=2" flex="main:center cross:center"
+            :style="{backgroundImage:'url(' + getIconLink(data.scorePicUrl) + ')'}">
+            <i v-if="data.scorePicUrl==''" class="el-icon-picture-outline"></i>
+            <div class="store_size_tip">50 × 50</div>
+            <el-button type="danger" v-if="data.scorePicUrl!=''" class="store_image_delete" size="mini"
+              icon="el-icon-close" @click.stop="data.scorePicUrl=''" circle></el-button>
+          </div>
+        </el-form-item>
+        <el-form-item label="显示门店名称">
+          <el-switch v-model="data.showName"></el-switch>
+        </el-form-item>
+        <el-form-item label="显示评分">
+          <el-switch v-model="data.showScore"></el-switch>
+        </el-form-item>
+        <el-form-item label="显示电话">
+          <el-switch v-model="data.showTel"></el-switch>
+        </el-form-item>
+        <el-form-item label="门店列表">
+          <div v-for="(item,index) in data.list" class="myEdit_item" :key="index">
+            <div class="myEdit_item-options">
+              <el-button @click="deleteStore(index)" icon="el-icon-delete" type="primary"
+                style="top: -6px;right: -31px;"></el-button>
+            </div>
+            <div flex>
+              <div style="width: 40px;">ID:</div>
+              <div>{{item.id}}</div>
+            </div>
+            <div flex>
+              <div style="width: 40px;">名称:</div>
+              <div>{{item.name}}</div>
+            </div>
+            <div flex>
+              <div style="width: 40px;">电话:</div>
+              <div>{{item.mobile}}</div>
+            </div>
+          </div>
+          <el-button size="small" @click="storeDialogVisible = true">添加门店</el-button>
+          <!-- 添加门店未做 -->
+        </el-form-item>
+      </el-form>
+    </div>
+    <!-- 选择图片文件 -->
+    <el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
+      <ChooseImg @SelectId="SelectId"></ChooseImg>
+    </el-dialog>
+  </div>
+</template>
+<script>
+  import ChooseImg from "@/components/global/ChooseImg.vue";
+  export default {
+    props: ["storeData", "index", "dataLeng"],
+    components: {
+      ChooseImg
+    },
+    data() {
+      return {
+        choicImg: false,
+        storeDialogVisible: false,
+        data: this.storeData.data,
+        checkIndex: 0,
+
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      //向父组件传值 并调用排序
+      resetSord(IsUp) {
+        this.$emit('getSord', this.index, IsUp);
+      },
+      //点击触发父组件删除
+      delPlugin() {
+        this.$emit('comDelPlugin', this.index);
+      },
+      //选择图片
+      SelectId(msg) {
+        if (this.checkIndex == 1) {
+          this.data.navPicUrl = msg.url;
+        } else if (this.checkIndex == 2) {
+          this.data.scorePicUrl = msg.url;
+        }
+        this.choicImg = false;
+      },
+      //判断是否包含http
+      getIconLink(url) {
+        let str = ''
+        if (url.indexOf('http') != -1) {
+          str = url
+        } else {
+          str = 'http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + url
+        }
+        return str;
+      },
+      deleteStore(index) {
+        this.data.list.splice(index, 1);
+      },
+    },
+    computed: {
+
+    },
+    mounted() {
+
+    }
+  };
+
+</script>

src/components/sallCenter/plugin/user-info.vue

+<style>
+  .Useravatar-icon {
+    background: #E3E3E3;
+    border: 2px solid #fff;
+    width: 80px;
+    height: 80px;
+    border-radius: 9999px;
+    display: inline-block;
+  }
+
+</style>
+<template>
+  <div :class="{'active':userData.isCked}">
+    <div class="diy-component-options" v-if="userData.isCked">
+      <el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
+      <el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
+        style="right: -25px; top: 0;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
+        style="right: -25px; top: 30px;"></el-button>
+    </div>
+    <div class="diy-component-preview">
+      <div class="user-info-container" flex="cross:center"
+        style="height: 300px;background-color: #f5f7f9;background-size: cover;background-position: center;padding: 50px;"
+        :style="'background-image: url('+getIconLink(data.backgroundPicUrl)+');'">
+        <div style="width: 100%;" :style="cOutBoxStyle">
+          <div style="width: 100%;" :flex="cFlexDir">
+            <div :style="cAvatarBoxStyle">
+              <div class="Useravatar-icon"></div>
+            </div>
+            <div style="color: #fff;" :style="cNameBoxStyle">用户昵称</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="diy-component-edit" v-if="userData.isCked">
+      <el-form label-width="100px" @submit.native.prevent>
+        <el-form-item label="样式">
+          <el-radio v-model="data.style" :label="1">样式1</el-radio>
+          <el-radio v-model="data.style" :label="2">样式2</el-radio>
+          <el-radio v-model="data.style" :label="3">样式3</el-radio>
+        </el-form-item>
+        <el-form-item label="背景图片">
+          <div class="zk_pic_box" @click="choicImg=true" flex="main:center cross:center"
+            :style="{backgroundImage:'url(' + getIconLink(data.backgroundPicUrl) + ')'}">
+            <i v-if="data.backgroundPicUrl==''" class="el-icon-picture-outline"></i>
+            <el-button type="danger" v-if="data.backgroundPicUrl!=''" class="image-delete" size="mini"
+              icon="el-icon-close" @click.stop="data.backgroundPicUrl=''" circle></el-button>
+          </div>
+        </el-form-item>
+        <el-form-item label="背景颜色">
+          <el-color-picker v-model="data.backgroundColor"></el-color-picker>
+        </el-form-item>
+      </el-form>
+    </div>
+    <!-- 选择图片文件 -->
+    <el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
+      <ChooseImg @SelectId="SelectId"></ChooseImg>
+    </el-dialog>
+  </div>
+</template>
+<script>
+  import ChooseImg from "@/components/global/ChooseImg.vue";
+  export default {
+    props: ["userData", "index", "dataLeng"],
+    components: {
+      ChooseImg
+    },
+    data() {
+      return {
+        choicImg: false,
+        data: this.userData.data,
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      //向父组件传值 并调用排序
+      resetSord(IsUp) {
+        this.$emit('getSord', this.index, IsUp);
+      },
+      //点击触发父组件删除
+      delPlugin() {
+        this.$emit('comDelPlugin', this.index);
+      },
+      //选择图片
+      SelectId(msg) {
+        this.data.backgroundPicUrl = msg.url;
+        this.choicImg = false;
+      },
+      //判断是否包含http
+      getIconLink(url) {
+        let str = ''
+        if (url.indexOf('http') != -1) {
+          str = url
+        } else {
+          str = 'http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + url
+        }
+        return str;
+      },
+    },
+    computed: {
+      cFlexDir() {
+        let style = '';
+        if (this.data.style === 1) {
+          style += 'dir:left box:first cross:center';
+        }
+        if (this.data.style === 2) {
+          style += 'dir:top main:center';
+        }
+        if (this.data.style === 3) {
+          style += 'dir:left box:first cross:center';
+        }
+        return style;
+      },
+      cOutBoxStyle() {
+        let style = '';
+        if (this.data.style === 3) {
+          style += `padding: 30px 20px;border-radius: 10px; background-color: ${this.data.backgroundColor};`;
+        }
+        return style;
+      },
+      cAvatarBoxStyle() {
+        let style = '';
+        if (this.data.style === 1 || this.data.style === 3) {
+          style += 'padding: 0 20px;';
+        }
+        if (this.data.style === 2) {
+          style += 'text-align: center;';
+        }
+        return style;
+      },
+      cNameBoxStyle() {
+        let style = '';
+        if (this.data.style === 2) {
+          style += 'text-align: center;';
+        }
+        if (this.data.style === 3) {
+          style += 'color: #333333;';
+        }
+        return style;
+      },
+    },
+    mounted() {
+
+    }
+  };
+
+</script>

src/components/sallCenter/plugin/user-order.vue

+<style>
+  .diy-component-edit .myOrder_navlist {
+    flex-wrap: wrap;
+    width: 500px;
+    line-height: normal;
+  }
+
+  .diy-component-edit .myOrder_navitem {
+    width: 20%;
+    border: 1px solid #e2e2e2;
+    margin-left: -1px;
+    text-align: center;
+    font-size: 12px;
+    color: #333;
+    cursor: pointer;
+  }
+
+</style>
+<template>
+  <div :class="{'active':orderData.isCked}">
+    <div class="diy-component-options" v-if="orderData.isCked">
+      <el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
+      <el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
+        style="right: -25px; top: 0;"></el-button>
+      <el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
+        style="right: -25px; top: 30px;"></el-button>
+    </div>
+    <div class="diy-component-preview">
+      <div style="border: 1px solid #eee;border-width: 1px 0;" :style="cStyle">
+        <div style="padding: 20px 30px;border-bottom: 1px solid #e2e2e2;">我的订单</div>
+        <div flex="">
+          <div v-for="(item,index) in data.navs" flex="cross:center" style="width: 20%;" :key="index">
+            <div style="text-align: center;width: 100%;padding: 20px 0;">
+              <div>
+                <img :src="getIconLink(item.picUrl)" style="width: 50px;height: 50px;">
+              </div>
+              <div style="color: #333; font-size: 24px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+                {{item.text}}
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+    </div>
+    <div class="diy-component-edit" v-if="orderData.isCked">
+      <el-form @submit.native.prevent label-width="100px">
+        <el-form-item label="导航菜单">
+          <div class="myOrder_navlist" flex>
+            <div class="myOrder_navitem" v-for="(nav,subIndex) in data.navs" :key="subIndex"
+              @click="getImgChoice(subIndex)">
+              <div style="width: 100px;padding: 10px 0;">
+                <div><img :src="getIconLink(nav.picUrl)" style="width: 25px;height: 25px;"></div>
+                <div>{{nav.text}}</div>
+              </div>
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="背景颜色">
+          <el-color-picker size="small" v-model="data.backgroundColor"></el-color-picker>
+          <el-input size="small" style="width: 80px;margin-right: 25px;" v-model="data.backgroundColor"></el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+    <!-- 选择图片文件 -->
+    <el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
+      <ChooseImg @SelectId="SelectId"></ChooseImg>
+    </el-dialog>
+  </div>
+</template>
+<script>
+  import ChooseImg from "@/components/global/ChooseImg.vue";
+
+  export default {
+    props: ["orderData", "index", "dataLeng"],
+    components: {
+      ChooseImg
+    },
+    data() {
+      return {
+        choicImg: false,
+        data: this.orderData.data,
+        ckedIndex: -1,
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      //向父组件传值 并调用排序
+      resetSord(IsUp) {
+        this.$emit('getSord', this.index, IsUp);
+      },
+      //点击触发父组件删除
+      delPlugin() {
+        this.$emit('comDelPlugin', this.index);
+      },
+      //选择图片
+      SelectId(msg) {
+        this.data.navs[this.ckedIndex].picUrl = msg.url;
+        this.choicImg = false;
+      },
+      //判断是否包含http
+      getIconLink(url) {
+        let str = ''
+        if (url.indexOf('http') != -1) {
+          str = url
+        } else {
+          str = 'http://viitto-1301420277.cos.ap-chengdu.myqcloud.com' + url
+        }
+        return str;
+      },
+      //点击选图片
+      getImgChoice(index) {
+        this.choicImg = true;
+        this.ckedIndex = index;
+      }
+    },
+    computed: {
+      cStyle() {
+        if (this.data.backgroundColor) {
+          return `background: ${this.data.backgroundColor};`
+        } else {
+          return ``
+        }
+      },
+    },
+    mounted() {
+
+    }
+  };
+
+</script>

src/components/sallCenter/templateEdit.vue

@@ -220,6 +220,22 @@
                   :index="index" :dataLeng="dataList.length"></mylink>
                 <myvideo v-if="item.Id=='video'" :videoData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
                   :index="index" :dataLeng="dataList.length"></myvideo>
+                <mystore v-if="item.Id=='store'" :storeData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
+                  :index="index" :dataLeng="dataList.length"></mystore>
+                <copyright v-if="item.Id=='copyright'" :copyData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
+                  :index="index" :dataLeng="dataList.length"></copyright>
+                <checkIn v-if="item.Id=='check-in'" :checkData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
+                  :index="index" :dataLeng="dataList.length"></checkIn>
+                <userInfo v-if="item.Id=='user-info'" :userData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
+                  :index="index" :dataLeng="dataList.length"></userInfo>
+                <userOrder v-if="item.Id=='user-order'" :orderData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
+                  :index="index" :dataLeng="dataList.length"></userOrder>
+                <mymap v-if="item.Id=='map'" :mapData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
+                  :index="index" :dataLeng="dataList.length"></mymap>
+
+                <mpLink v-if="item.Id=='mp-link'" :mpData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
+                  :index="index" :dataLeng="dataList.length"></mpLink>
+
               </div>
             </div>
           </div>
@@ -240,6 +256,13 @@
   import notice from "../sallCenter/plugin/notice.vue"
   import mylink from "../sallCenter/plugin/link.vue"
   import myvideo from "../sallCenter/plugin/video.vue"
+  import mystore from "../sallCenter/plugin/store.vue"
+  import copyright from "../sallCenter/plugin/copyright.vue"
+  import checkIn from "../sallCenter/plugin/check-in.vue"
+  import mymap from "../sallCenter/plugin/map.vue"
+  import userInfo from "../sallCenter/plugin/user-info.vue"
+  import userOrder from "../sallCenter/plugin/user-order.vue"
+  import mpLink from "../sallCenter/plugin/mp-link.vue"
   export default {
     data() {
       return {
@@ -260,7 +283,14 @@
       goods,
       notice,
       mylink,
-      myvideo
+      myvideo,
+      mystore,
+      copyright,
+      checkIn,
+      userInfo,
+      userOrder,
+      mymap,
+      mpLink
     },
     methods: {
       //获取左侧菜单
@@ -397,8 +427,8 @@
               Id: 'video',
               isCked: false,
               data: {
-                pic_url: '',  //图片地址
-                url: ''  //视频地址
+                pic_url: '', //图片地址
+                url: '' //视频地址
               }
             }
             this.dataList.push(videoObj);
@@ -442,6 +472,153 @@
             }
             this.dataList.push(goodsObj);
             break;
+            //门店
+          case 'store':
+            let storeObj = {
+              Id: 'store',
+              isCked: false,
+              data: {
+                navPicUrl: 'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/nav-icon.png', //导航图标
+                scorePicUrl: 'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/score-icon.png', //评分图标
+                showName: true, //显示门店名称
+                showScore: true, //显示评分
+                showTel: true, //显示电话
+                list: [], //门店列表
+              }
+            }
+            this.dataList.push(storeObj);
+            break;
+            //版权
+          case 'copyright':
+            let copyObj = {
+              Id: 'copyright',
+              isCked: false,
+              data: {
+                picUrl: '',
+                text: '',
+                link: {
+                  url: '',
+                  openType: '',
+                  data: {},
+                },
+                backgroundColor: '#fff',
+              }
+            }
+            this.dataList.push(copyObj);
+            break;
+            //签到
+          case 'check-in':
+            let checkObj = {
+              Id: 'check-in',
+              isCked: false,
+              data: {
+                backgroundPicUrl: 'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/check-in-default-bg.png', //背景图
+                showText: true, //显示文字
+                textPosition: 'left', //文字位置
+                textColor: '#ffffff', //文本颜色
+                hotspot: null, //点击热区
+              }
+            }
+            this.dataList.push(checkObj);
+            break;
+            //用户信息
+          case 'user-info':
+            let userObj = {
+              Id: 'user-info',
+              isCked: false,
+              data: {
+                style: 1,
+                backgroundPicUrl: '',
+                backgroundColor: '#ffffff',
+              }
+            }
+            this.dataList.push(userObj);
+            break;
+            //订单入口
+          case 'user-order':
+            let orderObj = {
+              Id: 'user-order',
+              isCked: false,
+              data: {
+                navs: [{
+                    url: '',
+                    openType: 'navigate',
+                    picUrl:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/user-order-dfk.png',
+                    text: '待付款',
+                  },
+                  {
+                    url: '',
+                    openType: 'navigate',
+                    picUrl:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/user-order-dfh.png',
+                    text: '待发货',
+                  },
+                  {
+                    url: '',
+                    openType: 'navigate',
+                    picUrl:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/user-order-dsh.png',
+                    text: '待收货',
+                  },
+                  {
+                    url: '',
+                    openType: 'navigate',
+                    picUrl:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/user-order-ywc.png',
+                    text: '待评价',
+                  },
+                  {
+                    url: '',
+                    openType: 'navigate',
+                    picUrl:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/user-order-sh.png',
+                    text: '售后',
+                  },
+                ],
+                backgroundColor: '#ffffff',
+              }
+            }
+            this.dataList.push(orderObj);
+            break;
+
+            //地图
+          case 'map':
+            let mapObj = {
+              Id: 'map',
+              isCked: false,
+              data: {
+                location: '',
+                height: 400,
+                paddingY: 40,
+                paddingX: 40,
+                marginTop: 0,
+                marginTopColor: '#ffffff',
+                backgroundColor: '#ffffff',
+                backgroundPicUrl: ''
+              }
+            }
+            this.dataList.push(mapObj);
+            break;
+          //微信公众号
+          case 'mp-link':
+            let gzhObj = {
+              Id: 'mp-link',
+              isCked: false,
+              data: {
+                position: 'auto'
+              }
+            }
+            this.dataList.push(gzhObj);
+            break;
+          //自定义表单-未做
+          //图文详情
+          case 'image-text':
+            let gzhObj = {
+              Id: 'image-text',
+              isCked: false,
+              data: {
+                position: 'auto'
+              }
+            }
+            this.dataList.push(gzhObj);
+            break;
+
         }
       },
       //给子组件调用 重新排序上移下移