107 lines
2.2 KiB
Vue
107 lines
2.2 KiB
Vue
<template>
|
|
<uni-card>
|
|
<!-- 标题 -->
|
|
<template v-slot:title>
|
|
<view class="card-title-wrapeer">
|
|
<!-- <text class="cardtitleri flex1">{{ item.bikeCode || "--" }}</text> -->
|
|
<uni-icons
|
|
@click="handleClick"
|
|
type="right"
|
|
size="20"
|
|
class="flex1"
|
|
style="text-align: right"
|
|
></uni-icons>
|
|
</view>
|
|
</template>
|
|
<!-- 内容 -->
|
|
<uni-forms label-width="80">
|
|
<uni-forms-item label="车辆编号:">
|
|
<view class="deepBlackBoldText">
|
|
<span> {{ item.bikeCode || "--" }}</span>
|
|
</view>
|
|
</uni-forms-item>
|
|
<!-- <uni-forms-item label="维修部位:">
|
|
<view class="deepBlackBoldText">
|
|
<span> {{ item.faultPart || "--" }} </span>
|
|
</view>
|
|
</uni-forms-item> -->
|
|
<!-- <uni-forms-item label="上报时间:">
|
|
<view class="deepBlackBoldText">
|
|
<span> {{ item.reportAt || "--" }} </span>
|
|
</view>
|
|
</uni-forms-item> -->
|
|
</uni-forms>
|
|
</uni-card>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted } from "vue";
|
|
|
|
const props = defineProps({
|
|
item: {
|
|
type: Object,
|
|
default: () => ({
|
|
title: "默认标题",
|
|
bikeCode: "123456",
|
|
maintainPart: "前轮",
|
|
bikeStatus: "待维修",
|
|
createdAt: "2023-10-01 12:00:00",
|
|
}),
|
|
},
|
|
});
|
|
const emits = defineEmits(["click"]);
|
|
|
|
const handleClick = () => {
|
|
emits("click", props.item);
|
|
};
|
|
</script>
|
|
|
|
<script>
|
|
export default {
|
|
options: { styleIsolation: "shared" },
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.card-title-wrapeer {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 5px 0px;
|
|
border-bottom: solid 1px #f1f1f1;
|
|
|
|
.flex1 {
|
|
flex: 1;
|
|
}
|
|
|
|
.cardtitleri {
|
|
font-size: 15px;
|
|
color: #3a3a3a;
|
|
padding: 5px;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
.deepBlackBoldText {
|
|
font-weight: bold;
|
|
}
|
|
|
|
:deep(.uni-forms .uni-forms-item__content) {
|
|
position: relative;
|
|
font-size: 14px;
|
|
flex: 1;
|
|
box-sizing: border-box;
|
|
line-height: 15px;
|
|
vertical-align: middle;
|
|
flex-direction: row;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
:deep(.uni-forms .uni-forms-item) {
|
|
position: relative;
|
|
display: flex;
|
|
margin-bottom: 2px !important;
|
|
flex-direction: row;
|
|
}
|
|
</style>
|