doum
4 天以前 22aaacd9e51da58ed10221639b6bd2fd9a13c6e5
admin/src/components/business/OperaMemberDetail.vue
@@ -1,65 +1,187 @@
<template>
  <GlobalAlertWindow
    :title="title"
    :visible.sync="visible"
    :confirm-working="isWorking"
    @confirm="confirm"
  <GlobalWindow
      :title="title"
      width="100%"
      :visible.sync="visible"
  >
    <el-descriptions direction="horizontal" labelClassName="descriptions-label" :column="1">
      <el-descriptions-item label="会员昵称">{{ form.nickName }}</el-descriptions-item>
      <el-descriptions-item label="真实姓名">{{ form.name }}</el-descriptions-item>
      <el-descriptions-item label="手机号">{{ form.phone }}</el-descriptions-item>
      <el-descriptions-item label="身份证号">{{ form.idcard }}</el-descriptions-item>
      <el-descriptions-item label="性别">{{ form.sex==0?'男':form.sex==1?'女':'未知' }}</el-descriptions-item>
      <el-descriptions-item label="地区">{{ form.addr }}</el-descriptions-item>
      <el-descriptions-item label="一句话介绍">{{ form.info }}</el-descriptions-item>
    </el-descriptions>
    <div slot="footer"></div>
  </GlobalAlertWindow>
    <div style="display: block">
      <div class="header">
        <div  class="header-b">用户信息</div>
        <div v-if="info.phone!=null && info.phone!=''" class="header-blue">已授权手机号</div>
      </div>
      <div class="info-item">
          <div class="info-item-a">微信openid:<span>{{info.openId}}</span></div>
          <div class="info-item-a">昵称:<span>{{info.nickname}}</span></div>
          <div class="info-item-a">客户姓名:<span>{{info.name}}</span></div>
      </div>
      <div class="info-item">
        <div class="info-item-a">授权手机号:<span>{{info.phone}}</span></div>
        <div class="info-item-a">关联经销商:<span>{{info.shopName}}</span> <span class="blue btn" @click="showChangeRecord">变更记录</span></div>
        <div class="info-item-a"></div>
      </div>
      <div class="info-item"></div>
    </div>
    <div style="display: block">
      <div class="header">
        <div  class="header-b">积分明细</div>
        <div v-if="info.phone!=null && info.phone!=''" class="header-btn">
          <el-button style="display: inline" type="primary" @click="changeIntegral">积分调整</el-button>
        </div>
      </div>
      <TableLayout >
        <!-- 表格和分页 -->
        <template v-slot:table-wrap>
            <div >
              <div style="float: left; margin-bottom: 20px;width:50%;">
                  <div class="info-item">
                    <div class="info-item-a">现有积分:<span>{{info.integral || 0}}</span></div>
                    <div class="info-item-a">累计积分:<span>{{info.totalIntegral||0}}</span></div>
                  </div>
              </div>
              <div style="float: right; margin-bottom: 20px;">
                <el-select  v-model="searchForm.type"  placeholder="全部"  clearable @change="search" style="width: 120px;" >
                  <el-option  :key="0" :value="0"  label="获得"  ></el-option>
                  <el-option   :key="1" :value="1" label="扣除"  ></el-option>
                </el-select>
                <el-button @click="search" type="点击刷新"  icon="el-icon-refresh"  style="margin-left: 10px;" ></el-button>
              </div>
            </div>
            <el-table
                v-loading="isWorking.search"
                :data="tableData.list"
                stripe
                border
                @selection-change="handleSelectionChange"
            >
              <el-table-column prop="type"  label="获得/扣除" align="center" min-width="150px">
                <template slot-scope="{row}">
                  {{ row.saleType == 1?'扣除':'获得'}}
                </template>
              </el-table-column>
              <el-table-column prop="num" label="数量" fixed align="center" min-width="100px">  </el-table-column>
              <el-table-column prop="strObjType" label="消费类型" align="center" min-width="100px"></el-table-column>
              <el-table-column prop="orderCode" label="关联订单" align="center" min-width="150px"></el-table-column>
              <el-table-column prop="remark" label="备注" align="center" min-width="200px"></el-table-column>
              <el-table-column prop="createDate" label="变动时间" align="center" min-width="200px"></el-table-column>
            </el-table>
            <pagination
                @size-change="handleSizeChange"
                @current-change="handlePageChange"
                :pagination="tableData.pagination"
            >
            </pagination>
        </template>
      </TableLayout>
    </div>
    <template  v-slot:footer>
      <el-button @click="visible=false">返回</el-button>
    </template>
    <OperaChangeShopRecordWindow ref="OperaChangeShopRecordWindow"/>
    <OperaChangeIntegralWindow ref="OperaChangeIntegralWindow" @success="successBiz"/>
  </GlobalWindow>
