62 lines
1.1 KiB
XML
62 lines
1.1 KiB
XML
<template>
|
||
<list-item type="device" class="card">
|
||
<div class="icon">
|
||
<image src="{{ devObj.icon}}" />
|
||
</div>
|
||
<text class="label">{{ devObj.name }}</text>
|
||
</list-item>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
|
||
props: ['devObj'],
|
||
|
||
data: {
|
||
defaultDevObj: { icon: "/assets/images/device-ipad.svg", name: "Easy’s iPad(当前设备)" },
|
||
},
|
||
|
||
onInit() {
|
||
if (!this.devObj) this.devObj = this.defaultDevObj
|
||
// console.log('card', this.devObj)
|
||
// console.log('card', 'name', this.devObj.name)
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="less">
|
||
@color: #3b4789;
|
||
|
||
.card {
|
||
border-color: @color;
|
||
border-radius: 16px;
|
||
border-width: 3px;
|
||
padding: 32px;
|
||
margin: 24px 0;
|
||
background-color: #FFFFFF;
|
||
/* justify-content: center;
|
||
align-items: center; */
|
||
|
||
.icon {
|
||
width: 120px;
|
||
height: 80px;
|
||
margin-right: 16px;
|
||
justify-content: center;
|
||
}
|
||
|
||
.label {
|
||
color: @color;
|
||
font-size: 36px;
|
||
}
|
||
}
|
||
/* .wrapper {
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
.title {
|
||
text-align: center;
|
||
color: #212121;
|
||
} */
|
||
</style>
|