| | |
| | | </span> |
| | | </div> |
| | | <div class="login-content"> |
| | | <!-- status-icon --> |
| | | <el-form |
| | | :model="phone" |
| | | status-icon |
| | | :rules="phoneCodeRule" |
| | | :validate-on-rule-change="false" |
| | | ref="phoneLogin" |
| | |
| | | <span slot="footer" class="dialog-footer"> |
| | | <!-- v-if="!snExpire && versionName != 'SmartAI正式版'" --> |
| | | <div class="btns"> |
| | | <el-button class="cancel" @click="activeDialog = false" |
| | | <el-button |
| | | v-if="!snExpire && versionName != 'SmartAI正式版'" |
| | | class="cancel" |
| | | @click="activeDialog = false" |
| | | >继续试用</el-button |
| | | > |
| | | <el-button |
| | |
| | | > |
| | | <div class="tip"> |
| | | <i class="el-icon-info"></i> |
| | | <span> 请检查订单信息,确认无误后再激活系统。 </span> |
| | | <span>请检查订单信息是否正确,确认无误后再激活系统</span> |
| | | </div> |
| | | |
| | | <div class="order-list" v-if="orderList.length"> |
| | |
| | | <span>{{ item.orderMoney }} 元</span> |
| | | </div> |
| | | <div class="desc"> |
| | | <div>产品名称:{{ prod.productName }}</div> |
| | | <div>产品类型:{{ prod.productTypeName }}</div> |
| | | <div>系统版本:{{ prod.edition }}</div> |
| | | <div>通道数量:{{ prod.ChCount }}</div> |
| | | <div>摄像机数量:{{ prod.cameraCount }}</div> |
| | |
| | | </div> |
| | | <div class="no-order-list" v-else>抱歉,没有查询到订单。</div> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="$emit('quit')">退出登录</el-button> |
| | | <el-button type="primary" @click="activeVerByOrd">激活</el-button> |
| | | <div class="btns"> |
| | | <el-button class="cancel" @click="$emit('quit')">退出登录</el-button> |
| | | <el-button class="ok" type="primary" @click="activeVerByOrd" |
| | | >激活</el-button |
| | | > |
| | | </div> |
| | | </span> |
| | | </el-dialog> |
| | | </div> |
| | |
| | | snExpire: false, |
| | | timer: null, |
| | | token: "", |
| | | orderList: [], |
| | | orderList: [ ], |
| | | phone: { |
| | | phoneNum: "", |
| | | verifyCode: "", |
| | |
| | | .el-dialog.my-account { |
| | | border-radius: 24px; |
| | | .btns { |
| | | display: flex; |
| | | display: flex; |
| | | justify-content: right; |
| | | .cancel { |
| | | width: 76px; |
| | | width: 76px; |
| | | height: 40px; |
| | | cursor: pointer; |
| | | border-radius: 20px; |
| | |
| | | font-size: 14px; |
| | | color: var(--colorCard); |
| | | border-color: var(--colorCard) !important; |
| | | margin-right: 12px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | |
| | | } |
| | | } |
| | | .el-dialog__footer { |
| | | padding: 30px ; |
| | | padding: 30px; |
| | | text-align: left; |
| | | box-sizing: border-box; |
| | | box-shadow: 0px -1px 0px rgb(0 0 0 / 8%);} |
| | | box-shadow: 0px -1px 0px rgb(0 0 0 / 8%); |
| | | } |
| | | .el-dialog__header { |
| | | padding: 14px 20px 13px; |
| | | text-align: center; |
| | |
| | | } |
| | | } |
| | | .el-dialog.my-order { |
| | | border-radius: 24px; |
| | | .el-dialog__body { |
| | | padding: 22px 20px; |
| | | } |
| | | .btns { |
| | | display: flex; |
| | | justify-content: right; |
| | | .cancel { |
| | | width: 140px; |
| | | |
| | | height: 40px; |
| | | cursor: pointer; |
| | | border-radius: 20px; |
| | | line-height: 40px; |
| | | font-size: 14px; |
| | | color: var(--colorCard); |
| | | border-color: var(--colorCard) !important; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | | .ok { |
| | | width: 140px; |
| | | height: 40px; |
| | | cursor: pointer; |
| | | border-radius: 20px; |
| | | background-color: var(--colorCard) !important; |
| | | border-color: var(--colorCard) !important; |
| | | color: #fff; |
| | | line-height: 40px; |
| | | font-size: 14px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | | } |
| | | .tip { |
| | | width: auto; |
| | | height: 40px; |
| | | background: rgb(145, 213, 255, 0.2); |
| | | box-sizing: border-box; |
| | | border: 1px rgb(145, 213, 255) solid; |
| | | display: -webkit-box; |
| | | display: -ms-flexbox; |
| | | display: flex; |
| | | padding: 0 10px; |
| | | border-radius: 5px; |
| | | color: #5f5f5f; |
| | | line-height: 20px; |
| | | font-weight: bold; |
| | | -ms-flex-align: center; |
| | | align-items: center; |
| | | justify-content: center; |
| | | i { |
| | | margin-right: 5px; |
| | | font-size: 16px; |
| | | font-size: 24px; |
| | | color: var(--colorCard); |
| | | } |
| | | span { |
| | |
| | | height: 550px; |
| | | overflow-y: auto; |
| | | .order-card { |
| | | height: 150px; |
| | | // height: 150px; |
| | | background: #fff; |
| | | margin-bottom: 15px; |
| | | |
| | |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-evenly; |
| | | height: 110px; |
| | | text-align: left; |
| | | box-sizing: border-box; |
| | | padding: 0 20px; |
| | | box-sizing: border-box; font-size: 13px; |
| | | |
| | | padding: 8px 20px; line-height: 20px; |
| | | } |
| | | } |
| | | } |