客户管理详情

src/components/Mall/Member/member-account.vue

@@ -0,0 +1,79 @@
+<template>
+  <div>
+    <div class="table">
+      <el-table ref="orderTable" v-loading="listLoading" :data="dataList" element-loading-text="Loading" border fit highlight-current-row stripe>
+        
+        <el-table-column align="center" label="收益金额" prop="amount"></el-table-column>
+        <el-table-column align="center" label="发生方式" prop="">
+          分享
+        </el-table-column>
+        <el-table-column align="center" label="发生时间" prop="createTime"></el-table-column>
+      </el-table>
+    </div>
+    <div class="pagination clearfix">
+      <div class="fr">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 50]"
+          :page-size="10"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="listTotal">
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {getMemberAccountList} from "@/api/member";
+
+export default {
+  name: 'MemberAccount',
+  componentName: 'MemberAccount',
+  props: ['user'],
+  data() {
+    return {
+      dataList: [], // 数据列表
+      listLoading: true, // 列表加载loading
+      currentPage: 1, // 当前页码
+      pageSize: 10, // 每页数量
+      listTotal: 0 // 列表总数
+    }
+  },
+  created() {
+    this.getAccountList();
+  },
+  methods: {
+    getAccountList() {
+      let params = {
+        userId: this.user.userId,
+        pageNum: this.currentPage,
+        pageSize: this.pageSize
+      }
+
+      getMemberAccountList(params).then(res => {
+        this.dataList = res.data.records
+        this.listTotal = res.data.total
+        this.listLoading = false
+      })
+    },
+    // 更改每页数量
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.currentPage = 1
+      this.getList()
+    },
+    // 更改当前页
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.getList()
+    },
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/Mall/Member/member-address.vue

@@ -0,0 +1,89 @@
+<template>
+  <div class="address-list">
+    <div class="table">
+      <el-table
+        ref="orderTable"
+        v-loading="listLoading"
+        :data="dataList"
+        element-loading-text="Loading"
+        border
+        fit
+        highlight-current-row stripe
+      >
+        <el-table-column align="center" label="收货人" prop="name"></el-table-column>
+        <el-table-column align="center" label="手机号" prop="phone"></el-table-column>
+        <el-table-column align="center" label="地址信息" prop="address" min-width="200"></el-table-column>
+        <el-table-column align="center" label="是否默认地址" prop="defaultAddr">
+          <template slot-scope="{ row }">
+            {{ row.defaultAddr ? '是' : '否' }}
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="pagination clearfix">
+      <div class="fr">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 50]"
+          :page-size="10"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="listTotal">
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {getMemberAddressList} from "@/api/member";
+
+export default {
+  name: 'MemberAddress',
+  componentName: 'MemberAddress',
+  props: ['user'],
+  data() {
+    return {
+      dataList: [], // 数据列表
+      listLoading: true, // 列表加载loading
+      currentPage: 1, // 当前页码
+      pageSize: 10, // 每页数量
+      listTotal: 0 // 列表总数
+    }
+  },
+  created() {
+    this.getAddressList()
+  },
+  methods: {
+    getAddressList() {
+      let params = {
+        userId: this.user.userId,
+        pageNum: this.currentPage,
+        pageSize: this.pageSize
+      }
+
+      getMemberAddressList(params).then(res => {
+        this.dataList = res.data.records
+        this.listTotal = res.data.total
+        this.listLoading = false
+      })
+    },
+    // 更改每页数量
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.currentPage = 1
+      this.getList()
+    },
+    // 更改当前页
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.getList()
+    },
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/Mall/Member/member-browse.vue

