update: 欢迎语预览

src/components/utils/preview-page.vue

+<template>
+  <div class="iphone">
+    <span class="pageTitle">{{ pageTitle }}</span>
+    <div class="infoList">
+      <div class="infoListBox">
+        <div class="textInfo"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {};
+  },
+  props: {
+    pageTitle: {
+      type: String,
+      default: ''
+    },
+    merchantName: {
+      type: String,
+      default: ''
+    },
+    merchantPhoneNumber: {
+      type: String,
+      default: ''
+    },
+    merchantLogo: {
+      type: String,
+      default: ''
+    },
+    pageBackgroudImg: {
+      type: String,
+      default: ''
+    },
+    guideComment: {
+      type: String,
+      default: ''
+    }
+  },
+  watch: {
+    mediaList(val) {
+      console.log(val);
+    }
+  }
+};
+</script>
+
+<style type="text/scss" lang="scss" scoped>
+.iphone {
+  border-radius: 4px;
+  position: relative;
+  margin-left: 117px;
+  display: inline-block;
+  font-size: 0;
+  line-height: 0;
+  background-image: url('../assets/iphone3.png');
+  background-repeat: no-repeat;
+  width: 240px;
+  min-height: 495px;
+  background-size: 240px auto;
+  color: #303133;
+  .infoList {
+    padding: 0 10px;
+    margin-top: 80px;
+    border-radius: 6px;
+    max-height: 360px;
+    overflow: auto;
+    .infoListBox {
+    }
+    .infoListBox + .infoListBox {
+      margin-top: 15px;
+    }
+  }
+}
+</style>

src/views/enterprise/salutatory.vue

@@ -21,7 +21,7 @@
           </div>
         </div>
         <div class="flex flex-space-between m-b-20 m-t-20">
-          <el-input placeholder="请输入标题" maxlength="50" v-model="title" class="w-264" style="width: 264px;" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearSearch"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input>
+          <el-input placeholder="请输入标题" maxlength="50" v-model="form.title" class="w-264" style="width: 264px;" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearSearch"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input>
           <el-button v-if="$getButtonLimit($buttonCode.addSalutatory)" :limit-code="$buttonCode.addSalutatory" type="primary" @click="changeRoute">新建欢迎语</el-button>
         </div>
         <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" :style="{ width: '100%' }" v-loading="loading">
@@ -80,23 +80,11 @@
             </template>
           </el-table-column>
         </el-table>
+        <div class="block common-wrap__page text-right m-t-24" v-if="tableData.length != 0">
+          <dm-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="form.pageNum" :page-sizes="[20, 40, 60, 80]" :page-size="form.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </dm-pagination>
+        </div>
       </div>
     </div>
-    <!-- <el-dialog title="加好友配置" :visible.sync="dialogVisible" width="590px" :before-close="handleClose">
-      <span class="tips">好办欢迎语支持文字、图片、视频、文件、链接</span>
-      <el-form label-width="100px" style="margin-top:20px">
-        <el-form-item label="加好友配置">
-          <div v-for="(val, key) in friendSettingTypeOption" :key="key">
-            <el-radio :label="val.label" v-model="type">{{ val.content }}</el-radio>
-            <el-tag size="small" v-show="val.label == 2">推荐使用</el-tag>
-          </div>
-        </el-form-item>
-      </el-form>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="dialogVisible = false">取 消</el-button>
-        <el-button type="primary" :loading="btnLoading" @click="saveSetting">确 定</el-button>
-      </span>
-    </el-dialog> -->
   </div>
 </template>
 <script>
@@ -106,17 +94,16 @@ export default {
   props: {},
   data() {
     return {
-      // friendSettingTypeOption: [
-      //   { label: 2, content: '发送【好办欢迎语】+【带导购参数的公众号二维码】' },
-      //   { label: 1, content: '发送【好办欢迎语】+【带导购参数的会员小程序卡片】' }
-      // ],
-      title: '',
+      form: {
+        title: '',
+        pageSize: 20,
+        pageNum: 1
+      },
+      total: 0,
       wxEnterpriseId: sessionStorage.getItem('userInfos') ? JSON.parse(sessionStorage.getItem('userInfos')).wxEnterpriseId : '',
-      // friendSettingType: '',
       type: 1,
       friendSettingId: '',
       btnLoading: false,
-      // dialogVisible: false,
       iconType: {
         1: 'iconwenjianleixingtupian',
         2: 'iconwenjianleixingshipin',
@@ -135,15 +122,6 @@ export default {
     that.getData();
     // this.getSetting();
   },
-  computed: {
-    // echoFriendData() {
-    //   let content = '';
-    //   if (this.friendSettingType) {
-    //     content = this.friendSettingTypeOption.filter(item => item.label == this.friendSettingType)[0].content;
-    //   }
-    //   return content;
-    // }
-  },
   methods: {
     /**
      * 输入
@@ -157,20 +135,6 @@ export default {
     clearSearch() {
       this.getData();
     },
-    // openDialog() {
-    //   this.dialogVisible = true;
-    // },
-    // getSetting() {
-    //   getRequest('/haoban-manage3-web/welcome/get/friend-setting', { wxEnterpriseId: this.wxEnterpriseId }).then(res => {
-    //     let resData = res.data;
-    //     if (resData.code == 0 && resData.result) {
-    //       const { friendSettingId, friendSettingType } = resData.result;
-    //       this.friendSettingId = friendSettingId;
-    //       this.type = friendSettingType ? friendSettingType : 1;
-    //       this.friendSettingType = friendSettingType;
-    //     }
-    //   });
-    // },
     saveSetting() {
       let data = {
         friendSettingId: this.friendSettingId,
@@ -226,11 +190,11 @@ export default {
      */
     getData() {
       this.loading = true;
-      postJsonRequest('/haoban-manage3-web/welcome/list', { title: this.title, wxEnterpriseId: this.wxEnterpriseId })
+      postJsonRequest('/haoban-manage3-web/welcome/list', { ...this.form, wxEnterpriseId: this.wxEnterpriseId })
         .then(res => {
           let resData = res.data;
           if (resData.code == 0 && resData.result) {
-            this.tableData = resData.result;
+            this.tableData = resData.result.list;
             this.tableData.forEach(item => {
               item.suitDepartmentName = [];
               if (item.suitDepartmentList && item.suitDepartmentList.length) {
@@ -239,6 +203,7 @@ export default {
                 });
               }
             });
+            this.total = resData.result.pageInfo.total;
             this.$nextTick(() => {
               const span = document.createElement('span');
               span.style.position = 'fixed';
@@ -264,6 +229,15 @@ export default {
         .finally(() => {
           this.loading = false;
         });
+    },
+    handleSizeChange(val) {
+      this.form.pageNum = 1;
+      this.form.pageSize = val;
+      this.getData(this.selectRadio);
+    },
+    handleCurrentChange(val) {
+      this.form.pageNum = val;
+      this.getData(this.selectRadio);
     }
   },
   watch: {},

src/views/enterprise/salutatorySet.vue

@@ -174,7 +174,7 @@ import { emojiArr } from '@/utils/emoji';
 import multUpload from '@/components/mult-upload-img.vue';
 import singleUpload from '@/components/single-upload.vue';
 import iphone2 from '@/assets/iphone2.png';
-import preview from '@/components/salutatory.vue';
+import preview from '@/components/preview-welcome.vue';
 export default {
   props: {},
   data() {