ylrz_his_scrm_adminUI/src/views/components/his/userDetails.vue

<template>

<div style="background-color: #f0f2f5; padding-bottom: 20px; min-height: 100%; " >
<!--
  <div style="padding: 20px; background-color: #fff;">
    会员详情
  </div>
-->

  <div class="contentx" v-if="item!=null" >
    <div class="desct">
      基本信息
    </div>
        <el-descriptions title="" :column="3" border>

            <el-descriptions-item label="会员id" >
                <span v-if="item!=null">{{item.userId}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="用户昵称" >
                <span v-if="item!=null">{{item.nickName}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="用户头像" >
                 <el-image v-if="item.avatar!=null"
                          style="width: 50px;"
                          :src="item.avatar">
                      </el-image>
            </el-descriptions-item>
            <el-descriptions-item label="手机号码" >
                <span v-if="item!=null">{{item.phone}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="用户积分" >
                <span v-if="item!=null">{{item.integral}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="状态" >
             <span v-if="item!=null">
                   <dict-tag :options="userOptions" :value="item.status"/>
             </span>
            </el-descriptions-item>

            <el-descriptions-item label="上级昵称" >
                <span v-if="item!=null">{{item.tuiName}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="上级手机号码" >
                <span v-if="item!=null">{{item.tuiPhone}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="推广员关联时间" >
                <span v-if="item!=null">{{item.tuiTime}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="下级人数" >
                <span v-if="item!=null">{{item.tuiUserCount}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="最后一次登录ip" >
                <span v-if="item!=null">{{item.lastIp}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="余额" >
                <span v-if="item!=null">{{item.balance}}</span>
            </el-descriptions-item>
            <el-descriptions-item label="创建时间" >
                <span v-if="item!=null">{{item.createTime}}</span>
            </el-descriptions-item>

            <el-descriptions-item label="更新时间" >
                <span v-if="item!=null">{{item.updateTime}}</span>
            </el-descriptions-item>
        </el-descriptions>
</div>

    <div class="contentx" v-if="item!=null">
            <div class="desct"> 优惠劵领取信息</div>
            <el-tabs type="card" v-model="actName" @tab-click="handleClickX">
              <el-tab-pane label="全部" name="10"></el-tab-pane>
              <el-tab-pane v-for="(item,index) in couponStatusOptions" :label="item.dictLabel" :name="item.dictValue"></el-tab-pane>
            </el-tabs>
            <el-table v-loading="loading" :data="userCouponList">
              <el-table-column label="优惠劵标题" align="center" prop="title" />
              <el-table-column label="券号" align="center" prop="couponCode" />
              <el-table-column label="会员昵称" align="center" prop="nickName" />
              <el-table-column label="会员电话" align="center" prop="phone" />
              <el-table-column label="关联订单ID" align="center" prop="businessId" />
              <el-table-column label="订单类型" align="center" prop="businessType">
                <template slot-scope="scope">
                  <dict-tag :options="businessTypeOptions" :value="scope.row.businessType"/>
                </template>
              </el-table-column>
              <el-table-column label="状态" align="center" prop="status">
                <template slot-scope="scope">
                  <dict-tag :options="couponStatusOptions" :value="scope.row.status"/>
                </template>
              </el-table-column>
              <el-table-column label="领取时间" align="center" prop="createTime" width="180"/>
              <el-table-column label="使用时间" align="center" prop="useTime" width="180"/>
            </el-table>
            <pagination
              v-show="total>0"
              :total="total"
              :page.sync="queryParams.pageNum"
              :limit.sync="queryParams.pageSize"
              @pagination="getList"
            />
        </div>



  <div class="contentx" v-if="item!=null">
        <div class="desct">
          <span v-if="patientInfo">
            {{ patientInfo }}
          </span>
          <span v-else>
            患者信息
          </span>
        </div>
    <userPatietDetails  ref="userPatietDetail" />

  </div>

  <div class="contentx" v-if="item!=null" >
 <div class="desct">
      用户地址
 </div>
 <userAddDetails  ref="userAddDetail" />

   </div>
  <div class="contentx" v-if="item!=null" >
 <div class="desct">
      用户药品订单
 </div>
    <userStorerDetails  ref="userDetails" />
   </div>
<div class="contentx" v-if="item!=null" >
 <div class="desct">
      用户问诊订单
 </div>
    <userInquiryOrderDetails  ref="InquiryDetails" />
   </div>
 </div>
</template>



<script>
import { listPatient, getPatient, delPatient, addPatient, updatePatient, exportPatient ,getPatientByUserId} from "@/api/his/patient";
import { listUser, getUser, delUser, addUser, updateUser, exportUser ,getUserAddr} from "@/api/his/user";
import { getListUserCoupon } from "@/api/his/userCoupon";
import userStorerDetails from "../his/userStorerDetails.vue";
import userPatietDetails from "../his/userPatietDetails.vue";
import userInquiryOrderDetails from "../his/userInquiryOrderDetails.vue";
import userAddDetails from "../his/userAddDetails.vue";
  export default {
    name: "storedet",
    props:["data"],
     components: { userStorerDetails ,userInquiryOrderDetails,userPatietDetails,userAddDetails},
    data() {
      return {
        patientInfo: process.env.VUE_APP_PATIENT_INFO,
        addr:[],
        patient:[],
        userOptions: [],
        statusOptions: [],
        sexOptions: [],
        pOptions: [],
        item:null,
        total: 0,
        loading: true,
       // 会员优惠券表格数据
        userCouponList: [],
        queryParams: {
         pageNum: 1,
         pageSize: 10,
         userId: null,
         couponId: null,
        },
        actName:"10",
        businessTypeOptions:[],
        couponStatusOptions:[],
      }
    },
    created() {
      this.getDicts("sys_user_status").then(response => {
        this.userOptions = response.data;
      });
      this.getDicts("sys_company_status").then(response => {
        this.statusOptions = response.data;
      });
      this.getDicts("sys_patient_status").then(response => {
       this.pOptions = response.data;
      });
      this.getDicts("sys_patient_sex").then(response => {
         this.sexOptions = response.data;
       });
       this.getDicts("sys_coupon_business_type").then(response => {
         this.businessTypeOptions = response.data;
       });

       this.getDicts("sys_coupon_status").then(response => {
         this.couponStatusOptions = response.data;
       });
    },
    methods: {
      handleClickX(tab, event) {
       if(tab.name=="10"){
         this.queryParams.status=null;
       }else{
         this.queryParams.status=tab.name;
       }
          this.queryParams.pageNum = 1;
          this.getList();

      },
      getList() {
        this.loading = true;
        getListUserCoupon(this.queryParams).then(response => {
          this.userCouponList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },

      getDetails(orderId) {
          this.item=null;
          getUser(orderId).then(response => {
              this.item = response.data;
              setTimeout(() => {
                   this.$refs.userDetails.getUserDetails(orderId);
              }, 1);
              setTimeout(() => {
                   this.$refs.InquiryDetails.getInquiryDetails(orderId,1);
              }, 1);
              setTimeout(() => {
                   this.$refs.userPatietDetail.getPatList(orderId);
              }, 1);
              setTimeout(() => {
                   this.$refs.userAddDetail.getAddList(orderId);
              }, 1);

          });
          this.patient=null;
          getPatientByUserId(orderId).then(response => {
              this.patient = response.data;
          });
          getUserAddr(orderId).then(response => {
              this.addr = response.data;
          });
           this.queryParams.userId=orderId;
          this.getList();

      },
    }
  }
</script>
<style>

  .contentx{
      height: 100%;
      background-color: #fff;
      padding: 0px 20px 20px;


      margin: 20px;
  }
  .el-descriptions-item__label.is-bordered-label{
    font-weight: normal;
  }
  .el-descriptions-item__content {
    max-width: 150px;
    min-width: 100px;
  }
  .desct{
      padding-top: 20px;
      padding-bottom: 20px;
      color: #524b4a;
      font-weight: bold;
    }
</style>