</template>
<script>
import BaseOpera from '@/components/base/BaseOpera'
import GlobalAlertWindow from '@/components/common/GlobalAlertWindow'
import GlobalWindow from '@/components/common/GlobalWindow'
import BaseTable from '@/components/base/BaseTable'
import TableLayout from '@/layouts/TableLayout'
import Pagination from '@/components/common/Pagination'
import OperaChangeShopRecordWindow from '@/components/business/OperaChangeShopRecordWindow'
import OperaChangeIntegralWindow from '@/components/business/OperaChangeIntegralWindow'
export default {
  name: 'OperaCouponWindow',
  extends: BaseOpera,
  components: { GlobalAlertWindow },
  name: 'OperaShopGoodsWindow',
  extends: BaseTable,
  components: { GlobalWindow, TableLayout, Pagination, OperaChangeShopRecordWindow,OperaChangeIntegralWindow },
  data () {
    return {
      getDate: [],
      // 表单数据
      form: {
        id: null,
        name: '',
        nickName: '',
        sex: '',
        addr: '',
        phone: '',
        idcard: '',
        info: ''
      },
      title: '',
      visible: false,
      tabelHeight: null,
      info: {},
      // 搜索
      searchForm: {
        memberId: '',
        userType: 0,
        type: null
      }
    }
  },
  created () {
    this.config({
      api: '/business/coupon',
      'field.id': 'id'
      module: '用户信息表',
      api: '/business/integral',
      'field.id': 'id',
      'field.main': 'id'
    })
  },
  methods: {
  },
    successBiz(){
      this.handlePageChange()
      this.$emit('success')
    },
    showChangeRecord () {
      if (this.info) {
        this.$refs.OperaChangeShopRecordWindow.open('客户经销商变更记录', this.info)
      }
    },
    changeIntegral () {
      if (this.info) {
        this.$refs.OperaChangeIntegralWindow.open('客户积分调整', this.info)
      }
    },
    open (title, goods) {
      this.title = title
      this.visible = true
      this.info = goods
      this.searchForm.memberId = goods.id
      this.search()
    },
    handleClick (val) {
    }
  }
}
</script>
<style scoped>
.table-pagination{
  position: fixed !important;
  bottom: 50px;
}
.header-b{
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
}
.header-blue{
  display: inline-block;
  font-size: 12px;
  border: 1px solid #216EEE;
  padding: 2px 10px;
  margin-left: 20px;
  color: #216EEE;
  border-radius: 5px ;
}
.header-btn{
  display: inline-block;
  border: none;
  padding: 2px 10px;
  margin-left: 20px;
}
.info-item{
  display: flex;
  width: 100%;
  margin: 15px;
}
.info-item-a{
  flex: 1;
  font-size: 14px;
<style lang="scss">
.descriptions-label {
  width: 80px;
  text-align: right !important;
  display: block !important;;
}
.info-item-a span{
  font-weight: 600;
}
.info-item-a  .btn{
  font-size: 12px !important;
  cursor: pointer !important;
}
</style>