41 lines
1.9 KiB
Vue
41 lines
1.9 KiB
Vue
<template>
|
|
<div>
|
|
<div style="display: flex;flex-wrap:wrap;">
|
|
<div class="device-item" v-for="item in dataList" :key="item.id" >
|
|
<div class="top">
|
|
<!-- <Icon type="ios-link" class="link" />-->
|
|
<div class="icon"><svg-icon :icon-class=" item.is_running ?'device_busy': 'device_free' " :class="! item.is_running ?'status-color2': 'status-color1'"/></div>
|
|
<span v-text="! item.is_running ? '空闲中': '占用中'" :class="! item.is_running ?'': 'status-color1'"></span>
|
|
<Icon type="ios-link" class="link" @click="copyLink(item)"/>
|
|
<Button size="small" type="primary" class="button" v-if="! item.is_running" @click="exec(item)">立即使用</Button>
|
|
<Button size="small" disabled class="button" style="background-color: #f90;color: white;border-color: #f90" v-else>运行中...</Button>
|
|
<!-- <Icon type="md-link" class="link"/>-->
|
|
|
|
</div>
|
|
|
|
<div>
|
|
<div class="title">{{item.name}}</div>
|
|
<div class="div-inline">
|
|
<div class="left">
|
|
<img src="https://inside.testin.cn/cfgfiles/images/model/1632454023561/f6aec1729de246f99e672b301dadca88.jpg"/>
|
|
<!-- <img :src="item.pic_url" />-->
|
|
</div>
|
|
|
|
<div class="device-info">
|
|
<div style="width:200px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; ">型号:{{item.model}}</div>
|
|
<div >版本号:{{item.version}}</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script src="./phoneCard.ts"></script>
|
|
|
|
<style scoped lang="less" src="./phoneCard.less"></style>
|