2541 lines
68 KiB
Vue
2541 lines
68 KiB
Vue
<template>
|
||
<view class="app">
|
||
<head-view :title="title"></head-view>
|
||
<view class="content2 contentFixed">
|
||
<view class="buttonlist">
|
||
<template v-if="tabsValue == 0">
|
||
<button class="button" type="default" @click="ask">装船要求</button>
|
||
<button class="button" type="default" @click="distribute('center','all')">指令下发</button>
|
||
</template>
|
||
<template v-if="tabsValue == 1">
|
||
<button class="button" type="default" @click="distribute('center','solo')">指令下发</button>
|
||
</template>
|
||
<template v-if="tabsValue == 2">
|
||
<button class="button" type="default" @click="ask">装船要求</button>
|
||
</template>
|
||
</view>
|
||
<custom-tabs type="c1" :value="tabsValue" @change="changeTabs">
|
||
<custom-tab-pane label="总指令" name="c1_1">
|
||
<view></view>
|
||
<view class="main">
|
||
<view class="form">
|
||
<view class="inputBox">
|
||
<view class="leftInput">
|
||
<uni-easyinput class="uni-mt-5" suffixIcon="search" v-model="mnfBl"
|
||
placeholder="提单号" @iconClick="search"></uni-easyinput>
|
||
</view>
|
||
<view class="rightInput">
|
||
<superwei-combox class="input" :candidates="brandList" :isJSON="true"
|
||
keyName="brdName" placeholder="品牌" v-model="brdName"
|
||
@select="brandSelect"></superwei-combox>
|
||
<superwei-combox class="input" :candidates="bvmList" :isJSON="true" keyName="name"
|
||
placeholder="车型" v-model="bvmName" @select="bvmSelect"></superwei-combox>
|
||
<superwei-combox class="input" :candidates="potList" :isJSON="true"
|
||
keyName="potCnname" placeholder="港口" v-model="potName"
|
||
@select="potSelect"></superwei-combox>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tjList">
|
||
<view class="tjHead" @click="clickTjHead('zzl')">
|
||
<view class="title">
|
||
<p>总指令进度</p>
|
||
<text>{{zTjList.totalSentCount}}/{{zTjList.totalSum}}</text>
|
||
</view>
|
||
<lx-progress-bar title="" :total="zTjList.totalSum" :firstValue="zTjList.totalSentCount"
|
||
:secondValue="zTjList.totalPausedSentCount" contentColor="#0067CF"
|
||
contentColor2="#FC4F00" />
|
||
<view class="bottomInfo">
|
||
<p>已发送<text>{{zTjList.totalSentCount}}</text></p>
|
||
<p>(暂停<text>{{zTjList.totalPausedSentCount}}</text>)</p>
|
||
<p>未发<text>{{zTjList.totalNotSentCount}}</text></p>
|
||
</view>
|
||
<view class="imgBox" v-if="zTjType">
|
||
<image src="../../static/images/tjxz.png" mode=""></image>
|
||
</view>
|
||
</view>
|
||
<template v-for="(item,index) in zTjList.instructionStatisticsList">
|
||
<view class="tjInfo" :key="index" :class="{active:zTjActive == index}"
|
||
@click="clickTjList(item,index,'zzl')">
|
||
<view class="title">
|
||
<p>{{item.titleBar}}</p>
|
||
<text>{{item.totalSentCount}}/{{item.zsum}}</text>
|
||
</view>
|
||
<lx-progress-bar title="" :total="item.zsum" :firstValue="item.totalSentCount"
|
||
:secondValue="item.totalNotSentCount" contentColor="#0067CF"
|
||
contentColor2="#FC4F00" />
|
||
<view class="bottomInfo">
|
||
<p>已发送<text>{{item.totalSentCount}}</text></p>
|
||
<p>(暂停<text>{{item.totalPausedSentCount}}</text>)</p>
|
||
<p>未发<text>{{item.totalNotSentCount}}</text></p>
|
||
</view>
|
||
<view class="imgBox" v-if="zTjActive == index">
|
||
<image src="../../static/images/tjxz2.png" mode=""></image>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
</view>
|
||
<template v-if="itemList.length > 0">
|
||
<view class="itemBox">
|
||
<view class="itemList">
|
||
<view class="exp" v-for="(item,index) in itemList" :key="item.index">
|
||
<view class="item">
|
||
<view class="row">
|
||
<view class="title">
|
||
<image class="titleImg" src="../../static/images/zlIcon.png"
|
||
mode="widthFix">
|
||
</image>
|
||
<view class="text">
|
||
船舱层数：{{item.shipDeck}}层{{item.cabinNo}}舱
|
||
</view>
|
||
</view>
|
||
<view class="schedule">
|
||
<text class="text">装船进度</text>
|
||
<view class="progressBox">
|
||
<van-progress color="#0067CF" stroke-width="6px"
|
||
:show-pivot="false" track-color="#DEE9F5"
|
||
:percentage="itemSum(item.loadingProgress.workProgress, item.loadingProgress.totalProgress)" />
|
||
</view>
|
||
<text>{{itemSum(item.loadingProgress.workProgress, item.loadingProgress.totalProgress)}}%</text>
|
||
</view>
|
||
<view class="planStatus planStatus0" v-if="item.totalPlanStatus == 0">
|
||
<text class="text">{{item.totalPlanStatusDesc}}</text>
|
||
</view>
|
||
<view class="planStatus planStatus3"
|
||
v-else-if="item.totalPlanStatus == 3">
|
||
<text class="text">{{item.totalPlanStatusDesc}}</text>
|
||
</view>
|
||
<view class="planStatus planStatus5"
|
||
v-else-if="item.totalPlanStatus == 5">
|
||
<text class="text">{{item.totalPlanStatusDesc}}</text>
|
||
</view>
|
||
<view class="planStatus planStatus1" v-else>
|
||
<text class="text">{{item.totalPlanStatusDesc}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="row">
|
||
<view class="rowInfo">
|
||
<view class="col">
|
||
<text>数量：</text>
|
||
<text>{{item.totalCount}}</text>
|
||
</view>
|
||
<view class="col">
|
||
<text>港口：</text>
|
||
<text>{{item.potName}}</text>
|
||
</view>
|
||
<view class="col">
|
||
<text>发送人：</text>
|
||
<text>{{item.totalSendUser}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="rowInfo">
|
||
<view class="col">
|
||
<text>负责人：</text>
|
||
<text>{{item.responsiblePerson}}</text>
|
||
</view>
|
||
<view class="col">
|
||
<text>发送时间：</text>
|
||
<text>{{item.totalSendTime}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="expand" v-if="itemActive != index" @click="isActive(index)">
|
||
展开
|
||
</view>
|
||
<view class="expand" v-else @click="itemActive = '-1'">
|
||
收起
|
||
</view>
|
||
</view>
|
||
<view class="details">
|
||
<view class="itemDetails" v-show="itemActive == index">
|
||
<template v-for="(item2,index2) in item.infoList">
|
||
<view class="detailsBox" :key="index2">
|
||
<view class="title">
|
||
<text>{{item2.mnfBl}}</text>
|
||
<button @click="toDetails(item2.spsId)">详情</button>
|
||
</view>
|
||
<view class="info">
|
||
<view class="cell">
|
||
<text>中转港：</text>
|
||
<text>{{item2.transitPortName}}</text>
|
||
</view>
|
||
<view class="cell">
|
||
<text>品牌：</text>
|
||
<text>{{item2.brdName}}</text>
|
||
</view>
|
||
<view class="cell">
|
||
<text>车型：</text>
|
||
<text>{{item2.goodsTypeName}}</text>
|
||
</view>
|
||
<view class="cell">
|
||
<text>型号：</text>
|
||
<text>{{item2.bvdName}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
<o-empty v-else height="70vh" bg="#f5f6fa" />
|
||
<!-- <view class="pageBox" v-if="itemList.length > 0">
|
||
<uni-pagination :show-icon="true" :total="total" :pageSize="pageSize" :current="current"
|
||
@change="changePage" />
|
||
</view> -->
|
||
</view>
|
||
</custom-tab-pane>
|
||
<custom-tab-pane label="分指令" name="c1_2">
|
||
<view></view>
|
||
<view class="main">
|
||
<view class="form">
|
||
<view class="inputBox">
|
||
<view class="leftInput">
|
||
<uni-easyinput class="uni-mt-5" suffixIcon="search" v-model="mnfBl"
|
||
placeholder="提单号" @iconClick="search"></uni-easyinput>
|
||
</view>
|
||
<view class="rightInput">
|
||
<superwei-combox class="input" :candidates="sendList" :isJSON="true" keyName="text"
|
||
placeholder="发送状态" v-model="sendText" @select="sendSelect"></superwei-combox>
|
||
<superwei-combox class="input" :candidates="brandList" :isJSON="true"
|
||
keyName="brdName" placeholder="品牌" v-model="brdName"
|
||
@select="brandSelect"></superwei-combox>
|
||
<superwei-combox class="input" :candidates="bvmList" :isJSON="true" keyName="name"
|
||
placeholder="车型" v-model="bvmName" @select="bvmSelect"></superwei-combox>
|
||
<superwei-combox class="input" :candidates="potList" :isJSON="true"
|
||
keyName="potCnname" placeholder="港口" v-model="potName"
|
||
@select="potSelect"></superwei-combox>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tjList">
|
||
<view class="tjHead" @click="clickTjHead('fzl')">
|
||
<view class="title">
|
||
<p>分指令进度</p>
|
||
<text>{{zTjList.branchSentCount}}/{{zTjList.branchSum}}</text>
|
||
</view>
|
||
<lx-progress-bar title="" :total="zTjList.branchSum"
|
||
:firstValue="zTjList.branchSentCount" :secondValue="zTjList.branchPausedSentCount"
|
||
contentColor="#0067CF" contentColor2="#FC4F00" />
|
||
<view class="bottomInfo">
|
||
<p>已发送<text>{{zTjList.branchSentCount}}</text></p>
|
||
<p>(暂停<text>{{zTjList.branchPausedSentCount}}</text>)</p>
|
||
<p>未发<text>{{zTjList.branchNotSentCount}}</text></p>
|
||
</view>
|
||
<view class="imgBox" v-if="zTjType">
|
||
<image src="../../static/images/tjxz.png" mode=""></image>
|
||
</view>
|
||
</view>
|
||
<template v-for="(item,index) in zTjList.instructionStatisticsList">
|
||
<view class="tjInfo" :key="index" :class="{active:zTjActive == index}"
|
||
@click="clickTjList(item,index,'fzl')">
|
||
<view class="title">
|
||
<p>{{item.titleBar}}</p>
|
||
<text>{{item.branchSentCount}}/{{item.fsum}}</text>
|
||
</view>
|
||
<lx-progress-bar title="" :total="item.fsum" :firstValue="item.branchSentCount"
|
||
:secondValue="item.branchPausedSentCount" contentColor="#0067CF"
|
||
contentColor2="#FC4F00" />
|
||
<view class="bottomInfo">
|
||
<p>已发送<text>{{item.branchSentCount}}</text></p>
|
||
<p>(暂停<text>{{item.branchPausedSentCount}}</text>)</p>
|
||
<p>未发<text>{{item.branchNotSentCount}}</text></p>
|
||
</view>
|
||
<view class="imgBox" v-if="zTjActive == index">
|
||
<image src="../../static/images/tjxz2.png" mode=""></image>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
</view>
|
||
<template v-if="itemList.length > 0">
|
||
<checkbox-group @change="checkChange">
|
||
<view class="itemBox">
|
||
<view class="itemList">
|
||
<view class="exp" v-for="(item,index) in itemList" :key="index">
|
||
<view class="item">
|
||
<view class="row">
|
||
<view class="title">
|
||
<view class="rowHead">
|
||
<checkbox :value="item.lwpId" :checked="false" />
|
||
</view>
|
||
<image class="titleImg" src="../../static/images/zlIcon.png"
|
||
mode="widthFix">
|
||
</image>
|
||
<view class="text">
|
||
船舱层数：{{item.shipDeck}}层{{item.cabinNo}}舱
|
||
</view>
|
||
</view>
|
||
<view class="schedule">
|
||
<text class="text">装船进度</text>
|
||
<view class="progressBox">
|
||
<van-progress color="#0067CF" stroke-width="6px"
|
||
:show-pivot="false" track-color="#DEE9F5"
|
||
:percentage="itemSum(item.loadingProgress.workProgress, item.loadingProgress.totalProgress)" />
|
||
</view>
|
||
<text>{{itemSum(item.loadingProgress.workProgress, item.loadingProgress.totalProgress)}}%</text>
|
||
</view>
|
||
<view class="planStatus planStatus0"
|
||
v-if="item.branchPlanStatus == 0">
|
||
<text class="text">{{item.branchPlanStatusDesc}}</text>
|
||
</view>
|
||
<view class="planStatus planStatus3"
|
||
v-else-if="item.branchPlanStatus == 2">
|
||
<text class="text">{{item.branchPlanStatusDesc}}</text>
|
||
</view>
|
||
<view class="planStatus planStatus5"
|
||
v-else-if="item.branchPlanStatus == 4">
|
||
<text class="text">{{item.branchPlanStatusDesc}}</text>
|
||
</view>
|
||
<view class="planStatus planStatus1" v-else>
|
||
<text class="text">{{item.branchPlanStatusDesc}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="row">
|
||
<view class="rowInfo">
|
||
<view class="col">
|
||
<text>数量：</text>
|
||
<text>{{item.totalCount}}</text>
|
||
</view>
|
||
<view class="col">
|
||
<text>港口：</text>
|
||
<text>{{item.potName}}</text>
|
||
</view>
|
||
<view class="col">
|
||
<text>分指令发送人：</text>
|
||
<text>{{item.branchSendUser}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="rowInfo">
|
||
<view class="col">
|
||
<text>负责人：</text>
|
||
<text>{{item.responsiblePerson}}</text>
|
||
</view>
|
||
<view class="col">
|
||
<text>发送时间：</text>
|
||
<text>{{item.totalSendTime}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="xfBtn">
|
||
<view class="btn" @click="distribute('center','solo',item)">指令下发
|
||
</view>
|
||
</view>
|
||
<view class="expand" v-if="itemActive != index"
|
||
@click="isActive(index)">
|
||
展开
|
||
</view>
|
||
<view class="expand" v-else @click="itemActive = '-1'">
|
||
收起
|
||
</view>
|
||
</view>
|
||
<view class="details">
|
||
<view class="itemDetails" v-show="itemActive == index">
|
||
<template v-for="(item2,index2) in item.infoList">
|
||
<view class="detailsBox" :key="index2">
|
||
<view class="title">
|
||
<text>{{item2.mnfBl}}</text>
|
||
<button @click="toDetails(item2.spsId)">详情</button>
|
||
</view>
|
||
<view class="info">
|
||
<view class="cell">
|
||
<text>中转港：</text>
|
||
<text>{{item2.transitPortName}}</text>
|
||
</view>
|
||
<view class="cell">
|
||
<text>品牌：</text>
|
||
<text>{{item2.brdName}}</text>
|
||
</view>
|
||
<view class="cell">
|
||
<text>车型：</text>
|
||
<text>{{item2.goodsTypeName}}</text>
|
||
</view>
|
||
<view class="cell">
|
||
<text>型号：</text>
|
||
<text>{{item2.bvdName}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</checkbox-group>
|
||
</template>
|
||
<o-empty v-else height="70vh" bg="#f5f6fa" />
|
||
<!-- <view class="pageBox" v-if="itemList.length > 0">
|
||
<uni-pagination :show-icon="true" :total="total" :pageSize="pageSize" :current="current"
|
||
@change="changePage" />
|
||
</view> -->
|
||
</view>
|
||
</custom-tab-pane>
|
||
<custom-tab-pane label="分指令-班组长" name="c1_6">
|
||
<view></view>
|
||
<view class="main">
|
||
<view class="form">
|
||
<view class="inputBox">
|
||
<view class="leftInput">
|
||
<uni-easyinput class="uni-mt-5" suffixIcon="search" v-model="mnfBl"
|
||
placeholder="提单号" @iconClick="search"></uni-easyinput>
|
||
</view>
|
||
<view class="rightInput">
|
||
<superwei-combox class="input" :candidates="brandList" :isJSON="true"
|
||
keyName="brdName" placeholder="品牌" v-model="brdName"
|
||
@select="brandSelect"></superwei-combox>
|
||
<superwei-combox class="input" :candidates="bvmList" :isJSON="true" keyName="name"
|
||
placeholder="车型" v-model="bvmName" @select="bvmSelect"></superwei-combox>
|
||
<superwei-combox class="input" :candidates="potList" :isJSON="true"
|
||
keyName="potCnname" placeholder="港口" v-model="potName"
|
||
@select="potSelect"></superwei-combox>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<template v-if="itemList.length > 0">
|
||
<view class="itemList">
|
||
<view class="exp" v-for="(item,index) in itemList" :key="item.ndex">
|
||
<view class="item">
|
||
<view class="row">
|
||
<view class="title">
|
||
<image class="titleImg" src="../../static/images/zlIcon.png"
|
||
mode="widthFix">
|
||
</image>
|
||
<view class="text">
|
||
船舱层数：{{item.shipDeck}}层{{item.cabinNo}}舱
|
||
</view>
|
||
</view>
|
||
<view class="schedule">
|
||
<text class="text">装船进度</text>
|
||
<view class="progressBox">
|
||
<van-progress color="#0067CF" stroke-width="6px" :show-pivot="false"
|
||
track-color="#DEE9F5"
|
||
:percentage="itemSum(item.loadingProgress.workProgress, item.loadingProgress.totalProgress)" />
|
||
</view>
|
||
<text>{{itemSum(item.loadingProgress.workProgress, item.loadingProgress.totalProgress)}}%</text>
|
||
</view>
|
||
<view class="planStatus planStatus0" v-if="item.branchPlanStatus == 0">
|
||
<text class="text">{{item.branchPlanStatusDesc}}</text>
|
||
</view>
|
||
<view class="planStatus planStatus3" v-else-if="item.branchPlanStatus == 2">
|
||
<text class="text">{{item.branchPlanStatusDesc}}</text>
|
||
</view>
|
||
<view class="planStatus planStatus5" v-else-if="item.branchPlanStatus == 4">
|
||
<text class="text">{{item.branchPlanStatusDesc}}</text>
|
||
</view>
|
||
<view class="planStatus planStatus1" v-else>
|
||
<text class="text">{{item.branchPlanStatusDesc}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="row">
|
||
<view class="rowInfo">
|
||
<view class="col">
|
||
<text>数量：</text>
|
||
<text>{{item.totalCount}}</text>
|
||
</view>
|
||
<view class="col">
|
||
<text>港口：</text>
|
||
<text>{{item.potName}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="rowInfo">
|
||
<view class="col">
|
||
<text>负责人：</text>
|
||
<text>{{item.responsiblePerson}}</text>
|
||
</view>
|
||
<view class="col">
|
||
<text>发送时间：</text>
|
||
<text>{{item.totalSendTime}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="rowInfo">
|
||
<view class="col">
|
||
<text>分指令发送人：</text>
|
||
<text>{{item.branchSendUser}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="expand" v-if="itemActive != index" @click="isActive(index)">
|
||
展开
|
||
</view>
|
||
<view class="expand" v-else @click="itemActive = '-1'">
|
||
收起
|
||
</view>
|
||
</view>
|
||
<view class="details">
|
||
<view class="itemDetails" v-show="itemActive == index">
|
||
<template v-for="(item2,index2) in item.infoList">
|
||
<view class="detailsBox" :key="index2">
|
||
<view class="title">
|
||
<text>{{item2.mnfBl}}</text>
|
||
<button @click="toDetails(item2.spsId)">详情</button>
|
||
</view>
|
||
<view class="info">
|
||
<view class="cell">
|
||
<text>中转港：</text>
|
||
<text>{{item2.transitPortName}}</text>
|
||
</view>
|
||
<view class="cell">
|
||
<text>品牌：</text>
|
||
<text>{{item2.brdName}}</text>
|
||
</view>
|
||
<view class="cell">
|
||
<text>车型：</text>
|
||
<text>{{item2.goodsTypeName}}</text>
|
||
</view>
|
||
<view class="cell">
|
||
<text>型号：</text>
|
||
<text>{{item2.bvdName}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<o-empty v-else height="70vh" bg="#f5f6fa" />
|
||
<!-- <view class="pageBox" v-if="itemList.length > 0">
|
||
<uni-pagination :show-icon="true" :total="total" :pageSize="pageSize" :current="current"
|
||
@change="changePage" />
|
||
</view> -->
|
||
</view>
|
||
</custom-tab-pane>
|
||
<custom-tab-pane label="配载图" name="c1_3">
|
||
<view></view>
|
||
<view class="main">
|
||
<!-- <view class="buttonlist buttonlist2">
|
||
<button class="button" type="default">刷新</button>
|
||
<button class="button" type="default">显示</button>
|
||
</view> -->
|
||
<view class="pzPot">
|
||
<view class="title">
|
||
PORT OF DESTINATION
|
||
</view>
|
||
<view class="ul">
|
||
<view class="li" v-for="(item,index) in pzPotList" :key="index">
|
||
<view class="xuhao">{{index + 1}}</view>
|
||
<view class="name">{{item.potCnname}}</view>
|
||
<view class="color" :style="item.background"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<template v-for="(item,index) in imgInfo.cabinInfoList">
|
||
<view class="imgTable" :key="index">
|
||
<view class="title">
|
||
第{{item.shipDecks}}层
|
||
</view>
|
||
<view class="nr">
|
||
<text class="text">是否可调夹板:
|
||
<text v-if="item.whetherCalldeck == 1">是</text>
|
||
<text v-if="item.whetherCalldeck == 0">否</text>
|
||
</text>
|
||
<text class="text">是否有跳板: {{item.whetherJumpName}}</text>
|
||
</view>
|
||
<view class="imgLi">
|
||
<image class="shipImg" src="@/static/images/ship-split.svg"></image>
|
||
<view class="maskBox">
|
||
<view class="testLine" v-for="item2 in item.shipSpace" :key="item2"></view>
|
||
<view class="testInfo">
|
||
|
||
</view>
|
||
</view>
|
||
<view class="heightBox">
|
||
{{item.tierHeight}}m
|
||
</view>
|
||
<view class="imgSize leftTopImg"
|
||
v-if="item.whetherJump == 2 || item.whetherJump == 4 || item.whetherJump == 6 || item.whetherJump == 7 || item.whetherJump == 8 || item.whetherJump == 9">
|
||
<image src="@/static/images/jump-tail.svg" mode=""></image>
|
||
</view>
|
||
<view class="imgSize leftBotImg"
|
||
v-if="item.whetherJump == 4 || item.whetherJump == 7 || item.whetherJump == 9">
|
||
<image src="@/static/images/jump-tail.svg" mode=""></image>
|
||
</view>
|
||
<view class="imgSize2 topImg"
|
||
v-if="item.whetherJump == 3 || item.whetherJump == 5 || item.whetherJump == 6 || item.whetherJump == 7 || item.whetherJump == 8 || item.whetherJump == 9">
|
||
<image src="@/static/images/jump-mid.svg" mode=""></image>
|
||
</view>
|
||
<view class="imgSize2 botImg"
|
||
v-if="item.whetherJump == 5 || item.whetherJump == 8 || item.whetherJump == 9">
|
||
<image src="@/static/images/jump-mid.svg" mode=""></image>
|
||
</view>
|
||
</view>
|
||
<view class="tableHead">
|
||
<text>货物明细</text>
|
||
<uni-icons class="jt" type="bottom" size="24"></uni-icons>
|
||
</view>
|
||
<uni-table border stripe emptyText="暂无更多数据">
|
||
<!-- 表头行 -->
|
||
<uni-tr class="gray">
|
||
<uni-th align="center" width="20">积载编号</uni-th>
|
||
<uni-th align="center" width="20">提单号</uni-th>
|
||
<uni-th align="center" width="20">港口</uni-th>
|
||
<uni-th align="center" width="20">品牌</uni-th>
|
||
<uni-th align="center" width="20">车型</uni-th>
|
||
<uni-th align="center" width="20">型号</uni-th>
|
||
<uni-th align="center" width="20">车型明细</uni-th>
|
||
<uni-th align="center" width="20">数量</uni-th>
|
||
<uni-th align="center" width="20">长</uni-th>
|
||
<uni-th align="center" width="20">宽</uni-th>
|
||
<uni-th align="center" width="20">高</uni-th>
|
||
<uni-th align="center" width="20">位置</uni-th>
|
||
</uni-tr>
|
||
<!-- 表格数据行 -->
|
||
<uni-tr v-for="(item2,index2) in goodsInfo[index].stowageList" :key="index2">
|
||
<uni-td align="center">{{item2.stowageNo}}</uni-td>
|
||
<uni-td align="center">{{item2.mnfBl}}</uni-td>
|
||
<uni-td align="center">{{item2.potName}}</uni-td>
|
||
<uni-td align="center">{{item2.brdName}}</uni-td>
|
||
<uni-td align="center">{{item2.goodsTypeName}}</uni-td>
|
||
<uni-td align="center">{{item2.model}}</uni-td>
|
||
<uni-td align="center">{{item2.bvdName}}</uni-td>
|
||
<uni-td align="center">{{item2.amount}}</uni-td>
|
||
<uni-td align="center">{{item2.carLength}}</uni-td>
|
||
<uni-td align="center">{{item2.carWidth}}</uni-td>
|
||
<uni-td align="center">{{item2.carHeight}}</uni-td>
|
||
<uni-td align="center">{{item2.cabinNoList}}</uni-td>
|
||
</uni-tr>
|
||
</uni-table>
|
||
</view>
|
||
</template>
|
||
</view>
|
||
</custom-tab-pane>
|
||
<custom-tab-pane label="场位图" name="c1_4">
|
||
<view class="main">
|
||
<view>
|
||
<template v-if="placeTabs == 0">
|
||
<view class="field">
|
||
<view class="boxTop">
|
||
<view class="title">
|
||
堆场
|
||
</view>
|
||
<view class="option">
|
||
<uni-data-select v-model="optionValue"
|
||
:localdata="optionList"></uni-data-select>
|
||
</view>
|
||
</view>
|
||
<view class="fpList">
|
||
<view class="fpInfo">
|
||
<view class="fpTitle">
|
||
港建库
|
||
</view>
|
||
<view class="fpListInfo">
|
||
<view class="infoTop">
|
||
<view class="infoTopTitle">A1区（12*12）</view>
|
||
<view class="titleRight" @click="toGoPlace">
|
||
<text>车道</text>
|
||
<view class="titleIcon">
|
||
<van-icon name="arrow" color="#fff" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="infoCarNum">
|
||
<text>车位总数：120车位</text>
|
||
<text>使用：40车位</text>
|
||
<text>剩余：40车位</text>
|
||
<text>可停放车辆：300辆</text>
|
||
<text>已停放车辆：300辆</text>
|
||
</view>
|
||
<view class="progressBox">
|
||
<van-progress :percentage="itemSum2(2000)"
|
||
:pivot-text="'1000/' + 2000" />
|
||
</view>
|
||
<view class="carInfoList">
|
||
<view class="carBrand" v-for="item in 4" :key="item">
|
||
<view class="brandTitle">
|
||
保时捷-轿车
|
||
</view>
|
||
<view class="placeInfo">
|
||
400 辆，共5道12车位
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="fpListInfo notListInfo">
|
||
<view class="infoTop">
|
||
<view class="infoTopTitle">A1区（12*12）</view>
|
||
<view class="titleRight" @click="toGoPlace">
|
||
<text>车道</text>
|
||
<view class="titleIcon">
|
||
<van-icon name="arrow" color="#fff" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="notTitle">
|
||
未分配
|
||
</view>
|
||
<text>车位总数：120车位</text>
|
||
<text>可停放车辆：300辆</text>
|
||
</view>
|
||
<view class="tipInfo">
|
||
未使用2车道20车位
|
||
</view>
|
||
</view>
|
||
<view class="fpInfo">
|
||
<view class="fpTitle">
|
||
海棠库
|
||
</view>
|
||
<view class="fpListInfo notListInfo">
|
||
<view class="infoTop">
|
||
<view class="infoTopTitle">A1区（12*12）</view>
|
||
<view class="titleRight" @click="toGoPlace">
|
||
<text>车道</text>
|
||
<view class="titleIcon">
|
||
<van-icon name="arrow" color="#fff" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="notTitle">
|
||
未分配
|
||
</view>
|
||
<text>车位总数：120车位</text>
|
||
<text>可停放车辆：300辆</text>
|
||
</view>
|
||
<view class="fpListInfo">
|
||
<view class="carInfoList">
|
||
<view class="infoTop">
|
||
<view class="infoTopTitle">A1区（12*12）</view>
|
||
<view class="titleRight" @click="toGoPlace">
|
||
<text>车道</text>
|
||
<view class="titleIcon">
|
||
<van-icon name="arrow" color="#fff" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="infoCarNum">
|
||
<text>车位总数：120车位</text>
|
||
<text>使用：40车位</text>
|
||
<text>剩余：40车位</text>
|
||
<text>可停放车辆：300辆</text>
|
||
<text>已停放车辆：300辆</text>
|
||
</view>
|
||
<view class="progressBox">
|
||
<van-progress :percentage="itemSum2(2000)"
|
||
:pivot-text="'1000/' + 2000" />
|
||
</view>
|
||
</view>
|
||
<view class="carInfoList">
|
||
<view class="carBrand" v-for="item in 4" :key="item">
|
||
<view class="brandTitle">
|
||
保时捷-轿车
|
||
</view>
|
||
<view class="placeInfo">
|
||
400 辆，共5道12车位
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<template v-else>
|
||
<place @modifyPlaceTabs="modifyPlaceTabs"></place>
|
||
</template>
|
||
</view>
|
||
</view>
|
||
</custom-tab-pane>
|
||
<custom-tab-pane label="装船要求信息" name="c1_5">
|
||
<view></view>
|
||
<view class="main">
|
||
<view class="askBox">
|
||
<view class="title">
|
||
装船要求信息
|
||
</view>
|
||
<view class="askContent">
|
||
{{askValue}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</custom-tab-pane>
|
||
</custom-tabs>
|
||
<uni-popup ref="popup" type="dialog">
|
||
<view class="popupBox">
|
||
<view class="popupTitle">
|
||
指令下发
|
||
</view>
|
||
<view class="popupInfo">
|
||
<text>负责人：</text>
|
||
<template v-if="tabsValue == 0">
|
||
<view style="border: 1px solid gray;">
|
||
<superwei-combox class="input" :candidates="directorList" :isJSON="true" keyName="text"
|
||
placeholder="请选择负责人" v-model="directorValue"
|
||
@select="directorChange"></superwei-combox>
|
||
</view>
|
||
</template>
|
||
<template v-if="tabsValue == 1">
|
||
<view style="border: 1px solid gray;">
|
||
<rudon-multiSelector welcome="请选择负责人" :is_using_slot="false" :is_using_icon="true"
|
||
:localdata="directorList" @change="directorChange2"></rudon-multiSelector>
|
||
</view>
|
||
</template>
|
||
</view>
|
||
<view class="popupBtn">
|
||
<view class="btnList">
|
||
<button class="button" type="default" @click="zlCancel">取 消</button>
|
||
<button class="button" type="primary" @click="zlConfirm">发 送</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
<uni-popup ref="popup2" type="dialog">
|
||
<view class="popupBox popupBox2">
|
||
<view class="popupTitle">
|
||
装船要求
|
||
</view>
|
||
<uni-easyinput type="textarea" v-model="askValue" placeholder="请输入内容..."></uni-easyinput>
|
||
<view class="popupBtn">
|
||
<view class="btnList">
|
||
<button class="button" type="default" @click="zcCancel">取 消</button>
|
||
<button class="button" type="primary" @click="zcConfirm">提 交</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import HeadView from '@/components/head-view/head-view.vue';
|
||
import HeadInfo from '@/components/head-info/head-info';
|
||
import place from './place.vue';
|
||
export default {
|
||
data() {
|
||
return {
|
||
title: "",
|
||
loginObj: {},
|
||
tabsValue: 0, // 0(总指令) 1(分指令)
|
||
shipInfo: {}, // 船只数据
|
||
// 搜索框
|
||
mnfBl: '', // 提单号
|
||
mnfBlItem: {},
|
||
mnfBlList: [],
|
||
// 品牌
|
||
brdId: '',
|
||
brdName: '',
|
||
brandItem: {},
|
||
brandList: [],
|
||
// 车型
|
||
bvmId: '',
|
||
bvmName: '',
|
||
bvmItem: {},
|
||
bvmList: [],
|
||
// 港口
|
||
potId: "",
|
||
potName: '',
|
||
potItem: {},
|
||
potList: [],
|
||
// 发送状态
|
||
sendList: [{
|
||
vale: "1",
|
||
text: "已发送"
|
||
}, {
|
||
vale: "0",
|
||
text: "待发送"
|
||
}],
|
||
sendValue: "",
|
||
sendText: "",
|
||
// 指令下发弹窗负责人
|
||
directorId: "",
|
||
directorValue: "",
|
||
directorTrue: [], // 选中负责人列表
|
||
directorList: [],
|
||
roleId: "", // 角色ID
|
||
|
||
// 装船要求
|
||
askValue: "",
|
||
itemList: [],
|
||
current: 0,
|
||
active: 1,
|
||
itemActive: -1,
|
||
// 总指令工作包
|
||
zzlLwpIdList: [],
|
||
// 分指令多选
|
||
checkList: [],
|
||
fzzRow: {},
|
||
// 指令下发状态 all 所有下发 solo 单个下发
|
||
distributeType: "",
|
||
|
||
// 总指令统计图
|
||
zTjType: true,
|
||
zTjActive: -1,
|
||
zTjList: {},
|
||
shipDeck: "",
|
||
|
||
optionValue: "",
|
||
optionList: [{
|
||
value: "0",
|
||
text: "全部堆场"
|
||
},
|
||
{
|
||
alue: "1",
|
||
text: "外六"
|
||
},
|
||
{
|
||
alue: "2",
|
||
text: "港建库"
|
||
},
|
||
{
|
||
alue: "3",
|
||
text: "高东库"
|
||
},
|
||
{
|
||
alue: "4",
|
||
text: "江海库"
|
||
}
|
||
],
|
||
placeTabs: 0,
|
||
|
||
// 分页
|
||
// total: 0,
|
||
// pageSize: 4,
|
||
// current: 1,
|
||
|
||
// 配载图港口
|
||
pzPotList: [],
|
||
// 配载图详情
|
||
imgInfo: [],
|
||
// 货物明细
|
||
goodsInfo: [],
|
||
}
|
||
},
|
||
computed: {
|
||
itemSum() {
|
||
return function(item, item2) {
|
||
let sum = ((item / item2) * 100).toFixed(1)
|
||
return sum
|
||
};
|
||
},
|
||
itemSum2() {
|
||
return function(item) {
|
||
let sum = 1000 / item * 100
|
||
return sum
|
||
};
|
||
}
|
||
},
|
||
onLoad(options) {
|
||
this.shipInfo = JSON.parse(decodeURIComponent(options.params)).shipInfo
|
||
console.log(this.shipInfo)
|
||
this.title = `${this.shipInfo.spmIdDesc} / ${this.shipInfo.vvyName}`
|
||
this.loginObj = uni.getStorageSync('loginObj')
|
||
if (this.tabsValue == 0) {
|
||
this.loadSumOrder() // 总指令：分页查询
|
||
}
|
||
this.getPot() // 获取港口
|
||
this.getBrand() // 获取品牌
|
||
this.getBvm() // 获取车型
|
||
this.getRoleId() // 获取角色ID
|
||
this.initAsk() // 获取装船要求
|
||
this.getStatistics() // 获取统计数据
|
||
},
|
||
components: {
|
||
HeadView,
|
||
HeadInfo,
|
||
place,
|
||
},
|
||
methods: {
|
||
// 点击tabs
|
||
changeTabs(e) {
|
||
this.mnfBl = ''
|
||
this.brdName = ''
|
||
this.bvmName = ''
|
||
this.potName = ''
|
||
this.itemList = []
|
||
this.sendValue = ''
|
||
this.tabsValue = e.value
|
||
this.zTjActive = -1
|
||
this.shipDeck = ""
|
||
if (e.value == 1 || e.value == 2) {
|
||
this.loadOtherOrder()
|
||
} else if (e.value == 0) {
|
||
this.loadSumOrder()
|
||
} else if (e.value == 3) {
|
||
this.getPotList()
|
||
this.getImgInfo()
|
||
this.getGoodsInfo()
|
||
}
|
||
this.directorList = []
|
||
this.getRoleId()
|
||
},
|
||
// 点击搜索
|
||
search() {
|
||
if (this.tabsValue == 1 || this.tabsValue == 2) {
|
||
this.loadOtherOrder()
|
||
} else if (this.tabsValue == 0) {
|
||
this.loadSumOrder()
|
||
}
|
||
this.getStatistics()
|
||
},
|
||
// 点击分页
|
||
changePage(e) {
|
||
console.log(e)
|
||
this.current = e.current;
|
||
if (this.tabsValue == 1 || this.tabsValue == 2) {
|
||
this.loadOtherOrder()
|
||
} else if (this.tabsValue == 0) {
|
||
this.loadSumOrder()
|
||
}
|
||
},
|
||
// 点击总指令统计列表总标题
|
||
clickTjHead(type) {
|
||
this.zTjActive = -1
|
||
this.shipDeck = ""
|
||
if (type == 'zzl') {
|
||
this.loadSumOrder()
|
||
} else if (type == 'fzl') {
|
||
this.loadOtherOrder()
|
||
}
|
||
},
|
||
// 点击总指令统计列表
|
||
clickTjList(item, index, type) {
|
||
this.zTjActive = index
|
||
this.shipDeck = item.shipDeck
|
||
if (type == 'zzl') {
|
||
this.loadSumOrder()
|
||
} else if (type == 'fzl') {
|
||
this.loadOtherOrder()
|
||
}
|
||
},
|
||
// 获取统计列表
|
||
getStatistics() {
|
||
let target = ""
|
||
if (this.shipInfo.tradeType == '外贸') {
|
||
target = "W_L"
|
||
} else {
|
||
target = "N_L"
|
||
}
|
||
uni.request({
|
||
url: `${this.$local}/api/instruction/statistics?vvyIds=${this.shipInfo.vvyId}&target=${target}`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
this.zTjList = res.data.data[0]
|
||
this.zTjList["totalSum"] = this.zTjList.totalSentCount + this.zTjList.totalNotSentCount
|
||
this.zTjList["branchSum"] = this.zTjList.branchSentCount + this.zTjList
|
||
.branchNotSentCount
|
||
this.zTjList.instructionStatisticsList.forEach(v => {
|
||
let zsum = v.totalSentCount + v.totalNotSentCount
|
||
this.$set(v, "zsum", zsum)
|
||
let fsum = v.branchSentCount + v.branchNotSentCount
|
||
this.$set(v, "fsum", fsum)
|
||
})
|
||
console.log(this.zTjList)
|
||
}
|
||
})
|
||
},
|
||
// 获取总指令列表
|
||
loadSumOrder() {
|
||
uni.request({
|
||
url: `${this.$local}/api/shipInstructions/page?vvyId=${this.shipInfo.vvyId}&brdId=${this.brdId}&mnfBl=${this.mnfBl}&potId=${this.potId}&bvmId=${this.bvmId}&shipDeck=${this.shipDeck}`,
|
||
// &size=${this.pageSize}¤t=${this.current}
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
this.itemList = res.data.data.records
|
||
this.total = res.data.data.total
|
||
this.itemList.forEach((v, index) => {
|
||
// if (v.branchPlanStatus == 0) {
|
||
this.zzlLwpIdList.push(v.lwpId)
|
||
// }
|
||
this.getBottomInfo(v.lwpId, index)
|
||
})
|
||
}
|
||
})
|
||
},
|
||
// 获取分指令列表
|
||
loadOtherOrder() {
|
||
let teamFlag = ""
|
||
if (this.tabsValue == 2) {
|
||
teamFlag = true
|
||
this.sendValue = 1
|
||
}
|
||
uni.request({
|
||
url: `${this.$local}/api/shipInstructions/pageCommandForBranch?vvyId=${this.shipInfo.vvyId}&brdId=${this.brdId}&mnfBl=${this.mnfBl}&potId=${this.potId}&bvmId=${this.bvmId}&sendStatus=${this.sendValue}&shipDeck=${this.shipDeck}&teamFlag=${teamFlag}`, // &size=${this.pageSize}¤t=${this.current}
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
this.itemList = res.data.data.records
|
||
this.total = res.data.data.total
|
||
this.itemList.forEach((v, index) => {
|
||
this.getBottomInfo(v.lwpId, index)
|
||
})
|
||
}
|
||
})
|
||
},
|
||
// 获取指令下方信息
|
||
getBottomInfo(id, index) {
|
||
uni.request({
|
||
url: `${this.$local}/api/shipInstructions/queryStowageForLwpId?lwpId=${id}`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
this.$set(this.itemList[index], 'infoList', res.data.data)
|
||
}
|
||
})
|
||
},
|
||
// 是否展开
|
||
isActive(e) {
|
||
this.itemActive = e
|
||
},
|
||
// 点击指令下发
|
||
distribute(type, a, item) {
|
||
this.distributeType = a
|
||
this.$refs.popup.open(type)
|
||
if (a == 'again' || a == 'solo') {
|
||
this.fzzRow = item
|
||
this.loadOtherOrder()
|
||
} else if (a == 'all') {
|
||
this.fzzRow = ""
|
||
this.loadSumOrder()
|
||
}
|
||
},
|
||
// 获取角色ID
|
||
getRoleId() {
|
||
let name = ""
|
||
if (this.tabsValue == 0) {
|
||
name = "dongLei"
|
||
} else if (this.tabsValue == 1) {
|
||
name = "shipmenter"
|
||
}
|
||
uni.request({
|
||
url: `${this.$local}/api/roles?name=${name}`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == 200) {
|
||
this.roleId = res.data.data
|
||
this.getDirector()
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 根据角色ID获取负责人
|
||
getDirector() {
|
||
uni.request({
|
||
url: `${this.$local}/api/roles/principals?roleId=${this.roleId}`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == 200) {
|
||
res.data.data.forEach(v => {
|
||
this.directorList.push({
|
||
text: v.name,
|
||
value: v.id,
|
||
is_selected: false
|
||
})
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 总指令选择负责人
|
||
directorChange(e) {
|
||
this.directorTrue = [{
|
||
userId: e.value
|
||
}]
|
||
this.directorId = e.value
|
||
this.directorValue = e.text
|
||
},
|
||
// 分指令选择负责人
|
||
directorChange2(e) {
|
||
this.directorTrue = []
|
||
e.forEach(v => {
|
||
if (v.is_selected) {
|
||
this.directorTrue.push({
|
||
userId: v.value
|
||
})
|
||
}
|
||
})
|
||
},
|
||
// 获取装船要求
|
||
initAsk() {
|
||
uni.request({
|
||
url: `${this.$local}/api/vesselVoyages/${this.shipInfo.vvyId}`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == 200) {
|
||
this.askValue = res.data.data.loadUnloadRequirements
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 修改装船要求
|
||
getAsk() {
|
||
let reqDto = {
|
||
"loadUnloadRequirements": this.askValue,
|
||
"spmId": this.shipInfo.spmId,
|
||
"vvyId": this.shipInfo.vvyId,
|
||
"vvyName": this.shipInfo.vvyName,
|
||
}
|
||
uni.request({
|
||
url: `${this.$local}/api/vesselVoyages/${this.shipInfo.vvyId}`,
|
||
data: reqDto,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'PUT', //请求方式，必须为大写
|
||
success: (res) => {
|
||
console.log(res)
|
||
if (res.data.status == 200) {
|
||
this.initAsk()
|
||
uni.showToast({
|
||
title: `设置装船要求成功`,
|
||
icon: 'success',
|
||
duration: 2000
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: `${res.data.error_description}`,
|
||
icon: 'error',
|
||
duration: 2000
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 指令下发确认
|
||
zlConfirm() {
|
||
if (this.directorTrue.length > 0) {
|
||
let lwpIdList = []
|
||
if (this.tabsValue == 0) {
|
||
lwpIdList = this.zzlLwpIdList
|
||
} else if (this.tabsValue == 1) {
|
||
if (this.fzzRow == "") {
|
||
lwpIdList = this.checkList
|
||
} else {
|
||
lwpIdList = [this.fzzRow.lwpId]
|
||
}
|
||
}
|
||
// 外贸数据
|
||
let reqDTO = {
|
||
"loadUnloadRequirements": this.askValue,
|
||
"lwpIdList": lwpIdList,
|
||
"principalList": this.directorTrue,
|
||
"vvyId": this.shipInfo.vvyId
|
||
}
|
||
if (this.distributeType == 'all') {
|
||
uni.request({
|
||
url: `${this.$local}/api/shipInstructions/commandIssued`,
|
||
data: reqDTO,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'POST', //请求方式，必须为大写
|
||
success: (res) => {
|
||
this.$refs.popup.close()
|
||
if (res.status == 200) {
|
||
this.loadSumOrder()
|
||
this.getStatistics()
|
||
uni.showToast({
|
||
title: `总指令下发成功`,
|
||
icon: 'success',
|
||
duration: 2000
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: `${res.data.error_description}`,
|
||
icon: 'error',
|
||
duration: 2000
|
||
})
|
||
}
|
||
}
|
||
})
|
||
} else if (this.distributeType == 'solo') {
|
||
uni.request({
|
||
url: `${this.$local}/api/shipInstructions/commandSendForBranch`,
|
||
data: reqDTO,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'PUT', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == 200) {
|
||
this.loadSumOrder()
|
||
this.getStatistics()
|
||
uni.showToast({
|
||
title: `分指令下发成功`,
|
||
icon: 'success',
|
||
duration: 2000
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: `${res.data.error_description}`,
|
||
icon: 'error',
|
||
duration: 2000
|
||
})
|
||
}
|
||
}
|
||
})
|
||
} else if (this.distributeType == 'again') {
|
||
let url = `/api/shipInstructions/commandReissuedForBranch`
|
||
let lwpIdList3 = []
|
||
lwpIdList3.push(this.fzzRow.lwpId)
|
||
let reqDto3 = {
|
||
"loadUnloadRequirements": this.askValue,
|
||
"lwpIdList": lwpIdList3,
|
||
"principalList": this.directorTrue,
|
||
"vvyId": this.shipInfo.vvyId
|
||
}
|
||
uni.request({
|
||
url: `${this.$local}${url}`,
|
||
data: reqDto3,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'PUT', //请求方式，必须为大写
|
||
success: (res) => {
|
||
console.log(res)
|
||
if (res.data.status == 200) {
|
||
this.loadOtherOrder()
|
||
this.getStatistics()
|
||
uni.showToast({
|
||
title: `重新发送指令成功`,
|
||
icon: 'success',
|
||
duration: 2000
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: `${res.data.error_description}`,
|
||
icon: 'error',
|
||
duration: 2000
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
this.$refs.popup.close()
|
||
} else {
|
||
uni.showToast({
|
||
title: `负责人不能为空`,
|
||
icon: 'error',
|
||
duration: 2000
|
||
})
|
||
}
|
||
},
|
||
// 指令下发取消
|
||
zlCancel() {
|
||
this.directorTrue = []
|
||
this.$refs.popup.close()
|
||
},
|
||
// 点击暂停
|
||
suspend(item) {
|
||
let url = `/api/shipInstructions/commandPause?lwpId=${item.lwpId}`
|
||
uni.request({
|
||
url: `${this.$local}${url}`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'PUT', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == 200) {
|
||
this.loadOtherOrder()
|
||
uni.showToast({
|
||
title: `暂停指令成功`,
|
||
icon: 'success',
|
||
duration: 2000
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: `${res.data.error_description}`,
|
||
icon: 'error',
|
||
duration: 2000
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 点击装船要求
|
||
ask(type) {
|
||
this.$refs.popup2.open(type)
|
||
},
|
||
// 装船要求确认
|
||
zcConfirm() {
|
||
this.getAsk() // 修改装船要求
|
||
this.$refs.popup2.close()
|
||
},
|
||
// 装船要求取消
|
||
zcCancel() {
|
||
this.$refs.popup2.close()
|
||
},
|
||
// 选择发送状态
|
||
sendSelect(e) {
|
||
this.sendText = e.text
|
||
this.sendValue = e.vale
|
||
this.loadOtherOrder()
|
||
},
|
||
// 获取品牌
|
||
getBrand() {
|
||
uni.request({
|
||
url: `${this.$local}/api/miniapp/queryBrand`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == "200") {
|
||
this.brandList = res.data.data
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 选择品牌
|
||
brandSelect(e) {
|
||
this.brandItem = e
|
||
this.brdId = e.brdId
|
||
this.brdName = e.brdName
|
||
this.loadSumOrder()
|
||
},
|
||
// 获取港口
|
||
getPot() {
|
||
uni.request({
|
||
url: `${this.$local}/api/miniapp/port`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == "200") {
|
||
this.potList = res.data.data
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 选择港口
|
||
potSelect(e) {
|
||
this.potItem = e
|
||
this.potName = e.potCnname
|
||
this.potId = e.potId
|
||
this.loadSumOrder()
|
||
},
|
||
// 获取车型
|
||
getBvm() {
|
||
uni.request({
|
||
url: `${this.$local}/api/miniapp/getVehicleModel`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == "200") {
|
||
this.bvmList = res.data.data
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 选择车型
|
||
bvmSelect(e) {
|
||
this.bvmItem = e
|
||
this.bvmId = e.id
|
||
this.bvmName = e.name
|
||
this.loadSumOrder()
|
||
},
|
||
toDetails(id) {
|
||
let obj = {
|
||
id: id,
|
||
tradeName: "W",
|
||
shipInfo: this.shipInfo
|
||
}
|
||
const params = encodeURIComponent(JSON.stringify(obj));
|
||
uni.navigateTo({
|
||
url: '/pages/index/instructDetails?params=' + params
|
||
})
|
||
},
|
||
// 分指令多选
|
||
checkChange(e) {
|
||
this.checkList = e.detail.value
|
||
},
|
||
// 配载图相关
|
||
// 获取配载图港口及对应颜色
|
||
getPotList() {
|
||
this.shipInfo.vvyId = 'f4303b2c8b6d715f4007f961f2498b10'
|
||
uni.request({
|
||
url: `${this.$local}/api/stowage/portList?vvyId=${this.shipInfo.vvyId}`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == "200") {
|
||
this.pzPotList = res.data.data
|
||
this.pzPotList.forEach(v => {
|
||
this.$set(v, 'background', `background:${v.potColor}`)
|
||
})
|
||
console.log(this.pzPotList)
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 获取配载图图中数据
|
||
getImgInfo() {
|
||
uni.request({
|
||
url: `${this.$local}/api/stowage/flatSnapshot?vvyId=${this.shipInfo.vvyId}`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
console.log(res)
|
||
if (res.data.status == "200") {
|
||
this.imgInfo = res.data.data
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 获取货物明细
|
||
getGoodsInfo() {
|
||
uni.request({
|
||
url: `${this.$local}/api/stowage/detail?vvyId=${this.shipInfo.vvyId}&spmId=${this.shipInfo.spmId}`,
|
||
header: {
|
||
'Content-Type': 'application/json', //自定义请求头信息
|
||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||
},
|
||
method: 'GET', //请求方式，必须为大写
|
||
success: (res) => {
|
||
if (res.data.status == "200") {
|
||
this.goodsInfo = res.data.data
|
||
console.log(this.goodsInfo)
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 场位图相关
|
||
// 点击车道
|
||
toGoPlace() {
|
||
this.placeTabs = 1;
|
||
},
|
||
// 子组件修改值
|
||
modifyPlaceTabs(data) {
|
||
this.placeTabs = data;
|
||
},
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style lang="less">
|
||
.blue {
|
||
color: #108ee9;
|
||
}
|
||
|
||
.content2 {
|
||
background-color: #F6F7F9;
|
||
position: relative;
|
||
overflow: hidden;
|
||
|
||
/deep/.tab .tab-bar {
|
||
height: 66px;
|
||
line-height: 66px;
|
||
position: relative;
|
||
}
|
||
|
||
/deep/.tab .tab-bar-item {
|
||
height: 66px;
|
||
line-height: 66px;
|
||
font-size: 18px;
|
||
color: #23262E;
|
||
font-weight: bold;
|
||
font-family: PingFangSC-Semibold;
|
||
padding: 0 24px !important;
|
||
}
|
||
|
||
/deep/.tab .tab-bar-item.active {
|
||
color: #0067CF
|
||
}
|
||
|
||
/deep/.tab .tab-bar-item .active-line {
|
||
color: #0067CF;
|
||
width: 54px;
|
||
height: 4px;
|
||
}
|
||
|
||
/deep/.tab-pane {
|
||
width: 100%;
|
||
}
|
||
|
||
.main {
|
||
height: calc(100vh - 134px);
|
||
}
|
||
|
||
.askBox {
|
||
width: 97%;
|
||
padding: 20px;
|
||
margin: 20px;
|
||
background: #fff;
|
||
height: 300px;
|
||
overflow: scroll;
|
||
|
||
.title {
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
}
|
||
|
||
.askContent {
|
||
font-size: 16px;
|
||
margin-top: 20px;
|
||
}
|
||
}
|
||
|
||
.pageBox {
|
||
margin-top: 20px;
|
||
}
|
||
|
||
/deep/.tab .tab-cont {
|
||
padding: 0;
|
||
}
|
||
|
||
.form {
|
||
background: #FAFAFA;
|
||
border-top: 1px solid #EEEEEE;
|
||
border-bottom: 1px solid #EEEEEE;
|
||
|
||
.inputBox {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 5px 10px;
|
||
|
||
.leftInput {
|
||
width: 400px;
|
||
}
|
||
|
||
/deep/.uni-easyinput {
|
||
width: 400px;
|
||
|
||
/deep/.content-clear-icon {
|
||
padding-right: 16px;
|
||
}
|
||
}
|
||
|
||
/deep/.is-input-border {
|
||
border-radius: 18.5px;
|
||
}
|
||
|
||
.rightInput {
|
||
display: flex;
|
||
gap: 10px;
|
||
}
|
||
}
|
||
|
||
.input {
|
||
width: 100px;
|
||
height: 35px;
|
||
line-height: 35px;
|
||
background: transparent;
|
||
border: none;
|
||
|
||
/deep/.superwei-combox__input {
|
||
text-align: right;
|
||
padding-right: 6px;
|
||
}
|
||
|
||
/deep/.superwei-combox__input-plac {
|
||
color: #000;
|
||
}
|
||
}
|
||
|
||
.btn {
|
||
height: 35px;
|
||
line-height: 35px;
|
||
margin-right: 10px;
|
||
|
||
}
|
||
}
|
||
|
||
.buttonlist {
|
||
padding: 10px;
|
||
position: absolute;
|
||
top: 5px;
|
||
right: 0px;
|
||
z-index: 999;
|
||
|
||
.button {
|
||
display: inline-block;
|
||
height: 36px;
|
||
line-height: 36px;
|
||
text-align: center;
|
||
margin-right: 10px;
|
||
border-radius: 4px;
|
||
}
|
||
|
||
.button:first-child {
|
||
border: 1px solid #0067CF;
|
||
color: #0067CF;
|
||
background: #fff;
|
||
}
|
||
|
||
.button:last-child {
|
||
color: #fff;
|
||
background: #0067CF;
|
||
}
|
||
}
|
||
|
||
.buttonlist2 {
|
||
.button {
|
||
border: 1px solid #999 !important;
|
||
color: #999 !important;
|
||
background-color: #fff !important;
|
||
}
|
||
}
|
||
|
||
.tablist {
|
||
width: 175px;
|
||
height: 60px;
|
||
line-height: 60px;
|
||
font-size: 21px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.tabs {
|
||
width: 80px;
|
||
height: 60px;
|
||
border-bottom: 2rpx solid #ebebeb;
|
||
}
|
||
|
||
.active {
|
||
color: #1890ff;
|
||
border-bottom: 2rpx solid #1890ff;
|
||
}
|
||
|
||
}
|
||
|
||
.tjList {
|
||
width: 240px;
|
||
background: #EBEDF1;
|
||
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.10);
|
||
float: left;
|
||
overflow: scroll;
|
||
margin-right: 4px;
|
||
|
||
.active {
|
||
border: 1px solid #0067CF;
|
||
}
|
||
|
||
.title {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
p {
|
||
color: #23262E;
|
||
font-size: 16px;
|
||
}
|
||
|
||
text {
|
||
font-size: 14px;
|
||
color: #0067CF;
|
||
line-height: 21px;
|
||
}
|
||
}
|
||
|
||
/deep/.progress-bar-title {
|
||
margin: 0;
|
||
}
|
||
|
||
/deep/.bar {
|
||
height: 5px;
|
||
margin-top: 10px;
|
||
}
|
||
|
||
/deep/.progress-bar .bar-single {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
/deep/.progress-bar .bar-double {
|
||
height: 100%;
|
||
}
|
||
|
||
/deep/.progress-bar .bar-interval {
|
||
width: 0;
|
||
}
|
||
|
||
/deep/.bar-text span {
|
||
display: none;
|
||
}
|
||
|
||
.bottomInfo {
|
||
display: flex;
|
||
margin-top: 9px;
|
||
|
||
p {
|
||
font-size: 12px;
|
||
color: #999999;
|
||
margin-left: 10px;
|
||
|
||
text {
|
||
margin-left: 4px;
|
||
}
|
||
}
|
||
|
||
p:nth-of-type(1) {
|
||
text {
|
||
color: #0067CF;
|
||
}
|
||
}
|
||
|
||
p:nth-of-type(2) {
|
||
text {
|
||
color: #FC4F00;
|
||
}
|
||
}
|
||
}
|
||
|
||
.tjHead {
|
||
width: 100%;
|
||
height: 87px;
|
||
background-color: #fff;
|
||
border-radius: 4px;
|
||
padding: 16px 15px;
|
||
position: relative;
|
||
|
||
.imgBox {
|
||
width: 20px;
|
||
height: 20px;
|
||
position: absolute;
|
||
right: 0;
|
||
bottom: 0;
|
||
}
|
||
}
|
||
|
||
.tjInfo {
|
||
width: calc(100% - 32px);
|
||
background: #F7F7F7;
|
||
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.10);
|
||
margin: 16px;
|
||
padding: 5px 16px;
|
||
position: relative;
|
||
border-radius: 4px;
|
||
|
||
.imgBox {
|
||
width: 20px;
|
||
height: 20px;
|
||
position: absolute;
|
||
right: 0;
|
||
bottom: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
.itemBox {
|
||
height: 465px;
|
||
overflow: scroll;
|
||
}
|
||
|
||
.itemList {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
padding: 0 12px;
|
||
|
||
.exp {
|
||
// width: 100%;
|
||
width: 49.5%;
|
||
margin-bottom: 15px;
|
||
background: #FFFFFF;
|
||
border-radius: 8px;
|
||
padding: 12px;
|
||
padding-right: 0;
|
||
position: relative;
|
||
|
||
.rowHead {
|
||
/deep/uni-checkbox .uni-checkbox-input {
|
||
width: 16px !important;
|
||
height: 16px !important;
|
||
}
|
||
}
|
||
|
||
.row {
|
||
display: flex;
|
||
padding: 5px 0;
|
||
|
||
.title {
|
||
display: flex;
|
||
font-size: 16px;
|
||
color: #23262E;
|
||
font-weight: bold;
|
||
|
||
.titleImg {
|
||
width: 18px;
|
||
height: 18px;
|
||
margin-right: 5px;
|
||
margin-top: 2px;
|
||
}
|
||
}
|
||
|
||
.schedule {
|
||
padding: 5px 8px;
|
||
background: #F7F7F7;
|
||
margin-left: 8px;
|
||
display: flex;
|
||
|
||
.text {
|
||
font-size: 12px;
|
||
color: #999999;
|
||
}
|
||
|
||
.progressBox {
|
||
width: 50px;
|
||
margin-top: 5px;
|
||
margin: 5px 8px;
|
||
}
|
||
}
|
||
|
||
.planStatus {
|
||
width: 68px;
|
||
height: 26px;
|
||
border-radius: 13px 0 0 13px;
|
||
position: absolute;
|
||
right: 0;
|
||
top: 16px;
|
||
text-align: center;
|
||
line-height: 26px;
|
||
|
||
.text {
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
|
||
.planStatus0 {
|
||
background: #F1F8FF;
|
||
|
||
.text {
|
||
color: #0067CF;
|
||
}
|
||
}
|
||
|
||
.planStatus1 {
|
||
background: #F7F7F7;
|
||
|
||
.text {
|
||
color: #666;
|
||
}
|
||
}
|
||
|
||
.planStatus3 {
|
||
background: #E8FFF7;
|
||
|
||
.text {
|
||
color: #04B578;
|
||
}
|
||
}
|
||
|
||
.planStatus5 {
|
||
background: #FFF5F0;
|
||
|
||
.text {
|
||
color: #fc4f00;
|
||
}
|
||
}
|
||
|
||
|
||
.rowInfo {
|
||
display: flex;
|
||
flex-direction: column;
|
||
font-size: 14px;
|
||
width: 48%;
|
||
margin-top: 10px;
|
||
border-right: 1px solid #eee;
|
||
gap: 12px;
|
||
margin-left: 10px;
|
||
|
||
text:first-child {
|
||
color: #999999;
|
||
}
|
||
|
||
text:last-child {
|
||
color: #23262E;
|
||
}
|
||
}
|
||
|
||
.rowInfo:last-child {
|
||
border: none;
|
||
}
|
||
}
|
||
|
||
.xfBtn {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
padding: 10px 0;
|
||
border-top: 1px solid rgba(0, 0, 0, .1);
|
||
margin-top: 10px;
|
||
|
||
.btn {
|
||
padding: 8px 12px;
|
||
text-align: center;
|
||
color: #fff;
|
||
background: #0067CF;
|
||
border-radius: 4px;
|
||
font-size: 12px;
|
||
margin-right: 28px;
|
||
}
|
||
|
||
.stopbtn {
|
||
border: 1px solid #FC4F00;
|
||
color: #FC4F00;
|
||
background-color: #fff;
|
||
}
|
||
}
|
||
|
||
.expand {
|
||
position: absolute;
|
||
left: 47%;
|
||
bottom: -10px;
|
||
font-size: 12px;
|
||
color: #23262E;
|
||
background: #FFFFFF;
|
||
text-align: center;
|
||
line-height: 14px;
|
||
border: 1px solid #EEEEEE;
|
||
border-radius: 13px;
|
||
padding: 6px;
|
||
}
|
||
|
||
.details {
|
||
padding-right: 16px;
|
||
margin-top: 16px;
|
||
|
||
.itemDetails {
|
||
background: rgba(236, 242, 249, .7);
|
||
|
||
.detailsBox {
|
||
padding: 16px;
|
||
border-bottom: 1px dashed #D3DCE6;
|
||
}
|
||
|
||
.title {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
text {
|
||
font-size: 16px;
|
||
color: #23262E;
|
||
margin-top: 2px;
|
||
}
|
||
|
||
button {
|
||
wdith: 50px;
|
||
height: 25px;
|
||
text-align: center;
|
||
line-height: 25px;
|
||
color: #0067CF;
|
||
background: #FFFFFF;
|
||
border: 1px solid #EEEEEE;
|
||
border-radius: 4px;
|
||
font-size: 14px;
|
||
margin: 0;
|
||
}
|
||
}
|
||
|
||
.info {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.cell {
|
||
margin-right: 15px;
|
||
margin-top: 10px;
|
||
|
||
text:first-child {
|
||
color: #999999;
|
||
}
|
||
|
||
text:last-child {
|
||
color: #23262E;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.pzPot {
|
||
width: 100%;
|
||
|
||
.title {
|
||
width: 100%;
|
||
height: 50px;
|
||
line-height: 50px;
|
||
font-size: 28px;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
border: 1px solid #000;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.ul {
|
||
width: 100%;
|
||
margin-bottom: 20px;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
border: 1px solid #000;
|
||
border-top: none;
|
||
box-sizing: border-box;
|
||
|
||
.li {
|
||
width: 25%;
|
||
height: 30px;
|
||
line-height: 30px;
|
||
display: flex;
|
||
border: 1px solid #000;
|
||
border-top: none;
|
||
border-left: none;
|
||
box-sizing: border-box;
|
||
|
||
.xuhao {
|
||
width: 20px;
|
||
text-align: center;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.name {
|
||
flex: 1;
|
||
text-align: center;
|
||
border: 1px solid #000;
|
||
box-sizing: border-box;
|
||
border-top: none;
|
||
border-bottom: none;
|
||
}
|
||
|
||
.color {
|
||
flex: 1;
|
||
box-sizing: border-box;
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
.imgTable {
|
||
margin-top: 20px;
|
||
|
||
.title {
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.nr {
|
||
margin: 10px 0;
|
||
font-size: 16px;
|
||
}
|
||
|
||
.imgLi {
|
||
display: flex;
|
||
position: relative;
|
||
|
||
.shipImg {
|
||
width: 100%;
|
||
height: 171px;
|
||
}
|
||
|
||
.maskBox {
|
||
width: calc(100% - 200px);
|
||
height: 150px;
|
||
background-color: transparent;
|
||
display: flex;
|
||
position: absolute;
|
||
top: 11px;
|
||
left: 60px;
|
||
|
||
.testLine {
|
||
flex: 1;
|
||
height: 100%;
|
||
border-left: 1px solid #999;
|
||
}
|
||
|
||
.testLine:first-child {
|
||
border-left: none;
|
||
}
|
||
|
||
.testInfo {
|
||
height: 30px;
|
||
background-color: #0067CF;
|
||
}
|
||
}
|
||
|
||
.heightBox {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
margin-left: 10px;
|
||
}
|
||
|
||
.imgSize {
|
||
width: 28px;
|
||
height: 28px;
|
||
position: absolute;
|
||
}
|
||
|
||
.leftTopImg {
|
||
transform: rotate(90deg);
|
||
top: 10px;
|
||
left: 8px;
|
||
}
|
||
|
||
.imgSize2 {
|
||
width: 100px;
|
||
height: 30px;
|
||
position: absolute;
|
||
}
|
||
|
||
.leftBotImg {
|
||
bottom: 10px;
|
||
left: 8px;
|
||
}
|
||
|
||
.topImg {
|
||
top: -5px;
|
||
left: 40%;
|
||
}
|
||
|
||
.botImg {
|
||
transform: rotate(180deg);
|
||
bottom: -6px;
|
||
left: 40%;
|
||
}
|
||
}
|
||
|
||
.tableHead {
|
||
margin-top: 10px;
|
||
height: 50px;
|
||
line-height: 50px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 0 12px;
|
||
font-size: 20px;
|
||
border: 1px solid #f2f2f2;
|
||
}
|
||
|
||
.gray {
|
||
background-color: #fff;
|
||
}
|
||
|
||
|
||
.title {
|
||
line-height: 50px;
|
||
font-size: 21px;
|
||
font-weight: 900;
|
||
}
|
||
|
||
.text {
|
||
display: inline-block;
|
||
margin-right: 50px;
|
||
}
|
||
|
||
/deep/.table--border {
|
||
background-color: #fff;
|
||
}
|
||
}
|
||
|
||
.field {
|
||
padding: 20px;
|
||
background-color: #000;
|
||
|
||
.boxTop {
|
||
display: flex;
|
||
|
||
.title {
|
||
margin-right: 20px;
|
||
font-size: 18px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
color: #fff;
|
||
}
|
||
|
||
.option {
|
||
width: 200px;
|
||
}
|
||
}
|
||
|
||
.carTabs {
|
||
width: 100%;
|
||
background-color: #fff;
|
||
margin-top: 20px;
|
||
border-radius: 8px;
|
||
|
||
/deep/.tab {
|
||
border-radius: 8px !important;
|
||
}
|
||
|
||
.carList {
|
||
display: flex;
|
||
justify-content: space-around;
|
||
padding: 20px;
|
||
|
||
.carInfo {
|
||
width: 19%;
|
||
padding: 20px;
|
||
background-color: #ccc;
|
||
text-align: center;
|
||
border-radius: 6px;
|
||
}
|
||
}
|
||
|
||
.partsList {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-around;
|
||
padding: 20px;
|
||
|
||
.partsInfo {
|
||
width: 19%;
|
||
padding: 20px;
|
||
background-color: #ccc;
|
||
text-align: center;
|
||
border-radius: 6px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.infoTitle {
|
||
font-size: 16px;
|
||
color: #666;
|
||
}
|
||
|
||
.infoNum {
|
||
font-size: 28px;
|
||
}
|
||
|
||
.fpList {
|
||
width: 100%;
|
||
margin-top: 20px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.fpInfo {
|
||
width: 49%;
|
||
|
||
}
|
||
|
||
.fpTitle {
|
||
text-align: center;
|
||
background: #262626;
|
||
padding: 10px;
|
||
color: #fff;
|
||
}
|
||
|
||
.fpListInfo {
|
||
padding: 20px 10px;
|
||
background: #262626;
|
||
color: #fff;
|
||
margin-top: 10px;
|
||
|
||
.infoTop {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.infoTopTitle {
|
||
font-size: 18px;
|
||
font-weight: bold;
|
||
padding-left: 10px;
|
||
border-left: 5px solid #0079FE;
|
||
}
|
||
|
||
.titleRight {
|
||
display: flex;
|
||
|
||
.titleIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
background: #0079FE;
|
||
margin-left: 5px;
|
||
line-height: 16px;
|
||
text-align: center;
|
||
border-radius: 50%;
|
||
margin-top: 5px;
|
||
|
||
/deep/.van-icon {
|
||
transform: scale(0.8);
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
|
||
text {
|
||
color: #0079FE;
|
||
margin-top: 2px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.infoCarNum {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
margin-top: 10px;
|
||
|
||
text {
|
||
margin: 10px 20px;
|
||
}
|
||
}
|
||
|
||
.progressBox {
|
||
width: 100%;
|
||
}
|
||
|
||
.carInfoList {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
|
||
.carBrand {
|
||
width: 32%;
|
||
background-color: #2C2D2D;
|
||
padding: 10px;
|
||
margin-bottom: 10px;
|
||
|
||
.brandTitle {
|
||
color: #0079FE;
|
||
margin-bottom: 10px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.notListInfo {
|
||
.notTitle {
|
||
font-size: 22px;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
margin: 30px 0;
|
||
}
|
||
|
||
.infoTop {
|
||
text {
|
||
margin-right: 0;
|
||
}
|
||
}
|
||
|
||
text {
|
||
margin-right: 30px;
|
||
}
|
||
}
|
||
|
||
.tipInfo {
|
||
width: 100%;
|
||
font-size: 24px;
|
||
color: #5FE515;
|
||
font-weight: bold;
|
||
padding: 20px 0;
|
||
text-align: center;
|
||
background: #fff;
|
||
margin-top: 10px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.popupBox {
|
||
width: 400px;
|
||
background-color: #fff;
|
||
border-radius: 8px;
|
||
|
||
.popupTitle {
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
border-bottom: 1px solid #ccc;
|
||
padding: 15px 0;
|
||
}
|
||
|
||
.popupInfo {
|
||
display: flex;
|
||
margin-top: 20px;
|
||
line-height: 35px;
|
||
margin-left: 20px;
|
||
|
||
/deep/.superwei-combox {
|
||
border: none;
|
||
padding: 0;
|
||
}
|
||
|
||
/deep/.componentW100 {
|
||
width: 300px;
|
||
}
|
||
|
||
/deep/.uni-icons {
|
||
margin-right: 12px;
|
||
}
|
||
}
|
||
|
||
/deep/.uni-easyinput {
|
||
margin-top: 20px;
|
||
width: 460px;
|
||
margin-left: 20px;
|
||
}
|
||
|
||
/deep/.uni-select__input-placeholder {
|
||
text-align: left;
|
||
}
|
||
|
||
/deep/.uni-select__input-text {
|
||
text-align: left;
|
||
}
|
||
|
||
.popupBtn {
|
||
margin-top: 20px;
|
||
padding: 14px 0;
|
||
display: flex;
|
||
justify-content: center;
|
||
|
||
.btnList {
|
||
display: flex;
|
||
|
||
.button {
|
||
width: 125px;
|
||
height: 36px;
|
||
line-height: 36px;
|
||
margin-left: 15px;
|
||
border-radius: 4px;
|
||
}
|
||
|
||
.button:first-child {
|
||
background-color: #fff;
|
||
border: 1px solid #0067CF;
|
||
color: #0067CF;
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
.popupBox2 {
|
||
width: 500px;
|
||
}
|
||
}
|
||
</style> |