|
@@ -0,0 +1,171 @@
|
|
|
+<template>
|
|
|
+ <view class="pages flex flex_column">
|
|
|
+ <u-read-more toggle close-text="展开全部">
|
|
|
+ <view class="uuid-list">
|
|
|
+ <view v-for="item in detail.uuid" :key="item.code">
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="uuid-info">
|
|
|
+ <view>轮胎名称:{{item.name}}</view>
|
|
|
+ <view class="uuid">轮胎唯一码:{{item.code}}</view>
|
|
|
+ <view class="uuid">质保时间:2023-10-23至2026-10-23</view>
|
|
|
+ </view>
|
|
|
+ <view class="uuid-img">
|
|
|
+ <image style="width: 100%;height: 80px;background: #eaeaea;" :src="item.img"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="state" :class="item.state"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-read-more>
|
|
|
+ <view class="forms">
|
|
|
+ <view class="forms-tits">门店信息</view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">门店名称:</view>
|
|
|
+ <view class="inputs">赢信汽车贸易有限公司</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">汽配经销商:</view>
|
|
|
+ <view class="inputs">箭冠汽配东莞寮步店</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">姓名:</view>
|
|
|
+ <view class="inputs">高山</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">电话:</view>
|
|
|
+ <view class="inputs">15349286715</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="forms">
|
|
|
+ <view class="forms-tits">车辆信息</view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">车辆品牌:</view>
|
|
|
+ <view class="inputs">大众</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">车型:</view>
|
|
|
+ <view class="inputs">速腾1.6L</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">里程数:</view>
|
|
|
+ <view class="inputs">1600KM</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">车牌号:</view>
|
|
|
+ <view class="inputs">陕A53LL9</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">客户姓名:</view>
|
|
|
+ <view class="inputs">张生</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex align_center">
|
|
|
+ <view class="labes">手机号码:</view>
|
|
|
+ <view class="inputs">15349286715</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ detail: null
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ this.detail = this.$store.state.vuex_uuidTempData
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+.pages{
|
|
|
+ height: 100vh;
|
|
|
+ background: #f8f8f8;
|
|
|
+ padding-bottom: 6rem;
|
|
|
+ overflow: auto;
|
|
|
+ .uuid-list{
|
|
|
+ background: #fff;
|
|
|
+ text-indent: 0;
|
|
|
+ line-height: normal;
|
|
|
+ font-size: 28rpx;
|
|
|
+ > view{
|
|
|
+ justify-content: space-between;
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+ padding: 0.6rem 1rem;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .state{
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: 100%;
|
|
|
+ background-position: center center;
|
|
|
+ position: absolute;
|
|
|
+ width: 5rem;
|
|
|
+ height: 5rem;
|
|
|
+ z-index: 1000;
|
|
|
+ bottom: 0.5rem;
|
|
|
+ right: 1rem;
|
|
|
+ }
|
|
|
+ .inhand{
|
|
|
+ background-image: url(/pagesA/static/inhand.png);
|
|
|
+ }
|
|
|
+ .outof{
|
|
|
+ background-image: url(/pagesA/static/outof.png);
|
|
|
+ }
|
|
|
+ color: #666;
|
|
|
+ .uuid-info{
|
|
|
+ flex-grow: 1;
|
|
|
+ padding-right: 0.5rem;
|
|
|
+ line-height: 1.5rem;
|
|
|
+ }
|
|
|
+ .uuid{
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ .uuid-img{
|
|
|
+ width: 7rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .buttons{
|
|
|
+ padding: 1rem 2rem 2rem;
|
|
|
+ position: fixed;
|
|
|
+ width: 100%;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ background: #fff;
|
|
|
+ z-index: 10000;
|
|
|
+ border-top: 1px solid #eee;
|
|
|
+ justify-content: space-around;
|
|
|
+ /deep/ .u-btn{
|
|
|
+ width: 7rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.forms{
|
|
|
+ background: #fff;
|
|
|
+ margin-top: 0.5rem;
|
|
|
+ .forms-tits{
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ > view{
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+ padding: 0.6rem 1rem;
|
|
|
+ }
|
|
|
+ .labes{
|
|
|
+ width: 6rem;
|
|
|
+ padding-right: 0.6rem;
|
|
|
+ text{
|
|
|
+ color: red;
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .inputs{
|
|
|
+ flex-grow: 1;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|