template里面要做数据渲染,但是数据还没有出来

 <el-dialog title="企业详情" :visible.sync="showEditPayment" @close="closeDialog" v-if="detail">
      <el-tabs type="border-card">
        <el-tab-pane label="客户信息">
          <el-row>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">客户ID</div></el-col>
              <el-col :span="16">
                <div class="grid-content" >{{ detail.entId }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">客户名</div></el-col>
              <el-col :span="16">
                <div class="grid-content" >{{ detail.name }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">管理员</div></el-col>
              <el-col :span="16">
                <div class="grid-content" >{{ detail.contact }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">联系方式</div></el-col>
              <el-col :span="16">
                <div class="grid-content" >{{ detail.contactPhone }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">客户类型</div></el-col>
              <el-col :span="16">
                <div class="grid-content" >{{ detail.type === 'PERSON' ? '个人' : '企业'}}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">简介</div></el-col>
              <el-col :span="16">
                <div class="grid-content" >{{ detail.intro }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">认证状态</div></el-col>
              <el-col :span="16">
                <div class="grid-content" >{{ verifyStatusMap[detail.verifyStatus] }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">认证备注</div></el-col>
              <el-col :span="16">  
                <div class="grid-content">{{ detail.verifyResult }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">申请认证时间</div></el-col>
              <el-col :span="16">
                <div class="grid-content">{{ detail.applyVerifyTime }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">最后更新时间</div></el-col>
              <el-col :span="16">
                <div class="grid-content">{{ detail.updatedAt }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">专属顾问</div></el-col>
              <el-col :span="16">
                <div class="grid-content" >{{ detail.adviserName }}</div>
              </el-col>
            </el-col>
            <el-col class="grid-item" :sm="24" :md="12">
              <el-col :span="8"><div class="grid-content grid-content-title">专属顾问号码</div></el-col>
              <el-col :span="16">
                <div class="grid-content" >{{ detail.adviserPhone }}</div>
              </el-col>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="账户信息">
          <div style="margin-bottom: 10px;">账户基本信息</div>
            <el-row v-if="account">
              <el-col class="grid-item" :sm="24" :md="12">
                <el-col :span="10"><div class="grid-content grid-content-title">乐币(枚)</div></el-col>
                <el-col :span="14">
                  <div class="grid-content">{{ account.integralBalance }}</div>
                </el-col>
              </el-col>
              <el-col class="grid-item" :sm="24" :md="12">
                <el-col :span="10"><div class="grid-content grid-content-title">余额(元)</div></el-col>
                <el-col :span="14">
                  <div class="grid-content">{{ account.balance | filterMoney }}</div>
                </el-col>
              </el-col>
            </el-row>
          <div style="margin-top:12px; margin-bottom: 10px;">账户变更记录</div>
          <el-table
            :data="recordList"
            border
            v-loading="recordLoading"
            element-loading-text="拼命加载中">
            <el-table-column
              min-width="130"
              align="center"
              label="编号"
              prop="acctRecordId">
            </el-table-column>
            <el-table-column
              min-width="120"
              align="center"
              label="时间"
              prop="createdAt">
              <template scope="scope">
                {{ filters.formatTime(scope.row.createdAt) }}
              </template>
            </el-table-column>
            <el-table-column
              min-width="120"
              align="center"
              label="数量"
              prop="amount">
              <template scope="scope">
                <span v-if="scope.row.subAcctType === 'BASE'">{{ scope.row.amount | filterMoney }}</span>
                <span v-else>{{ scope.row.amount }}</span>
              </template>
            </el-table-column>
            <el-table-column
              min-width="60"
              align="center"
              label="单位"
              prop="unit">
              <template scope="scope">
                <span v-if="scope.row.subAcctType === 'BASE'">元</span>
                <span v-if="scope.row.subAcctType === 'RED_PACKET'">个</span>
                <span v-if="scope.row.subAcctType === 'INTEGRAL_BASE'">枚</span>
              </template>
            </el-table-column>
            <el-table-column
              min-width="110"
              align="center"
              label="备注"
              prop="remark">
            </el-table-column>
            <el-table-column
              min-width="120"
              align="center"
              label="交易类型"
              prop="transactionName">
            </el-table-column>
          </el-table>
          <div class="block" style="float: right; margin: 10px;" v-if="recordList.length">
            <el-pagination
              layout="total, prev, pager, next, jumper"
              :current-page="recordPage"
              @current-change="handleRecordChange"
              :total="totalElements">
            </el-pagination>
          </div>
        </el-tab-pane>
      </el-tabs>
      <div slot="footer" class="dialog-footer">
        <el-button @click="showEditPayment = false">取 消</el-button>
        <el-button type="primary" @click="postEdit">确 定</el-button>
      </div>
    </el-dialog> 

在数据没有出来之前可以在 <el-dialog title="企业详情" :visible.sync="showEditPayment" @close="closeDialog" v-if="detail">加上一个v-if,这样就不会报detial undefine的情况

猜你喜欢

转载自www.cnblogs.com/antyhouse/p/10045373.html
今日推荐