ylrz_his_scrm_companyUI/src/views/store/components/userDetailsTemp.vue

<template>
    <div style="background-color: #f0f2f5; padding-bottom: 20px; min-height: 100%; " >
      <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 class="contentx" v-if="item!=null" >
        <div class="desct">
              用户积分记录
        </div>
            <userIntegralDetails  ref="userIntegralDetail" />
      </div>


     </div>
    </template>
    
    
    
    <script>
    import { listPatient, getPatient, delPatient, addPatient, updatePatient, exportPatient ,getPatientByUserId} from "@/api/store/patient";
    import { listUser, getUser, delUser, addUser, updateUser, exportUser ,getUserAddr} from "@/api/store/user";
    import { getListUserCoupon } from "@/api/store/userCoupon";
    import userStorerDetails from "../components/userStorerDetails.vue";
    import userPatietDetails from "../components/userPatietDetails.vue";
    import userInquiryOrderDetails from "../components/userInquiryOrderDetails.vue";
    import userAddDetails from "../components/userAddDetails.vue";
    import userIntegralDetails from "../components/userIntegralDetails.vue";
      export default {
        name: "storedet",
        props:["data"],
         components: { userStorerDetails ,userInquiryOrderDetails,userPatietDetails,userAddDetails,userIntegralDetails},
        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);
                  setTimeout(() => {
                       this.$refs.userIntegralDetail.getIntegralLogs(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>