123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198 |
- <template>
- <view class="pages flex flex_column" v-if="detail">
- <u-read-more toggle close-text="展开全部">
- <view class="uuid-list">
- <view>
- <view class="flex align_center">
- <view class="uuid-info">
- <view>产品名称:{{detail.productName}}</view>
- <view style="margin-top: 0.2rem;">产品编码:{{detail.productCode}}</view>
- </view>
- <view v-if="detail.productMsg" class="uuid-img" @click="viewPic(detail.productMsg)">
- <image style="width: 100%;height: 80px;background: #eaeaea;" :src="detail.productMsg"></image>
- </view>
- </view>
- <view class="uuid-info">
- <view class="uuid">唯一码:{{detail.traceCode}}</view>
- <view class="uuid">质保时间:{{detail.warrantyStartDate.split(' ')[0]}}至{{detail.warrantyEndDate.split(' ')[0]}}</view>
- </view>
- <view class="state" :class="detail.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">{{detail.storeName||'--'}}</view>
- </view>
- <view class="flex align_center">
- <view class="labes">姓名:</view>
- <view class="inputs">{{detail.storeManager||'--'}}</view>
- </view>
- <view class="flex align_center">
- <view class="labes">电话:</view>
- <view class="inputs">{{detail.storeTele?detail.storeTele+'/':''}}{{detail.storeMobile||"--"}}</view>
- </view>
- <view class="flex align_center">
- <view class="labes">汽配经销商:</view>
- <view class="inputs">{{detail.dealerName||'--'}}</view>
- </view>
- </view>
- <view class="forms">
- <view class="forms-tits">车辆信息</view>
- <view class="flex align_center">
- <view class="labes">车辆品牌:</view>
- <view class="inputs">{{detail.carBrand||'--'}}</view>
- </view>
- <view class="flex align_center">
- <view class="labes">车型:</view>
- <view class="inputs">{{detail.carModel||'--'}}</view>
- </view>
- <view class="flex align_center">
- <view class="labes">里程数:</view>
- <view class="inputs">{{detail.mileage}}KM</view>
- </view>
- <view class="flex align_center">
- <view class="labes">车牌号:</view>
- <view class="inputs">{{detail.vehicleNumber||'--'}}</view>
- </view>
- <view class="flex align_center">
- <view class="labes">客户姓名:</view>
- <view class="inputs">{{detail.customName||'--'}}</view>
- </view>
- <view class="flex align_center">
- <view class="labes">手机号码:</view>
- <view class="inputs">{{detail.customMobile||'--'}}</view>
- </view>
- </view>
- <view class="buttons flex align_center">
- <u-button type="primary" @click="shareCode">保存二维码分享给客户</u-button>
- </view>
- </view>
- </template>
- <script>
- import { getWarrantyDetail } from "@/api/trace"
- import { sharePic } from "@/libs/tools.js"
- export default {
- data() {
- return {
- detail: null,
- id: ''
- }
- },
- onLoad(opts) {
- this.id = opts.id
- this.getDetail()
- },
- methods: {
- viewPic(img){
- uni.previewImage({
- urls: [img]
- })
- },
- getDetail(){
- uni.showLoading({
- mask:true,
- title: "正在查询..."
- })
- getWarrantyDetail({id: this.id}).then(res => {
- this.detail = res.data
- uni.hideLoading()
- })
- },
- shareCode(){
- sharePic()
- }
- }
- }
- </script>
- <style lang="less">
- .pages{
- height: 100vh;
- background: #f8f8f8;
- padding-bottom: 7rem;
- 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: 4.5rem;
- height: 4.5rem;
- z-index: 1000;
- bottom: 0.5rem;
- right: 1rem;
- }
- .RUN{
- background-image: url(/pagesA/static/inhand.png);
- }
- .END{
- background-image: url(/pagesA/static/outof.png);
- }
- color: #666;
- .uuid-info{
- flex-grow: 1;
- padding-right: 0.5rem;
- line-height: 1.5rem;
- }
- .uuid{
- color: #000;
- }
- .uuid-img{
- width: 7rem;
- border: 1px solid #eee;
- }
- }
- .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: 15rem;
- }
- }
- }
- .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>
|