From 040acd447439dc98536281414a6d43a54b00719d Mon Sep 17 00:00:00 2001 From: yangan <yangan0921@163.com> Date: 星期五, 09 八月 2024 13:34:42 +0800 Subject: [PATCH] feat:发版 --- pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue | 335 +++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 263 insertions(+), 72 deletions(-) diff --git a/pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue b/pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue index b61db08..90a1cda 100644 --- a/pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue +++ b/pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue @@ -1,42 +1,61 @@ <template> <view class="appointment"> <view class="searchview"> - <u-search @change="change" :searchIconSize="40" placeholder="璇疯緭鍏ヨ溅鐗屽彿" height="80" clearabled v-model="carNo" @search="search" @custom="custom" @clear="clear" > + <u-search @change="change" :searchIconSize="40" placeholder="璇疯緭鍏ヨ溅鐗屽彿" height="60" clearabled v-model="carNo" @search="search" @custom="custom" @clear="clear" > </u-search > </view> - <uni-table border - stripe - emptyText="鏆傛棤鏇村鏁版嵁"> - <uni-tr> - <uni-th align="center">杞︾墝鍙�</uni-th> - <uni-th align="center">浜у搧</uni-th> - <uni-th align="center">鍙告満</uni-th> - <uni-th align="center">鎵嬫満鍙�</uni-th> - <uni-th align="center">棰勭害鏃堕棿</uni-th> - <uni-th align="center">鎿嶄綔</uni-th> - </uni-tr> - <uni-tr v-for="(item, index) in driverBillOfLoadingData" - :key="item.id"> - <uni-td align="center">{{ item.carNo || '' }}</uni-td> - <uni-td align="center">{{ item.productNames || '' }}</uni-td> - <uni-td align="center">{{ item.driver }}</uni-td> - <uni-td align="center">{{ item.phone || '' }}</uni-td> - <uni-td align="center">{{ item.startTime || '' }}-{{item.endTime || ""}}</uni-td> - <uni-td> - <view class="buttons"> - <u-button text="鏌ョ湅杩愯緭璇�" - type="primary" - class="buttonitem" - v-if="item.roadTransportId" - @click="lookRoad(item)"></u-button> - <u-button text="妫�鏌�" - type="primary" - class="buttonitem" - @click="yuYueBtnClick(item)"></u-button> + <view style="position: relative;top: -40px;"> + <u-empty mode="data" + icon="http://cdn.uviewui.com/uview/empty/data.png" + textSize="30" + iconSize="1000" + text="鏆傛棤杞﹁締" + v-if="driverBillOfLoadingData.length == 0"></u-empty> + </view> + <view class="collection-form"> + <view class="collection-form-item" + v-for="(item, index) in driverBillOfLoadingData" + :key="index"> + <view class="first-line"> + <view class="dispatch-receive"> + <view class="dispatch-dept">{{ item.code || '' }}</view> + <view class="black-bar"></view> + <view class="dispatch">{{ item.customerName ||'' }}</view> </view> - </uni-td> - </uni-tr> - </uni-table> + <view class="point-number"> + <text class="order-type">{{ item.productNames || '' }}</text> + </view> + </view> + <view class="second-line"> + <view class="coal-name"> + <view class="dispatch-dept">{{ item.carNo || '' }}</view> + <view class="black-bar"></view> + <view class="dispatch">{{ item.driver ||'' }}</view> + <view class="black-bar"></view> + <text>{{ item.phone || '' }}</text> + </view> + </view> + <view class="third-line"> + <view class="time-icon"> + <view + style="width: 24rpx;height: 24rpx;li ne-height: 24rpx;background: url('https://wrzs.czjlchem.com:9090/appimg/image/banner/clock.png') no-repeat;background-size: cover"> + </view> + </view> + <view class="send-date">{{ item.sendDate }} {{ item.startTime || '' }}-{{item.endTime || ""}}</view> + </view> + <view class="fourth-line"> + <view class="receive" + v-if="item.roadTransportId" + @click.stop="lookRoad(item)"> + <view class="button-image">閬撹矾杩愯緭璇�</view> + </view> + <view class="forward" + @click.stop="yuYueBtnClick(item)"> + <view class="button-image">妫�鏌�</view> + </view> + </view> + </view> + </view> <u-popup :show="imgshow" @close="closeimg" @open="openimg" @@ -45,7 +64,7 @@ <view class="imgrPopup"> <u--image :showLoading="true" :src="certificateImg != null ? BaseUrl + certificateImg : ''" - width="700rpx" + width="100%" height="400rpx" @click="imageClick(certificateImg)"> <view slot="error" @@ -66,8 +85,8 @@ @close="previewImageClose" @open="previewImageOpen"> <u--image :src="previewImageSrc != null ? BaseUrl + previewImageSrc : ''" - width="400px" - height="400px"></u--image> + width="750rpx" + height="800rpx"></u--image> </u-popup> </view> <u-popup :show="show" @@ -117,8 +136,10 @@ <script> import { BaseUrl } from '@/api/publicInterface.js'; + import previewImage from '@/components/kxj-previewImage/kxj-previewImage.vue'; export default { components: { + previewImage, }, data() { return { @@ -297,11 +318,13 @@ this.$reqGet('getCheckTaskCoal',{flag:0}).then(res => { uni.hideLoading(); this.driverBillOfLoadingData = res.data; + uni.stopPullDownRefresh(); }); }else{ this.$reqGet('getCheckTaskCoal',{flag:0,carNo:this.carNo}).then(res => { uni.hideLoading(); this.driverBillOfLoadingData = res.data; + uni.stopPullDownRefresh(); }); } @@ -324,13 +347,13 @@ <style lang="scss" scoped> .searchview{ margin: 20rpx 0; - height: 200rpx; + height: 100rpx; u-search{ width: 100rpx; } } .imgrPopup{ - width: 700rpx; + width: 80vw; background-color: #ffffff; .driveruser{ display: flex; @@ -338,10 +361,11 @@ } } .receiverPopup { - height: vww(110); - width: 300rpx; + height: vww(153); + width: 60vw; .receiverPopup__title { + font-size: 1.4vw; margin: vww(10) auto 0; width: 80%; text-align: center; @@ -357,6 +381,19 @@ } } } + /deep/.u-button { + width: 100%; + height: 28px !important; + line-height: 40px; + padding: 0 12px; + font-size: 28rpx; + font-weight: 300; + color: #ffffff; + background: #497bfb !important; + letter-spacing: 4rpx; + border-radius: 37rpx 37rpx 37rpx 37rpx !important; + box-shadow: 2rpx 3rpx 13rpx 0rpx rgba(43, 98, 239, 0.5), 0rpx 0rpx 9rpx 0rpx rgba(247, 250, 253, 0.29); + } ::v-deep.appointment { .appointment-description { margin: vww(8) 0; @@ -369,32 +406,7 @@ color: #252525; } } - @mixin fourthLine { - width: 64%; - height: vww(68); - display: flex; - align-items: center; - position: relative; - left: vww(102); - bottom: vww(3); - .button-img { - width: vww(122); - height: vww(41); - background: url('https://mx.jzeg.cn:9096/appimg/image/banner/button.png') no-repeat; - background-size: cover; - font-size: 28rpx; - font-weight: 300; - color: #ffffff; - text-align: center; - line-height: vww(40); - - } - } - .fourth-line { - @include fourthLine; - } - // 琛ㄦ牸 .uni-table-scroll { width: 100%; @@ -402,25 +414,29 @@ .uni-table { min-width: 0 !important; - + .checkbox { + background: #ffffff; + } .uni-table-tr { padding: 0; - font-size: vww(10); .uni-table-th { height: vww(32); line-height: vww(20); padding: vww(5) vww(10); color: #111111; + font-size: 2vw; font-weight: 550; - background: #f5f5f5; + background: #ffffff; } .uni-table-td { height: vww(32); line-height: vww(20); padding: vww(5) vww(5); + font-size: 1.5vw; color: #111111; + background: #ffffff; .u-button { height: vww(23); } @@ -434,11 +450,186 @@ position: relative; top: vww(-120); } - .buttons{ + @mixin flex { display: flex; justify-content: space-between; - .buttonitem{ - width: 30%; - } + align-items: center; } + .collection-form-item { + margin: 0 vww(15); + width: 95%; + height: 370rpx; + background: #ffffff; + box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15); + border-radius: 20rpx; + overflow: hidden; + @include flex; + flex-direction: column; + position: relative; + align-items: flex-start; + margin-top: vww(10); + + .first-line { + width: 94%; + height: vww(30); + margin: vww(10) vww(16) 0 vww(16); + display: flex; + justify-content: space-between; + + + .dispatch-receive { + width: 70%; + display: flex; + justify-content: flex-start; + align-items: center; + + .dispatch-dept { + + display: flex; + align-items: center; + } + + .black-bar { + width: 2rpx; + height: 30rpx; + background: #515151; + margin-left: vww(12); + } + + .dispatch { + margin-left: vww(12); + min-width: vww(50); + } + + } + + .point-number { + width: 33%; + .order-type { + color: #035cfb; + border-radius: 4rpx; + text-align: center; + } + // text { + // font-size: 24rpx; + // font-weight: 400; + // color: #c78a64; + // } + + // .residue { + // font-size: 40rpx; + // font-weight: 400; + // color: #f81414; + // } + } + } + + .second-line { + width: 100%; + height: vww(30); + margin-left: vww(16); + display: flex; + align-items: center; + justify-content: flex-start; + + .coal-name { + flex-grow: 1; + height: 30rpx; + font-size: 30rpx; + font-weight: 300; + color: #515151; + position: relative; + display: flex; + align-items: center; + + .black-bar { + width: 2rpx; + height: 30rpx; + background: #515151; + margin: 0 vww(12) ; + } + + .coal-type { + margin-left: vww(12); + min-width: vww(50); + height: 30rpx; + line-height: 30rpx; + font-size: 30rpx; + font-weight: 300; + color: #515151; + } + } + } + + .third-line { + height: vww(30); + margin-left: vww(15); + display: flex; + justify-content: flex-start; + align-items: center; + + .send-date { + margin-left: vww(14); + height: 24rpx; + line-height: 24rpx; + font-size: 28rpx; + font-weight: 300; + color: #515151; + } + } + .fourth-line { + width: 100%; + height: vww(30); + @include flex; + justify-content: flex-start; + position: relative; + bottom: vww(10); + left: 30%; + + .receive, + .forward { + width: vww(123); + height: vww(48); + @include flex; + justify-content: center; + color: #ffffff; + font-size: 28rpx; + position: absolute; + + .button-image { + width: 100%; + height: 100%; + background: url('../../../static/image/banner/button.png') no-repeat; + background-size: cover; + font-size: 28rpx; + font-weight: 300; + color: #ffffff; + text-align: center; + line-height: vww(45); + } + } + + .receive { + left: vww(20); + } + + .forward { + width: vww(106); + left: vww(140); + + .button-image { + width: 100%; + height: 100%; + background: url('../../../static/image/banner/transpartent.png') no-repeat; + background-size: cover; + font-size: 28rpx; + font-weight: 300; + color: #3b56eb; + text-align: center; + line-height: vww(45); + } + } + } + + } </style> \ No newline at end of file -- Gitblit v1.9.1