@@ -0,0 +1,98 @@
+<template>
+  <div>
+    <div class="table">
+      <el-table ref="orderTable" v-loading="listLoading" :data="dataList" element-loading-text="Loading" border fit highlight-current-row stripe>
+        <el-table-column align="center" label="商品信息" prop="goodsName" min-width="200">
+          <template slot-scope="scope">
+            <div class="goods-info">
+              <el-image style="width: 40px; height: 40px;" :src="scope.row.imgUrl" :preview-src-list="[scope.row.imgUrl]" fit="cover"></el-image>
+              <div class="name">{{scope.row.goodsName}}</div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="商品价格" prop="goodsPrice"></el-table-column>
+        <el-table-column align="center" label="商品状态" prop="defaultAddr">
+          <template slot-scope="scope">
+            {{ scope.row.status ? '上架' : '下架' }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="浏览时间" prop="createTime"></el-table-column>
+      </el-table>
+    </div>
+    <div class="pagination clearfix">
+      <div class="fr">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 50]"
+          :page-size="10"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="listTotal">
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {getMemberBrowseList} from "@/api/member";
+
+export default {
+  name: 'MemberBrowse',
+  componentName: 'MemberBrowse',
+  props: ['user'],
+  data() {
+    return {
+      dataList: [], // 数据列表
+      listLoading: true, // 列表加载loading
+      currentPage: 1, // 当前页码
+      pageSize: 10, // 每页数量
+      listTotal: 0 // 列表总数
+    }
+  },
+  created() {
+    this.getBrowseList();
+  },
+  methods: {
+    getBrowseList() {
+      let params = {
+        userId: this.user.userId,
+        pageNum: this.currentPage,
+        pageSize: this.pageSize
+      }
+
+      getMemberBrowseList(params).then(res => {
+        this.dataList = res.data.records
+        this.listTotal = res.data.total
+        this.listLoading = false
+      })
+    },
+    // 更改每页数量
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.currentPage = 1
+      this.getList()
+    },
+    // 更改当前页
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.getList()
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+  .goods-info {
+    display: flex;
+    align-items: center;
+    .el-image {
+      flex-shrink: 0;
+    }
+    .name {
+      margin-left: 8px;
+      text-align: left;
+    }
+  }
+</style>

src/components/Mall/Member/member-coupon.vue

@@ -0,0 +1,185 @@
+<template>
+  <div class="address-list">
+    <div class="table">
+      <el-table
+        ref="orderTable"
+        v-loading="listLoading"
+        :data="dataList"
+        element-loading-text="Loading"
+        border
+        fit
+        highlight-current-row stripe
+      >
+        <el-table-column align="center" label="券名称" prop="couponName"></el-table-column>
+        <el-table-column align="center" label="面额" prop="couponValue"></el-table-column>
+        <el-table-column align="center" label="券状态" prop="state">
+          <template slot-scope="{ row }">
+            {{ row.state ? '可用' : '不可用' }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="有效时间">
+          <template slot-scope="{ row }">
+            {{ formatDate(row) }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="分享状态" prop="transferType">
+          <template slot-scope="{ row }">
+            {{ row.transferType ? '可分享' : '不可分享' }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="剩余数量" prop="leftShareTimes"></el-table-column>
+        <el-table-column align="center" label="领取明细">
+          <template slot-scope="{ row }">
+            <el-button type="text" @click="openShareDetail(row.id)">查看明细</el-button>
+          </template>
+        </el-table-column>
+        <!-- <el-table-column align="center" label="使用时间" prop="useTime"></el-table-column> -->
+
+      </el-table>
+    </div>
+    <div class="pagination clearfix">
+      <div class="fr">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 50]"
+          :page-size="10"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="listTotal">
+        </el-pagination>
+      </div>
+    </div>
+
+    <!-- 分享详情 -->
+    <el-dialog title="分享详情" :visible.sync="shareDialog" :show-close="false" width="70%" :close-on-click-modal="false">
+      <div class="table" style="margin: 10px 0 20px;">
+        <el-table 
+          v-loading="shareTable_listLoading" 
+          :data="shareTable_dataList" 
+          element-loading-text="Loading" 
+          tooltip-effect="dark" 
+          style="width: 100%" 
+          max-height="270">
+          <el-table-column align="center" prop="userName" label="用户名称" min-width="120" show-overflow-tooltip></el-table-column>
+          <el-table-column align="center" prop="mobile" label="电话" min-width="120" show-overflow-tooltip></el-table-column>
+          <el-table-column align="center" prop="couponName" label="券名称" min-width="120"></el-table-column>
+          <el-table-column align="center" prop="userPhone" label="数量" min-width="120">
+            <template>
+              1
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="receiveTime" label="领取时间" min-width="160"></el-table-column>
+        </el-table>
+      </div>
+      <div class="pagination clearfix">
+        <div class="fr">
+          <el-pagination
+            @current-change="shareTableCurrentChange"
+            :current-page="shareTable_currentPage"
+            :page-size="shareTable_pageSize"
+            background
+            layout="prev, pager, next"
+            :total="shareTable_listTotal">
+          </el-pagination>
+        </div>
+      </div>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="shareDialog = false">关 闭</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {getMemberCouponList, getShareList} from "@/api/member";
+import {dateFormat} from "@/utils/util"
+
+export default {
+  name: 'MemberCoupon',
+  componentName: 'MemberCoupon',
+  props: ['user'],
+  data() {
+    return {
+      dataList: [], // 数据列表
+      listLoading: true, // 列表加载loading
+      currentPage: 1, // 当前页码
+      pageSize: 10, // 每页数量
+      listTotal: 0, // 列表总数
+
+      detailId: '',
+      shareDialog: false, // 分享详情 - 弹窗
+      shareTable_dataList: null, // 分享详情 - 列表数据
+      shareTable_listLoading: true, // 分享详情 - 列表加载loading
+      shareTable_currentPage: 1, // 分享详情 - 当前页码
+      shareTable_pageSize: 10, // 分享详情 - 每页数量
+      shareTable_listTotal: 0, // 分享详情 - 列表总数
+    }
+  },
+  created() {
+    this.getCouponList()
+  },
+  methods: {
+    getCouponList() {
+      let params = {
+        userId: this.user.userId,
+        pageNum: this.currentPage,
+        pageSize: this.pageSize
+      }
+
+      getMemberCouponList(params).then(res => {
+        this.dataList = res.data.records
+        this.listTotal = res.data.total
+        this.listLoading = false
+      })
+    },
+    // 更改每页数量
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.currentPage = 1
+      this.getCouponList()
+    },
+    // 更改当前页
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.getCouponList()
+    },
+    formatDate(row) {
+      return dateFormat('YYYY.mm.dd', new Date(row.activeStartTime)) + ' - ' + dateFormat('YYYY.mm.dd', new Date(row.activeEndTime))
+    },
+
+    // 分享详情 - 获取列表
+    getShareList() {
+      getShareList({
+        pageNo: this.shareTable_currentPage,
+        pageSize: this.shareTable_pageSize,
+        userCouponId: this.detailId,
+        // userId: this.user.userId,
+      }).then(res => {
+        this.shareTable_dataList = res.data.records;
+        this.shareTable_listTotal = res.data.total;
+        this.shareTable_listLoading = false;
+      })
+    },
+
+    // 分享详情 - 打开弹窗
+    openShareDetail(id) {
+      this.detailId = id;
+      this.shareDialog = true;
+      this.shareTable_currentPage = 1;
+      this.getShareList();
+    },
+
+    // 分享详情 - 更改列表当前页
+    shareTableCurrentChange(val) {
+      this.shareTable_currentPage = val;
+      this.getShareList();
+    },
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/Mall/Member/member-customer.vue

@@ -0,0 +1,81 @@
+<template>
+  <div class="address-list">
+    <div class="table">
+      <el-table ref="orderTable" v-loading="listLoading" :data="dataList" element-loading-text="Loading" border fit highlight-current-row stripe>
+        <el-table-column align="center" label="姓名" prop="nickName"></el-table-column>
+        <el-table-column align="center" label="手机号" prop="mobile"></el-table-column>
+        <el-table-column align="center" label="绑定时间" prop="createTime"></el-table-column>
+
+      </el-table>
+    </div>
+    <!-- <div class="pagination clearfix">
+      <div class="fr">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 50]"
+          :page-size="10"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="listTotal">
+        </el-pagination>
+      </div>
+    </div> -->
+  </div>
+</template>
+
+<script>
+import {getMemberCustomerList} from "@/api/member";
+import {dateFormat} from "@/utils/util"
+
+export default {
+  name: 'MemberCustomer',
+  componentName: 'MemberCustomer',
+  props: ['user'],
+  data() {
+    return {
+      dataList: [], // 数据列表
+      listLoading: true, // 列表加载loading
+      currentPage: 1, // 当前页码
+      pageSize: 10, // 每页数量
+      listTotal: 0 // 列表总数
+    }
+  },
+  created() {
+    this.getCustomerList();
+  },
+  methods: {
+    getCustomerList() {
+      let params = {
+        userId: this.user.userId,
+        // pageNum: this.currentPage,
+        // pageSize: this.pageSize
+      }
+
+      getMemberCustomerList(params).then(res => {
+        this.dataList = res.data
+        // this.listTotal = res.data.total
+        this.listLoading = false
+      })
+    },
+    // 更改每页数量
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.currentPage = 1
+      this.getList()
+    },
+    // 更改当前页
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.getList()
+    },
+    formatDate(row) {
+      return dateFormat('YYYY.mm.dd', new Date(row.activeStartTime)) + ' - ' + dateFormat('YYYY.mm.dd', new Date(row.activeEndTime))
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/Mall/Member/member-detail.vue

@@ -0,0 +1,198 @@
+<template>
+  <div class="detail-container">
+    <el-page-header @back="goBack" content="会员详情"></el-page-header>
+    <el-container>
+      <el-header height="100">
+        <div class="title">基础信息</div>
+        <el-divider></el-divider>
+        <el-row :gutter="20" class="member-info">
+          <el-col :xs="24" :sm="4" :md="3" :lg="2">
+            <el-avatar :size="80" :src="userDetail.avatar">
+              <img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"/>
+            </el-avatar>
+          </el-col>
+          <el-col :xs="24" :sm="20" :md="21" :lg="22">
+            <!-- 普通用户 -->
+            <el-row :gutter="20" v-if="userDetail.type !== 'SERVICE'">
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>昵称：</span><span>{{ userDetail.nickName }}</span><i class="el-icon-edit pointer" @click="editName()"></i></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>性别：</span><span>{{ userDetail.sex }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>微信手机号：</span><span>{{ userDetail.mobile }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>注册时间：</span><span>{{ userDetail.createTime }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>角色：</span><span>{{ userDetail.type | MEMBER_CURRENT_TYPE_FILTER }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>业务员：</span><span>{{ userDetail.serviceName ? userDetail.serviceName:'暂无' }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>业务员电话：</span><span>{{ userDetail.servicePhone ? userDetail.servicePhone:'暂无' }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div><el-button type="primary" size="small" @click="applyWorker">成为业务员</el-button></div></el-col>
+            </el-row>
+            <!-- 业务员 -->
+            <el-row :gutter="20" v-if="userDetail.type === 'SERVICE'">
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>昵称：</span><span>{{ userDetail.nickName }}</span><i class="el-icon-edit pointer" @click="editName()"></i></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>性别：</span><span>{{ userDetail.sex }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>微信手机号：</span><span>{{ userDetail.mobile }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>注册时间：</span><span>{{ userDetail.createTime }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>角色：</span><span>{{ userDetail.type | MEMBER_CURRENT_TYPE_FILTER }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>真实姓名：</span><span>{{ userDetail.workerName }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>手机号码：</span><span>{{ userDetail.workerPhone }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>职位：</span><span>{{ userDetail.position }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>收益：</span><span>{{ userDetail.totalAmount }}</span></div></el-col>
+              <el-col :xs="24" :sm="12" :md="6" :lg="5"><div class="item"><span>客户：</span><span>{{ userDetail.customerNums }}</span></div></el-col>
+            </el-row>
+          </el-col>
+          
+        </el-row>
+      </el-header>
+      <el-main>
+        <el-tabs v-model="activeName" @tab-click="handleClick">
+          <el-tab-pane label="账户明细" name="account" v-if="userDetail.type === 'SERVICE'" lazy>
+            <member-account :user="userDetail"/>
+          </el-tab-pane>
+          <el-tab-pane label="订单管理" name="order" lazy>
+            <member-order :user="userDetail"/>
+          </el-tab-pane>
+          <el-tab-pane label="会员地址" name="address" lazy>
+            <member-address :user="userDetail"/>
+          </el-tab-pane>
+          <el-tab-pane label="收藏记录" name="favorite" lazy>
+            <member-favorite :user="userDetail"/>
+          </el-tab-pane>
+          <el-tab-pane label="浏览记录" name="browse" lazy>
+            <member-browse :user="userDetail"/>
+          </el-tab-pane>
+          <el-tab-pane label="优惠券" name="coupon" lazy>
+            <member-coupon :user="userDetail"/>
+          </el-tab-pane>
+          <el-tab-pane label="企微客户" name="customer" v-if="userDetail.type === 'SERVICE'" lazy>
+            <member-customer :user="userDetail"/>
+          </el-tab-pane>
+        </el-tabs>
+      </el-main>
+    </el-container>
+  </div>
+</template>
+
+<script>
+import MemberAccount from "@/components/Mall/Member/member-account";
+import MemberOrder from "@/components/Mall/Member/member-order";
+import MemberAddress from "@/components/Mall/Member/member-address";
+import MemberFavorite from "@/components/Mall/Member/member-favorite";
+import MemberBrowse from "@/components/Mall/Member/member-browse";
+import MemberCoupon from "@/components/Mall/Member/member-coupon";
+import MemberCustomer from "@/components/Mall/Member/member-customer";
+import {getMemberDetail, applyWorker, editNickname} from "@/api/member";
+
+export default {
+  name: 'MemberDetail',
+  componentName: 'MemberDetail',
+  props: ['user'],
+  components: {
+    MemberAccount, MemberOrder, MemberAddress, MemberFavorite, MemberBrowse, MemberCoupon, MemberCustomer
+  },
+  data() {
+    return {
+      activeName: this.user.type === 'SERVICE' ? 'account' : 'order',
+      userDetail: {}
+    }
+  },
+  created() {
+    this.getMemberDetail(this.user.userId)
+  },
+  methods: {
+    // 返回列表
+    goBack() {
+      this.$emit('backListFromDetail')
+    },
+    // 切换显示
+    handleClick(tab, event) {
+      // console.log(tab, event);
+    },
+    // 获取会员详情
+    getMemberDetail(userId) {
+      getMemberDetail({ userId }).then(res => {
+        this.userDetail = res.data
+      })
+    },
+
+    // 成为业务员
+    applyWorker() {
+      this.$prompt('请输入企业微信手机号码', '成为业务员', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        inputPattern: /^1[3456789]\d{9}$/,
+        inputErrorMessage: '请输入正确的手机号码'
+      }).then(({ value }) => {
+        applyWorker({
+          personalPhone: this.userDetail.mobile,
+          workPhone: value,
+        }).then(res => {
+          this.getMemberDetail(this.user.userId);
+        })
+      }).catch(() => {
+          
+      });
+      
+    },
+
+    // 修改昵称
+    editName() {
+      this.$prompt('请输入会员昵称', '修改会员昵称', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        inputValue: this.userDetail.nickName,
+        inputValidator: function(value) {
+          if(!value) return '请输入会员昵称'
+        },
+      }).then(({ value }) => {
+        editNickname({
+          userId: this.user.userId,
+          newNickName: value,
+        }).then(res => {
+          this.getMemberDetail(this.user.userId);
+        })
+      }).catch(() => {
+          
+      });
+    },
+  },
+  beforeDestroy() {
+    console.log("执行销毁前")
+  }
+}
+</script>
+
+<style scoped lang="scss">
+  .detail-container {
+    width:100%;
+    height: 100%;
+    ::v-deep .el-container {
+      margin-top: 20px;
+    }
+    ::v-deep .el-header {
+      .title {
+        font-size: 16px;
+      }
+      .el-row {
+        //display: flex;
+        /* 实现垂直居底 */
+        //align-items: end;
+        /* 实现水平居中 */
+        //justify-content: center;
+        .el-col {
+          .item {
+            padding: 10px 0;
+            white-space:nowrap;
+          }
+        }
+      }
+    }
+  }
+  .pointer {
+    cursor: pointer;
+    color: #409EFF;
+    margin-left: 5px;
+  }
+</style>
+
+<style lang="scss">
+  .pagination {
+    margin-top: 30px;
+  }
+</style>

src/components/Mall/Member/member-favorite.vue

@@ -0,0 +1,98 @@
+<template>
+  <div class="address-list">
+    <div class="table">
+      <el-table ref="orderTable" v-loading="listLoading" :data="dataList" element-loading-text="Loading" border fit highlight-current-row stripe>
+        <el-table-column align="center" label="商品信息" prop="goodsName" min-width="200">
+          <template slot-scope="scope">
+            <div class="goods-info">
+              <el-image style="width: 40px; height: 40px;" :src="scope.row.imgUrl" :preview-src-list="[scope.row.imgUrl]" fit="cover"></el-image>
+              <div class="name">{{scope.row.goodsName}}</div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="商品价格" prop="goodsPrice"></el-table-column>
+        <el-table-column align="center" label="商品状态" prop="defaultAddr">
+          <template slot-scope="scope">
+            {{ scope.row.status ? '上架' : '下架' }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="收藏时间" prop="createTime"></el-table-column>
+      </el-table>
+    </div>
+    <div class="pagination clearfix">
+      <div class="fr">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 50]"
+          :page-size="10"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="listTotal">
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {getMemberFavoriteList} from "@/api/member";
+
+export default {
+  name: 'MemberFavorite',
+  componentName: 'MemberFavorite',
+  props: ['user'],
+  data() {
+    return {
+      dataList: [], // 数据列表
+      listLoading: true, // 列表加载loading
+      currentPage: 1, // 当前页码
+      pageSize: 10, // 每页数量
+      listTotal: 0 // 列表总数
+    }
+  },
+  created() {
+    this.getFavoriteList()
+  },
+  methods: {
+    getFavoriteList() {
+      let params = {
+        userId: this.user.userId,
+        pageNum: this.currentPage,
+        pageSize: this.pageSize
+      }
+
+      getMemberFavoriteList(params).then(res => {
+        this.dataList = res.data.records
+        this.listTotal = res.data.total
+        this.listLoading = false
+      })
+    },
+    // 更改每页数量
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.currentPage = 1
+      this.getList()
+    },
+    // 更改当前页
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.getList()
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+  .goods-info {
+    display: flex;
+    align-items: center;
+    .el-image {
+      flex-shrink: 0;
+    }
+    .name {
+      margin-left: 8px;
+      text-align: left;
+    }
+  }
+</style>

src/components/Mall/Member/member-order.vue

@@ -0,0 +1,106 @@
+<template>
+  <div class="order-list">
+    <div class="table">
+      <el-table
+        ref="orderTable"
+        v-loading="listLoading"
+        :data="dataList"
+        element-loading-text="Loading"
+      >
+        <el-table-column align="center" label="订单编号" prop="orderId" min-width="180"></el-table-column>
+        <el-table-column align="center" label="商品信息" prop="orderTitle" min-width="200" show-overflow-tooltip></el-table-column>
+        <el-table-column align="center" label="订单金额" prop="payAmount"></el-table-column>
+        <el-table-column align="center" label="订单状态" prop="orderStatus">
+          <template slot-scope="{ row }">
+            {{ row.orderStatus | ORDER_CURRENT_STATUS_FILTER }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="下单时间" prop="createTime" min-width="160"></el-table-column>
+        <el-table-column align="center" label="操作" fixed="right">
+          <template slot-scope="{row}">
+            <el-button type="primary" @click="goOrderDetail(row)" size="mini">详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="pagination clearfix">
+      <div class="fr">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 50]"
+          :page-size="10"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="listTotal">
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {getList} from "@/api/order";
+
+export default {
+  name: 'MemberOrder',
+  componentName: 'MemberOrder',
+  props: ['user'],
+  data() {
+    return {
+      dataList: [], // 数据列表
+      listLoading: true, // 列表加载loading
+      currentPage: 1, // 当前页码
+      pageSize: 10, // 每页数量
+      listTotal: 0 // 列表总数
+    }
+  },
+  created() {
+    let timer = setInterval(() => {
+      if(this.user.userId) {
+        this.getOrderList()
+        clearInterval(timer)
+      }
+    }, 100)
+  },
+  methods: {
+    getOrderList() {
+      console.log(this.user);
+      let params = {
+        userId: this.user.userId,
+        pageNum: this.currentPage,
+        pageSize: this.pageSize
+      }
+
+      getList(params).then(res => {
+        this.dataList = res.data.records
+        this.listTotal = res.data.total
+        this.listLoading = false
+      })
+    },
+    // 更改每页数量
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.currentPage = 1
+      this.getList()
+    },
+    // 更改当前页
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.getList()
+    },
+    goOrderDetail(row) {
+      this.$router.push({
+        path: '/order/detail',
+        query: {
+          orderId: row.orderId
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/setting/agreement/index.vue

@@ -51,6 +51,32 @@
         </el-row>
       </el-form-item>
     </el-form>
+		
+		<div class="title">服务协议</div>
+		<el-form ref="mainForm" label-width="80px" label-position="top">
+		  <el-form-item label="" prop="content3">
+		    <el-upload
+		      ref="imageListUpload3"
+		      class="avatar-uploader3"
+		      :action="baseURL + 'common/upload'"
+		      :headers="myHeaders"
+		      multiple
+		      name="file"
+		      :show-file-list="false"
+		      :on-success="uploadSuccess3"
+		      :on-error="uploadError3"
+		      :before-upload="beforeUpload3">
+		    </el-upload>
+		    <!--富文本编辑器组件-->
+		    <el-row v-loading="quillImgLoading3">
+		      <quill-editor
+		        v-model="mainForm.content3"
+		        ref="myQuillEditor3"
+		        :options="editorOption3">
+		      </quill-editor>
+		    </el-row>
+		  </el-form-item>
+		</el-form>
 
     <div class="page-footer">
       <div class="footer" :class="classObj">
@@ -142,6 +168,27 @@ export default {
         }
       },
       editorImages2: [],
+			
+	  quillImgLoading3: false, // 富文本上传图片loading
+	  editorOption3: { // 富文本配置
+	    placeholder: '请输入公共内容',
+	    theme: 'snow',
+	    modules: {
+	      toolbar: {
+	        container: toolbarOptions,
+	        handlers: {
+	          'image': function (value) {
+	            if (value) {
+	              document.querySelector('.avatar-uploader3 input').click()
+	            } else {
+	              this.quill.format('image', false);
+	            }
+	          }
+	        }
+	      }
+	    }
+	  },
+	  editorImages3: [],
 
       formLoading: false,
     }
@@ -169,6 +216,7 @@ export default {
         this.mainForm = {
           content1: res.data.userAgreementContent,
           content2: res.data.privacyStatementContent,
+		  content3: res.data.serviceContent,
         }
       })
     },
@@ -179,6 +227,7 @@ export default {
         companyWechatId: JSON.parse(localStorage.getItem("greemall_user")).companyWechatId,
         userAgreementContent: this.mainForm.content1,
         privacyStatementContent: this.mainForm.content2,
+		serviceContent: this.mainForm.content3,
       }).then(res => {
         this.formLoading = false;
         this.$successMsg('编辑成功');
@@ -269,6 +318,46 @@ export default {
       this.quillImgLoading2 = false;
       this.$errorMsg('图片插入失败');
     },
+	
+	// 富文本图片上传前
+	beforeUpload3() {
+	  this.quillImgLoading3 = true;
+	},
+	
+	// 富文本图片上传成功
+	uploadSuccess3(res, file, fileList) {
+	  console.log(fileList);
+	  fileList.forEach(item => {
+	    if(this.editorImages3.indexOf(item.response.data.url) < 0) {
+	      this.editorImages3.push(item.response.data.url);
+	    }
+	  })
+	  this.showImage3()
+	  this.quillImgLoading3 = false;
+	},
+	
+	showImage3() {
+	  console.log(this.editorImages3);
+	  let quill = this.$refs.myQuillEditor3.quill;
+	  this.editorImages3.forEach(item => {
+	    // 获取光标所在位置
+	    let length = quill.getSelection().index;
+	    // 插入图片  res.info为服务器返回的图片地址
+	    console.log(item);
+	    quill.insertEmbed(length, 'image', item);
+	    // this.$refs.imageListUpload2.clearFiles()
+	    // 调整光标到最后
+	    quill.setSelection(length + 1);
+	  })
+	  this.editorImages3 = [];
+	  this.$refs.imageListUpload3.clearFiles();
+	},
+	
+	// 富文本图片上传失败
+	uploadError3() {
+	  this.quillImgLoading3 = false;
+	  this.$errorMsg('图片插入失败');
+	},
   }
 }
 </script>

src/views/userManagement/customerManagement/index.vue

@@ -1,44 +1,49 @@
 <template>
-  <template-page ref="pageRef" :get-list="getList" :table-attributes="tableAttributes" :table-events="tableEvents" :operationColumnWidth="200"
-    :options-evens-group="optionsEvensGroup" :moreParameters="moreParameters" :column-parsing="columnParsing"
-    :operation="operation">
-	 <!-- :exportList="exportList" -->
-    <el-dialog title="" width="500px" custom-class="diy-dialog" append-to-body :modal="true" :visible.sync="formDialog"
-      :show-close="true" :close-on-click-modal="false" :modal-append-to-body="false" :before-close="formCancel">
-      <zj-form-container ref="formRef" :form-data="formData" :styleSwitch="false">
-        <zj-form-module :title="formDialogTitles[formDialogType]" label-width="100px" :showPackUp="false"
-          :form-data="formData" :form-items="formItems">
-        </zj-form-module>
-      </zj-form-container>
-      <div slot="footer" class="dialog-footer">
-        <el-button size="mini" @click="formCancel">取 消</el-button>
-        <el-button size="mini" @click="formConfirm" type="primary">确 定</el-button>
-      </div>
-    </el-dialog>
-	<!-- 入驻网点 -->
-	<el-dialog title="设为工程师" :visible.sync="dialogVisible" @close="websitList = []" width="40%" :close-on-click-modal="false" :modal-append-to-body="false">
-		<el-form ref="workerForm" :model="workerForm" label-width="110px" size="small" label-position="left">
-			<el-row :gutter="20">
-				<el-col :span="24">
-					<el-form-item label="入驻网点" :required="true">
-						<el-select v-model="workerForm.websitId" placeholder="请选择" style="width: 100%;">
-						    <el-option
-						      v-for="item in websitList"
-						      :key="item.websitId"
-						      :label="item.name"
-						      :value="item.websitId">
-						    </el-option>
-						  </el-select>
-					</el-form-item>
-				</el-col>
-			</el-row>
-		</el-form>
-		<div slot="footer" class="dialog-footer">
-			<el-button @click="dialogVisible = false">取 消</el-button>
-			<el-button type="primary" @click="memberInner()">确定</el-button>
+	<div>
+		<template-page v-if="!isShowMemberDetail" ref="pageRef" :get-list="getList" :table-attributes="tableAttributes" :table-events="tableEvents" :operationColumnWidth="200"
+		  :options-evens-group="optionsEvensGroup" :moreParameters="moreParameters" :column-parsing="columnParsing"
+		  :operation="operation">
+		 <!-- :exportList="exportList" -->
+		  <el-dialog title="" width="500px" custom-class="diy-dialog" append-to-body :modal="true" :visible.sync="formDialog"
+		    :show-close="true" :close-on-click-modal="false" :modal-append-to-body="false" :before-close="formCancel">
+		    <zj-form-container ref="formRef" :form-data="formData" :styleSwitch="false">
+		      <zj-form-module :title="formDialogTitles[formDialogType]" label-width="100px" :showPackUp="false"
+		        :form-data="formData" :form-items="formItems">
+		      </zj-form-module>
+		    </zj-form-container>
+		    <div slot="footer" class="dialog-footer">
+		      <el-button size="mini" @click="formCancel">取 消</el-button>
+		      <el-button size="mini" @click="formConfirm" type="primary">确 定</el-button>
+		    </div>
+		  </el-dialog>
+		<!-- 入驻网点 -->
+		<el-dialog title="设为工程师" :visible.sync="dialogVisible" @close="websitList = []" width="40%" :close-on-click-modal="false" :modal-append-to-body="false">
+			<el-form ref="workerForm" :model="workerForm" label-width="110px" size="small" label-position="left">
+				<el-row :gutter="20">
+					<el-col :span="24">
+						<el-form-item label="入驻网点" :required="true">
+							<el-select v-model="workerForm.websitId" placeholder="请选择" style="width: 100%;">
+							    <el-option
+							      v-for="item in websitList"
+							      :key="item.websitId"
+							      :label="item.name"
+							      :value="item.websitId">
+							    </el-option>
+							  </el-select>
+						</el-form-item>
+					</el-col>
+				</el-row>
+			</el-form>
+			<div slot="footer" class="dialog-footer">
+				<el-button @click="dialogVisible = false">取 消</el-button>
+				<el-button type="primary" @click="memberInner()">确定</el-button>
+			</div>
+		</el-dialog>
+		</template-page>
+		<div class="detail" v-if="isShowMemberDetail">
+			<MemberDetail :user="queryUser" @backListFromDetail="backListFromMemberDetail" />
 		</div>
-	</el-dialog>
-  </template-page>
+	</div>
 </template>
 
 <script>
@@ -46,8 +51,9 @@ import TemplatePage from '@/components/template/template-page-1.vue'
 import import_mixin from '@/components/template/import_mixin.js'
 import { required, mobileRequired, mobile } from '@/components/template/rules_verify.js'
 import { memberListPageV2,memberPageExport, memberAudit, memberInner, getWebsit } from "@/api/customerManagement";
+import MemberDetail from "@/components/Mall/Member/member-detail";
 export default {
-  components: { TemplatePage },
+  components: { TemplatePage, MemberDetail },
   mixins: [import_mixin],
   data() {
     return {
@@ -69,16 +75,17 @@ export default {
       formDialogTitles: [],
       formDialog: false,
 	  dialogVisible: false,
-      formData: {
-        storageName: '',
-        storageMobile: '',
-        storageAddress: '',
-      },
+	  	formData: {
+	  		storageName: '',
+	  		storageMobile: '',
+	  		storageAddress: '',
+	  	},
 	  websitList: [],
 	  workerForm: {
-	  		  websitId: '',
-	  		  userId: '',
-	  }
+	  			websitId: '',
+	  			userId: '',
+	  },
+	  queryUser: {}, // 查询
     }
   },
   computed: {
@@ -88,7 +95,10 @@ export default {
     },
     formItems() {
       
-    }
+    },
+	isShowMemberDetail() {
+	  return this.queryUser.hasOwnProperty('userId')
+	}
   },
   methods: {
     // 列表请求函数
@@ -103,12 +113,16 @@ export default {
     selectionChange(data) {
       this.recordSelected = data
     },
+		// 详情返回显示列表
+		backListFromMemberDetail() {
+		  this.queryUser = {}
+		},
     // 表格操作列
     operation(h, { row, index, column }) {
       return (
         <div class='operation-btns'>
 			<el-button type="text" onClick={() => {
-			  
+			  this.queryUser = row
 			}}>详情</el-button>
           {row.examineStatus != 'WAIT' ?<el-button type="text" onClick={() => {
           this.workerForm.userId = row.userId
@@ -180,4 +194,9 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+	.detail{
+		padding: 20px;
+		box-sizing: border-box;
+	}
+</style>