12.22
Panzihang
parent
c9bf3d10b4
commit
604bef43e9
|
|
@ -1,143 +0,0 @@
|
|||
<template>
|
||||
<view>
|
||||
<view
|
||||
id="_drag_button"
|
||||
class="drag"
|
||||
:style="'left: ' + left + 'px; top:' + top + 'px;'"
|
||||
@touchstart="touchstart"
|
||||
@touchmove.stop.prevent="touchmove"
|
||||
@touchend.stop="touchend"
|
||||
@click.stop.prevent="click"
|
||||
:class="{ transition: isDock && !isMove }"
|
||||
>
|
||||
<text>{{ text }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'drag-button',
|
||||
props: {
|
||||
isDock: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
existTabBar: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
top: 0,
|
||||
left: 0,
|
||||
width: 0,
|
||||
height: 0,
|
||||
offsetWidth: 0,
|
||||
offsetHeight: 0,
|
||||
windowWidth: 0,
|
||||
windowHeight: 0,
|
||||
isMove: true,
|
||||
edge: 10,
|
||||
text: '预约' //此处自定义按钮文字(1-3个汉字)
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
const sys = uni.getSystemInfoSync();
|
||||
|
||||
this.windowWidth = sys.windowWidth;
|
||||
this.windowHeight = sys.windowHeight;
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
this.existTabBar && (this.windowHeight -= 50);
|
||||
// #endif
|
||||
if (sys.windowTop) {
|
||||
this.windowHeight += sys.windowTop;
|
||||
}
|
||||
// console.log(sys);
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query
|
||||
.select('#_drag_button')
|
||||
.boundingClientRect(data => {
|
||||
this.width = data.width;
|
||||
this.height = data.height;
|
||||
this.offsetWidth = data.width / 2;
|
||||
this.offsetHeight = data.height / 2;
|
||||
this.left = this.windowWidth - this.width - this.edge;
|
||||
this.top = ((this.windowHeight - this.height - this.edge) * 3) / 4;
|
||||
})
|
||||
.exec();
|
||||
},
|
||||
methods: {
|
||||
click() {
|
||||
console.log(1);
|
||||
this.$emit('btnClick');
|
||||
},
|
||||
touchstart(e) {
|
||||
this.$emit('btnTouchstart');
|
||||
},
|
||||
touchmove(e) {
|
||||
// 单指触摸
|
||||
if (e.touches.length !== 1) {
|
||||
return false;
|
||||
}
|
||||
|
||||
this.isMove = true;
|
||||
|
||||
this.left = e.touches[0].clientX - this.offsetWidth;
|
||||
|
||||
let clientY = e.touches[0].clientY - this.offsetHeight;
|
||||
// #ifdef H5
|
||||
clientY += this.height;
|
||||
// #endif
|
||||
let edgeBottom = this.windowHeight - this.height - this.edge;
|
||||
|
||||
// 上下触及边界
|
||||
if (clientY < this.edge) {
|
||||
this.top = this.edge;
|
||||
} else if (clientY > edgeBottom) {
|
||||
this.top = edgeBottom;
|
||||
} else {
|
||||
this.top = clientY;
|
||||
}
|
||||
},
|
||||
touchend(e) {
|
||||
if (this.isDock) {
|
||||
let edgeRigth = this.windowWidth - this.width - this.edge;
|
||||
|
||||
if (this.left < this.windowWidth / 2 - this.offsetWidth) {
|
||||
this.left = this.edge;
|
||||
} else {
|
||||
this.left = edgeRigth;
|
||||
}
|
||||
}
|
||||
|
||||
this.isMove = false;
|
||||
|
||||
this.$emit('btnTouchend');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.drag {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
box-shadow: 0 0 6upx rgba(0, 0, 0, 0.4);
|
||||
color: $uni-text-color-inverse;
|
||||
width: 80upx;
|
||||
height: 80upx;
|
||||
border-radius: 50%;
|
||||
font-size: $uni-font-size-sm;
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
|
||||
&.transition {
|
||||
transition: left 0.3s ease, top 0.3s ease;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,78 +0,0 @@
|
|||
<template>
|
||||
<view>
|
||||
<scroll-view style="height: 800rpx;" scroll-y="true" class="padding-top-sm">
|
||||
<template v-if="!informData.length">
|
||||
<u-empty text="当前暂无公告信息" mode="news"></u-empty>
|
||||
</template>
|
||||
<view v-if="!noticeInfo">
|
||||
<block v-for="(item, index) in informData" :key="index">
|
||||
<view class="cu-bar padding solid" @click="clickInfo(item)">
|
||||
<view class="margin-left-sm" style="width: 440rpx;">
|
||||
<view class="text-df text-cut">{{ item.title }}</view>
|
||||
<view class="text-gray text-sm">
|
||||
<view class="text-cut">{{ item.content }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<text class="action"><text class="text-blue text-xs">查看</text></text>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="padding-sm" v-if="noticeInfo">
|
||||
<view class="text-left margin-xs text-bold">{{ informInfo.title }}</view>
|
||||
<view class="text-content info">{{ informInfo.content }}</view>
|
||||
<view class="text-right text-df margin-top">发布时间：{{ informInfo.date || '暂无' }}</view>
|
||||
<view class="text-center margin-sm" @click="noticeInfo = false"><text class="cu-btn bg-green sm radius">返回</text></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
var _this;
|
||||
export default {
|
||||
props: {
|
||||
noticeShow: false
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
noticeInfo: false,
|
||||
informData: [
|
||||
{
|
||||
title: '郑州暴雨后人间百态',
|
||||
content:
|
||||
'7月20日，河南省多地遭遇极端强降雨，持续强降雨造成道路、地铁等公共设施被淹，人员被困。有人被困商场，市民组成“人墙”喊口号合力救援；有人被困洪水抱树求救，社区工作人员扔条幅救援；行人不慎被水冲走，市民湍急水流中将人救下……众人在暴雨中积极自救和互助，每一个画面都让人动容。',
|
||||
date: '今天08:50 '
|
||||
},
|
||||
{
|
||||
title: '郑州暴雨期间酒店竟涨价10倍至2、3千元！希岸酒店道歉称系加盟店所为',
|
||||
content:
|
||||
'7月22日，希岸酒店总部就郑州高铁站涨价10倍一事发布致歉声明称，此次事件是该加盟店不遵守总部规定所致，酒店将积极配合相关部门监督检查，向该客人表示歉意。',
|
||||
date: ''
|
||||
}
|
||||
],
|
||||
informInfo: {}
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
/* this.xx = uni.getStorageSync("xx"); */
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
},
|
||||
|
||||
methods: {
|
||||
clickInfo(item) {
|
||||
this.noticeInfo = true;
|
||||
this.informInfo = item;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.info {
|
||||
text-indent: 2em;
|
||||
font-size: 28upx;
|
||||
text-align: justify;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
<template>
|
||||
<view>
|
||||
<view>
|
||||
<drag-button :isDock="true" :existTabBar="true" @btnClick="btnClick" />
|
||||
<u-modal v-model="noticeShow" title="公告" confirm-text="我已阅读" width="80%"><inform-com></inform-com></u-modal>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import dragButton from '@/components/drag-button';
|
||||
import dragButton from './components/drag-button';
|
||||
import informCom from './inform';
|
||||
var _this;
|
||||
|
||||
export default {
|
||||
components: {
|
||||
dragButton,
|
||||
informCom
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
noticeShow: false //公告显示
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
console.log(this.$u.config.v);
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
},
|
||||
onPullDownRefresh() {},
|
||||
methods: {
|
||||
btnClick() {
|
||||
this.noticeShow = true;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -1,605 +0,0 @@
|
|||
<template>
|
||||
<view>
|
||||
<uni-drawer :visible="visibleDrawer" :hideNoAnimate="showBackButton" mode="right" @close="closeDrawer()">
|
||||
<!-- #ifdef APP-PLUS -->
|
||||
<view class="iconfont icon-guanbi" v-if="showBackButton" @tap="closeDrawer()"></view>
|
||||
<!-- #endif -->
|
||||
<scroll-view class="drawer-list" scroll-y :style="{'height': drawerHeight, 'padding-top': fixTop}">
|
||||
<block v-for="(item, index) in menuList" :key="index">
|
||||
<!-- 单选、多选 isMutiple是否支持多选-->
|
||||
<view v-if="item.type === 'custom' && item.detailList.length">
|
||||
<view class="drawer-list-title flex justify-between">
|
||||
<view>
|
||||
{{item.title}}
|
||||
</view>
|
||||
<text v-if="item.detailList.length>showLenght"
|
||||
@tap="showMore(index)">{{item.showMoreList ? '收起' : '更多'}}</text>
|
||||
</view>
|
||||
<view class="draer-list-con">
|
||||
<template v-if="!item.showMoreList">
|
||||
<text
|
||||
:style="{background: textItem.isSelected ? color : '', color: textItem.isSelected ? '#ffffff' : ''}"
|
||||
v-if="idx<showLenght" v-for="(textItem, idx) in item.detailList" :key="idx"
|
||||
:class="textItem.isSelected ? 'on' : ''"
|
||||
@tap="itemTap(idx,item.detailList,item.key, item.isMutiple)">
|
||||
{{textItem.title}}
|
||||
</text>
|
||||
</template>
|
||||
<template v-else>
|
||||
<text
|
||||
:style="{background: textItem.isSelected ? color : '', color: textItem.isSelected ? '#ffffff' : ''}"
|
||||
v-for="(textItem, idx) in item.detailList" :key="idx"
|
||||
:class="textItem.isSelected ? 'on' : ''"
|
||||
@tap="itemTap(idx,item.detailList,item.key, item.isMutiple)">
|
||||
{{textItem.title}}
|
||||
</text>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 时间带时分秒范围选择 -->
|
||||
<view v-if="item.type === 'rangetime'">
|
||||
<view class="drawer-list-title flex justify-between">
|
||||
<view>
|
||||
{{item.title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="dateContent" @click="onShowDatePicker('rangetime', item.key, item)">
|
||||
<view>
|
||||
<template v-if="result[item.key] && result[item.key].length > 0">
|
||||
{{result[item.key][0]}}
|
||||
</template>
|
||||
</view>
|
||||
<view>
|
||||
<template v-if="result[item.key] && result[item.key].length > 0">
|
||||
{{result[item.key][1]}}
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 时间不带时分秒范围选择 -->
|
||||
<view v-if="item.type === 'range'">
|
||||
<view class="drawer-list-title flex justify-between">
|
||||
<view>
|
||||
{{item.title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="dateContent" @click="onShowDatePicker('range', item.key, item)">
|
||||
<view>
|
||||
<template v-if="result[item.key] && result[item.key].length > 0">
|
||||
{{result[item.key][0]}}-{{result[item.key][1]}}
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 时间选择 -->
|
||||
<view v-if="item.type === 'date'">
|
||||
<view class="drawer-list-title flex justify-between">
|
||||
<view>
|
||||
{{item.title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="dateContent" @click="onShowDatePicker('date', item.key, item)">
|
||||
<view>
|
||||
<template v-if="result[item.key]">
|
||||
{{result[item.key]}}
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 数值范围选择 -->
|
||||
<view v-if="item.type === 'rangenumber'">
|
||||
<view class="drawer-list-title flex justify-between">
|
||||
<view>
|
||||
{{item.title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="dateContent rangenumber-content flex">
|
||||
<view class="rangenumber-input">
|
||||
<input class="m-input" type="number" clearable v-model="result[item.minName || (item.key + 'Min')]"
|
||||
:placeholder="item.minPlaceholder || '最小值'"
|
||||
@blur="numberInputBlur(item)"></input>
|
||||
</view>
|
||||
<text>-</text>
|
||||
<view class="rangenumber-input">
|
||||
<input class="m-input" type="number" clearable v-model="result[item.maxName || (item.key + 'Max')]"
|
||||
:placeholder="item.maxPlaceholder || '最大值'"
|
||||
@blur="numberInputBlur(item)"></input>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 单输入框 -->
|
||||
<view v-if="item.type === 'singleinput'">
|
||||
<view class="drawer-list-title flex justify-between">
|
||||
<view>
|
||||
{{item.title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="dateContent">
|
||||
<view>
|
||||
<input class="m-input" clearable v-model="result[item.key]"
|
||||
:placeholder="item.placeholder || '请输入关键字'" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
<view class="filter-content-footer flex justify-center">
|
||||
<!-- #ifdef APP-PLUS-->
|
||||
<view v-if="showBackButton" class="filter-content-footer-item" :style="{color: '#ccc', 'border': '1rpx solid #ccc'}"
|
||||
@tap="closeDrawer()">
|
||||
<text>返回</text>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view class="filter-content-footer-item" :style="{color, 'border': `1rpx solid ${color}`}"
|
||||
@tap="resetClick">
|
||||
<text>重置</text>
|
||||
</view>
|
||||
<view class="filter-content-footer-item" :style="{'background': color}" @tap="sureClick">
|
||||
<text>确认</text>
|
||||
</view>
|
||||
</view>
|
||||
</uni-drawer>
|
||||
<mx-date-picker :show="showPicker" :color="color" :type="dateType" :value="dateValue" :show-tips="true"
|
||||
:show-seconds="true" @confirm="onSelected" @cancel="onSelected" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/***
|
||||
* 筛选组件，当前支持多选、单选
|
||||
* item.type (custom 单选、多选、rangetime 时间范围带时分秒、range 时间范围不带时分秒、rangenumber 数字范围)
|
||||
* item.isMutiple 是否支持多选
|
||||
* 筛选后返回格式{"listName1":[value,value](多选),"listName2":"value"（单选）,...}
|
||||
* rangenumber形式-可能为["",1]或[1,""]表示只有一个最大值或最小值
|
||||
***/
|
||||
import uniDrawer from '@/components/uni-drawer/uni-drawer.vue';
|
||||
import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue";
|
||||
export default {
|
||||
props: {
|
||||
list: {
|
||||
required: true,
|
||||
type: Array,
|
||||
default () {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: '#4D7BFE',
|
||||
},
|
||||
defaultValue: { //若有默认值则触发sureClick
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
},
|
||||
},
|
||||
showBackButton: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
list: {
|
||||
handler(val) {
|
||||
this.menuList = JSON.parse(JSON.stringify(val));
|
||||
this.resetResult();
|
||||
this.defaultValueFun();
|
||||
},
|
||||
deep: true // 可以深度检测到 obj 对象的属性值的变化
|
||||
}
|
||||
},
|
||||
components: {
|
||||
uniDrawer,
|
||||
MxDatePicker
|
||||
},
|
||||
beforeCreate() {
|
||||
Object.isEmpty = (object, except = []) => {
|
||||
if (!object) {
|
||||
return false;
|
||||
}
|
||||
for (let key in object) {
|
||||
if (except && except.includes(key)) {
|
||||
continue;
|
||||
}
|
||||
if (object.hasOwnProperty(key)) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
};
|
||||
Date.prototype.Format = function(fmt) { //author: meizz
|
||||
var o = {
|
||||
"M+": this.getMonth() + 1, //月份
|
||||
"d+": this.getDate(), //日
|
||||
"h+": this.getHours(), //小时
|
||||
"m+": this.getMinutes(), //分
|
||||
"s+": this.getSeconds(), //秒
|
||||
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
|
||||
"S": this.getMilliseconds() //毫秒
|
||||
};
|
||||
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1
|
||||
.length));
|
||||
for (var k in o)
|
||||
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[
|
||||
k]) : (("00" + o[
|
||||
k]).substr(("" + o[k]).length)));
|
||||
return fmt;
|
||||
};
|
||||
String.prototype.replaceAll = function(oldValue, newValue) { return this.toString().replace(new RegExp(oldValue, 'gm'), newValue); }
|
||||
},
|
||||
created() {
|
||||
this.menuList = JSON.parse(JSON.stringify(this.list));
|
||||
this.resetResult();
|
||||
uni.getSystemInfo({
|
||||
success: (res) => {
|
||||
let windowHeight = res.windowHeight;
|
||||
// #ifdef H5
|
||||
if (!(this.$IsWeixin || this.$IsAlipay || this.$IsCloudPay)) {
|
||||
let thirdApp = getApp().globalData.options?.thirdApp;
|
||||
if (thirdApp && thirdApp.hideNavBar) {
|
||||
// 第三方App使用App原生导航栏
|
||||
} else {
|
||||
this.fixTop = (res.statusBarHeight || 0) + 'px';
|
||||
}
|
||||
}
|
||||
windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body
|
||||
.clientHeight || res.windowHeight;
|
||||
// #endif
|
||||
this.drawerHeight = (windowHeight - uni.upx2px(120)) + 'px';
|
||||
// uni.showModal({
|
||||
// content: `model: ${res.model}`,
|
||||
// })
|
||||
}
|
||||
});
|
||||
},
|
||||
mounted() {
|
||||
this.defaultValueFun();
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
menuList: [],
|
||||
visibleDrawer: false,
|
||||
menuKey: 1,
|
||||
showLenght: 6,
|
||||
drawerHeight: '500px',
|
||||
selectDetailList: [],
|
||||
result: {},
|
||||
showPicker: false,
|
||||
dateType: 'rangetime',
|
||||
dateValue: '',
|
||||
fixTop: '0px'
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
defaultValueFun() {
|
||||
//如果有默认值，则赋值后调用sureClick通知父组件更新
|
||||
if (!Object.isEmpty(this.defaultValue)) {
|
||||
const value = this.defaultValue;
|
||||
const list = JSON.parse(JSON.stringify(this.menuList));
|
||||
for (let key in value) {
|
||||
for (let i = 0; i < list.length; i++) {
|
||||
if (list[i].key === key) {
|
||||
if (list[i].type === 'custom') {
|
||||
list[i].detailList.map((item, index) => {
|
||||
if (Array.isArray(value[key]) && value[key].indexOf(item.value) > -1) {
|
||||
item.isSelected = true;
|
||||
} else if (value[key] == item.value) {
|
||||
item.isSelected = true;
|
||||
}
|
||||
return item;
|
||||
})
|
||||
continue;
|
||||
}
|
||||
if (list[i].type === 'range' || list[i].type === 'rangetime' || list[i].type === 'rangenumber' && Array.isArray(value[key]) && value[key].length === 2) {
|
||||
this.result[key] = value[key];
|
||||
this.result[list[i].minName || (list[i].key + 'Min')] = value[key][0];
|
||||
this.result[list[i].maxName || (list[i].key + 'Max')] = value[key][1];
|
||||
continue;
|
||||
}
|
||||
if (list[i].type === 'date' || list[i].type === 'singleinput' && value[key]) {
|
||||
this.result[key] = value[key];
|
||||
continue;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (this.defaultRefeshTimer) {
|
||||
clearTimeout(this.defaultRefesh·Timer);
|
||||
}
|
||||
this.defaultRefeshTimer = setTimeout(() => {
|
||||
console.log('筛选默认值触发')
|
||||
this.menuList = list;
|
||||
this.sureClick();
|
||||
}, 200);
|
||||
}
|
||||
},
|
||||
|
||||
resetResult() {
|
||||
this.result = this.commonResultObj();
|
||||
},
|
||||
commonResultObj() {
|
||||
let obj = {};
|
||||
this.menuList.map((item) => {
|
||||
switch(item.type) {
|
||||
case "custom":
|
||||
item.isMutiple ? obj[item.key] = [] : obj[item.key] = '';
|
||||
item.detailList.forEach(dListItem => {
|
||||
dListItem.isSelected = dListItem.isSelected || false;
|
||||
});
|
||||
break;
|
||||
case 'range':
|
||||
case 'rangetime':
|
||||
case 'rangenumber':
|
||||
this.result[item.key] = [];
|
||||
this.result[item.minName || (item.key + 'Min')] = '';
|
||||
this.result[item.maxName || (item.key + 'Max')] = '';
|
||||
break;
|
||||
default:
|
||||
obj[item.key] = '';
|
||||
}
|
||||
})
|
||||
return obj;
|
||||
},
|
||||
//筛选项选中或取消
|
||||
itemTap(index, list, key, isMutiple) {
|
||||
if (isMutiple == true) {
|
||||
list[index].isSelected = !list[index].isSelected;
|
||||
if (list[index].isSelected) {
|
||||
this.result[key].push(list[index].value);
|
||||
} else {
|
||||
list[index].isSelected = false;
|
||||
var idx = this.result[key].indexOf(list[index].value);
|
||||
this.result[key].splice(idx, 1);
|
||||
}
|
||||
} else {
|
||||
this.result[key] = list[index].isSelected ? '' : list[index].value;
|
||||
for (let i = 0; i < list.length; i++) {
|
||||
if (index == i && !list[i].isSelected) {
|
||||
list[i].isSelected = true
|
||||
} else {
|
||||
list[i].isSelected = false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// #ifdef H5 || APP-PLUS
|
||||
this.$forceUpdate();
|
||||
// #endif
|
||||
},
|
||||
|
||||
sureClick() {
|
||||
this.menuList.forEach(menu => {
|
||||
let list = menu.detailList || [];
|
||||
if (menu.type == 'custom' && list.length > 0) {
|
||||
let selectedValueList = [];
|
||||
list.forEach(item => {
|
||||
if (item.isSelected) {
|
||||
selectedValueList.push(item.value);
|
||||
}
|
||||
});
|
||||
|
||||
if (menu.isMutiple == true) {
|
||||
this.result[menu.key] = selectedValueList;
|
||||
} else {
|
||||
this.result[menu.key] = selectedValueList[0] || '';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
let str_result = {};
|
||||
let hasChoose = false;
|
||||
for (let key in this.result) {
|
||||
if (typeof this.result[key] == 'object') {
|
||||
str_result[key] = this.result[key].join(',');
|
||||
if (!hasChoose) {
|
||||
hasChoose = this.result[key].join(',') !== '' ? true : false;
|
||||
}
|
||||
} else {
|
||||
str_result[key] = this.result[key];
|
||||
if (!hasChoose) {
|
||||
hasChoose = this.result[key] !== '' ? true : false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.$emit("result", {
|
||||
'str_result': str_result,
|
||||
'result': this.result,
|
||||
'hasChoose': hasChoose,
|
||||
'visibleDrawer': false
|
||||
});
|
||||
},
|
||||
resetClick() {
|
||||
this.minNumber = '';
|
||||
this.maxNumber = '';
|
||||
for (let key in this.result) {
|
||||
if (typeof this.result[key] === 'object') {
|
||||
this.result[key] = [];
|
||||
} else {
|
||||
this.result[key] = '';
|
||||
}
|
||||
}
|
||||
for (let i = 0; i < this.menuList.length; i++) {
|
||||
if (this.menuList[i].type === 'custom') {
|
||||
for (let j = 0; j < this.menuList[i].detailList.length; j++) {
|
||||
this.menuList[i].detailList[j].isSelected = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
// #ifdef H5 || APP-PLUS
|
||||
this.$forceUpdate();
|
||||
// #endif
|
||||
},
|
||||
closeDrawer() {
|
||||
this.visibleDrawer = false;
|
||||
// #ifdef APP-PLUS
|
||||
this.$emit("result", {
|
||||
type: 1,
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
|
||||
showMore(index) {
|
||||
this.menuList[index].showMoreList = !this.menuList[index].showMoreList;
|
||||
++this.menuKey;
|
||||
// #ifdef H5 || APP-NVUE
|
||||
this.$forceUpdate();
|
||||
// #endif
|
||||
},
|
||||
|
||||
onShowDatePicker(type, key, item) { //显示
|
||||
this.dateType = type;
|
||||
this.dateValue = this.result[key] || '';
|
||||
this.showPicker = true;
|
||||
this.tempKey = key;
|
||||
this.item = item;
|
||||
},
|
||||
|
||||
onSelected(e, key) { //选择
|
||||
this.showPicker = false;
|
||||
if (e) {
|
||||
this.result[this.tempKey] = e.value;
|
||||
if (e.value && e.value.length && this.item && this.item.type !== 'date') {
|
||||
let item = this.item;
|
||||
this.result[item.minName || (item.key + 'Min')] = e.value[0].replaceAll('/', '-');
|
||||
this.result[item.maxName || (item.key + 'Max')] = e.value[1].replaceAll('/', '-');
|
||||
}
|
||||
//选择的值
|
||||
console.log('value => ' + e.value);
|
||||
//原始的Date对象
|
||||
console.log('date => ' + e.date);
|
||||
}
|
||||
},
|
||||
|
||||
numberInputBlur(item) {
|
||||
let minNumber = this.result[item.minName || (item.key + 'Min')];
|
||||
let maxNumber = this.result[item.maxName || (item.key + 'Max')];
|
||||
if (minNumber != '' && maxNumber != '' && parseFloat(minNumber) > parseFloat(maxNumber)) {
|
||||
let temp = minNumber;
|
||||
this.result[item.minName || (item.key + 'Min')] = maxNumber;
|
||||
this.result[item.maxName || (item.key + 'Max')] = temp;
|
||||
}
|
||||
this.result[item.key] = [];
|
||||
this.result[item.key].push(minNumber && parseFloat(minNumber));
|
||||
this.result[item.key].push(maxNumber && parseFloat(maxNumber));
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.justify-between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
view,
|
||||
scroll-view,
|
||||
swiper,
|
||||
button,
|
||||
input,
|
||||
textarea,
|
||||
label,
|
||||
navigator,
|
||||
image {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 筛选样式 */
|
||||
.drawer-list {
|
||||
padding: 0 20rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
input {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.drawer-list .drawer-list-title {
|
||||
font-size: 34rpx;
|
||||
font-weight: 400;
|
||||
line-height: 48rpx;
|
||||
margin: 38rpx 0 18rpx;
|
||||
color: rgba(34, 34, 34, 1);
|
||||
}
|
||||
|
||||
.drawer-list .drawer-list-title>text {
|
||||
font-size: 26rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.drawer-list .draer-list-con>text {
|
||||
background: rgba(93, 92, 254, 0.1);
|
||||
border-radius: 28px;
|
||||
color: #666666;
|
||||
font-size: 28rpx;
|
||||
padding: 10rpx 28rpx;
|
||||
margin: 10rpx 10rpx 10rpx 0;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.filter-content-footer-item {
|
||||
flex: 1;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
text-align: center;
|
||||
border-radius: 8rpx;
|
||||
margin: 14rpx;
|
||||
color: #FFFFFF;
|
||||
|
||||
}
|
||||
|
||||
.picker {
|
||||
z-index: 99999 !important;
|
||||
}
|
||||
|
||||
.dateContent {
|
||||
&>view {
|
||||
background: rgba(244, 244, 244, 1);
|
||||
border-radius: 8rpx;
|
||||
width: 100%;
|
||||
height: 64rpx;
|
||||
line-height: 64rpx;
|
||||
margin-bottom: 12rpx;
|
||||
padding: 0 12rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.rangenumber-content {
|
||||
&>text {
|
||||
display: inline-block;
|
||||
width: 10%;
|
||||
text-align: center;
|
||||
height: 64rpx;
|
||||
line-height: 64rpx;
|
||||
}
|
||||
|
||||
.rangenumber-input {
|
||||
width: 45%;
|
||||
display: inline-block;
|
||||
padding: 0 12rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.m-input {
|
||||
height: 64rpx;
|
||||
line-height: 64rpx;
|
||||
}
|
||||
|
||||
::v-deep .picker {
|
||||
z-index: 999;
|
||||
}
|
||||
.icon-guanbi {
|
||||
position: fixed;
|
||||
top: 40rpx;
|
||||
right: 40rpx;
|
||||
z-index: 1000;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -30,7 +30,7 @@
|
|||
</view>
|
||||
<view class="borTop">
|
||||
<view class="borHead">
|
||||
<image src="../../static/images/gqIcon.png" mode=""></image>
|
||||
<image src="../../static/images/gqIcon.png" mode="" style="margin-top: 5px;"></image>
|
||||
<p>请选择港区</p>
|
||||
</view>
|
||||
<view class="borContent">
|
||||
|
|
@ -48,22 +48,6 @@
|
|||
<text>数据库管理</text>
|
||||
</view> -->
|
||||
</view>
|
||||
<uni-popup ref="popup" background-color="#fff" @maskClick="close">
|
||||
<view class="popupBox">
|
||||
<view class="popupTitle">
|
||||
请选择港区
|
||||
</view>
|
||||
<view class="ul">
|
||||
<view class="li" v-for="(item,index) in portList" :key="index"
|
||||
:class="{active:activeIndex == index}" @click="selectPort(item,index)">
|
||||
<text>{{item.pamName}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btnBox">
|
||||
<button class="btn" type="primary" @click="toGo">确 定</button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
<uni-popup ref="popup2" type="dialog">
|
||||
<uni-popup-dialog confirmText="确定" content="是否退出登录？" @close="close2"
|
||||
@confirm="outConfirm"></uni-popup-dialog>
|
||||
|
|
@ -226,11 +210,6 @@
|
|||
})
|
||||
}
|
||||
}
|
||||
// if (this.portList.length > 0) {
|
||||
// this.$refs.popup.open(this.type)
|
||||
// this.portId = this.portList[this.activeIndex].pamId
|
||||
// this.portName = this.portList[this.activeIndex].pamName
|
||||
// }
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
@ -352,7 +331,6 @@
|
|||
// 点击切换港区
|
||||
tabsPort(type) {
|
||||
this.type = type
|
||||
this.$refs.popup.open(type)
|
||||
this.lotusLoadingData.isShow = true
|
||||
this.initData()
|
||||
},
|
||||
|
|
@ -380,24 +358,18 @@
|
|||
}
|
||||
uni.setStorageSync('portObj', portObj);
|
||||
uni.setStorageSync('selectPortIndex', this.activeIndex)
|
||||
this.$refs.popup.close()
|
||||
this.infoType = false
|
||||
uni.showToast({
|
||||
icon: 'success',
|
||||
title: `切换到${this.portName}`
|
||||
});
|
||||
uni.navigateTo({
|
||||
uni.reLaunch({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭弹框
|
||||
close() {
|
||||
this.$refs.popup.close()
|
||||
this.portList = []
|
||||
},
|
||||
// 点击退出登录
|
||||
outLogin() {
|
||||
this.$refs.popup2.open()
|
||||
|
|
@ -600,66 +572,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.popupBox {
|
||||
width: 280px;
|
||||
height: 320px;
|
||||
|
||||
.popupTitle {
|
||||
width: 100%;
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
color: #23262E;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.ul {
|
||||
padding: 30px;
|
||||
height: 213px;
|
||||
overflow: scroll;
|
||||
|
||||
.li {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
border: 1px solid #ccc;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #0079fe;
|
||||
border-color: #0079fe;
|
||||
}
|
||||
}
|
||||
|
||||
.btnBox {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
border-radius: 0 0 16px 16px;
|
||||
|
||||
.btn {
|
||||
width: 170px;
|
||||
font-size: 16px;
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
height: 36px;
|
||||
line-height: 18px;
|
||||
background-color: #fff;
|
||||
border: 1px solid rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
.btn:last-child {
|
||||
color: #fff;
|
||||
background-color: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.message {
|
||||
width: 400px;
|
||||
padding: 30px;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<view class="headInfo">
|
||||
<view>
|
||||
<uni-icons class="icon" type="back" size="24" @click="toBack" />
|
||||
<uni-icons class="icon" type="back" size="16" @click="toBack" />
|
||||
<text @click="tabsPort('center')">{{title}}</text>
|
||||
<uni-icons class="bottom" type="bottom" size="18" v-if="type" />
|
||||
</view>
|
||||
|
|
@ -160,7 +160,7 @@
|
|||
},
|
||||
toBack() {
|
||||
if (this.url != "") {
|
||||
uni.navigateTo({
|
||||
uni.redirectTo({
|
||||
url: `${this.url}`
|
||||
})
|
||||
} else {
|
||||
|
|
@ -199,9 +199,12 @@
|
|||
margin-left: 6px;
|
||||
}
|
||||
|
||||
/deep/.uni-popup .uni-popup__wrapper {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.popupBox {
|
||||
min-width: 500px;
|
||||
height: 300px;
|
||||
|
||||
.popupTitle {
|
||||
width: 100%;
|
||||
|
|
@ -210,22 +213,22 @@
|
|||
text-align: center;
|
||||
font-size: 18px;
|
||||
color: #23262E;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.ul {
|
||||
padding: 30px;
|
||||
height: 192px;
|
||||
max-height: 310px;
|
||||
overflow: scroll;
|
||||
|
||||
.li {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
text-align: center;
|
||||
border: 1px solid #ccc;
|
||||
border: 1px solid #e7e7e7;
|
||||
margin-bottom: 10px;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.active {
|
||||
|
|
@ -235,7 +238,7 @@
|
|||
}
|
||||
|
||||
.btnBox {
|
||||
height: 40px;
|
||||
height: 46px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
|
@ -245,7 +248,7 @@
|
|||
width: 170px;
|
||||
font-size: 16px;
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
margin: 5px;
|
||||
height: 36px;
|
||||
line-height: 18px;
|
||||
background-color: #fff;
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 159 KiB |
|
|
@ -1,241 +0,0 @@
|
|||
<template>
|
||||
<view class="uni-combox">
|
||||
<view v-if="label" class="uni-combox__label" :style="labelStyle">
|
||||
<text>{{label}}</text>
|
||||
</view>
|
||||
<view class="uni-combox__input-box">
|
||||
<input class="uni-combox__input" type="text" :placeholder="placeholder" v-model="inputVal" @input="onInput" @focus="onFocus" @blur="onBlur" />
|
||||
<!-- <uni-icons class="uni-combox__input-arrow" type="arrowdown" size="14" @click="toggleSelector"></uni-icons> 源代码注释掉上下距离太高不好看,去掉源码中class-->
|
||||
<uni-icons type="arrowdown" size="18" v-if="inputVal===''" color="#999999" @click="toggleSelector"></uni-icons> <!-- 下箭头颜色#999999 -->
|
||||
<uni-icons type="clear" size="18" v-else color="#999999" @click="clearInputVal"></uni-icons> <!-- add by limeng 追加的代码片段用叉号图标快速清空输入框 -->
|
||||
<view class="uni-combox__selector" v-if="showSelector">
|
||||
<scroll-view scroll-y="true" class="uni-combox__selector-scroll">
|
||||
<view class="uni-combox__selector-empty" v-if="filterCandidatesLength === 0">
|
||||
<text>{{emptyTips}}</text>
|
||||
</view>
|
||||
<view class="uni-combox__selector-item" v-for="(item,index) in filterCandidates" :key="index" @click="onSelectorClick(index)">
|
||||
<text>{{item}}</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uniIcons from '@/uni_modules/uni-icons/components/uni-icons/uni-icons.vue'
|
||||
export default {
|
||||
name: 'uniCombox',
|
||||
components: {
|
||||
uniIcons
|
||||
},
|
||||
props: {
|
||||
label: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
labelWidth: {
|
||||
type: String,
|
||||
default: 'auto'
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
/** 不再需要这个属性
|
||||
candidates: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},*/
|
||||
//add by limeng 20210702 增加 map 类型的属性
|
||||
candidatesMap: {
|
||||
type: Map,//这个类型会被警告但是不影响使用
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
emptyTips: {
|
||||
type: String,
|
||||
default: '无匹配项'
|
||||
},
|
||||
value: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showSelector: false,
|
||||
inputVal: '', //输入框中输入的字符
|
||||
inputValId: '',//add by limeng 真实往后台传递的下拉id标识(比如项目id)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
labelStyle() {
|
||||
if (this.labelWidth === 'auto') {
|
||||
return {}
|
||||
}
|
||||
return {
|
||||
width: this.labelWidth
|
||||
}
|
||||
},
|
||||
filterCandidates() {
|
||||
//从candidatesMap 取值遍历所有key并赋值给内部变量candidates这个数组
|
||||
var candidates = [];//数组清空
|
||||
this.candidatesMap.forEach(function(value, key){
|
||||
var key = key;
|
||||
candidates.push(key);//获取的值给内部变量赋值
|
||||
})
|
||||
|
||||
return candidates.filter((item) => {
|
||||
return item.indexOf(this.inputVal) > -1
|
||||
})
|
||||
},
|
||||
filterCandidatesLength() {
|
||||
return this.filterCandidates.length
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
value: {
|
||||
handler(newVal) {
|
||||
this.inputVal = newVal
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
toggleSelector() {
|
||||
this.showSelector = !this.showSelector
|
||||
},
|
||||
onFocus() {
|
||||
this.showSelector = true
|
||||
},
|
||||
onBlur() {
|
||||
/**update by limeng 20210710 上午周六
|
||||
离开输入框焦点的时候输入框里的内容必须包含在下拉框列表中，
|
||||
否则输入框内容是用户瞎写的没有意义，后台也无法识别
|
||||
因此,强制用户必须以选中的为准
|
||||
备注：提供输入功能仅仅是为了匹配合适的下拉选项，但不能以输入的值为准,必须以选中的为准
|
||||
*/
|
||||
//if(this.candidates.indexOf(this.inputVal) > -1){ //则包含该元素
|
||||
if(this.filterCandidates.indexOf(this.inputVal) > -1){ //则包含该元素
|
||||
//alert("你输值在列表中");
|
||||
//关闭下拉(原代码保留)
|
||||
setTimeout(() => {
|
||||
this.showSelector = false
|
||||
}, 50)
|
||||
}else {
|
||||
//alert("你输的值不在列表中，此时下拉列表不能关闭，直到用户选中才能关闭下拉");
|
||||
return;
|
||||
}
|
||||
},
|
||||
onSelectorClick(index) {//index 只是这个数组中顺序的索引值比如 1,2,3...,和map中的key value没有关系
|
||||
this.inputVal = this.filterCandidates[index]//选中后给控件的输入框赋值
|
||||
this.inputValId = this.candidatesMap.get(this.inputVal);//根据输入框内容反查出对应的id或者code(以便提交到后台)
|
||||
this.showSelector = false;//选中后关闭下拉列表
|
||||
this.$emit('input', this.inputVal);//拿到子组件的值(name)赋值给父组件的input事件,即父组件的v-model绑定的属性
|
||||
this.$emit("setId",this.inputValId);//将name对应的id或者code返回给父组件,通过调用父组件的setId方法传值给父组件data中声明的变量
|
||||
},
|
||||
onInput() {
|
||||
setTimeout(() => {
|
||||
this.$emit('input', this.inputVal)
|
||||
})
|
||||
},
|
||||
clearInputVal(){
|
||||
this.inputVal='';
|
||||
this.inputValId = '';//同时清空输入框id
|
||||
this.$emit("setId",'');//将父组件的值也置为空
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.uni-combox {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
height: 40px;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
/* border-bottom: solid 1px #DDDDDD;
|
||||
*/
|
||||
}
|
||||
|
||||
.uni-combox__label {
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
padding-right: 10px;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.uni-combox__input-box {
|
||||
position: relative;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex: 1;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.uni-combox__input {
|
||||
flex: 1;
|
||||
font-size: 33upx;/*16px*/
|
||||
height: 25px;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
.uni-combox__input-arrow {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.uni-combox__selector {
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
top: 42px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 0px;
|
||||
box-shadow: #DDDDDD 4px 4px 8px, #DDDDDD -4px -4px 8px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.uni-combox__selector-scroll {
|
||||
max-height: 500px;/*200px*/
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.uni-combox__selector::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-bottom: solid 6px #FFFFFF;
|
||||
border-right: solid 6px transparent;
|
||||
border-left: solid 6px transparent;
|
||||
left: 50%;
|
||||
top: -6px;
|
||||
margin-left: -6px;
|
||||
}
|
||||
|
||||
.uni-combox__selector-empty,
|
||||
.uni-combox__selector-item {
|
||||
/* #ifdef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
line-height: 50px;/*36px*/
|
||||
font-size: 33upx;/* 14px*/
|
||||
text-align: center;
|
||||
border-bottom: solid 1px #DDDDDD;
|
||||
margin: 0px 10px;
|
||||
}
|
||||
|
||||
.uni-combox__selector-empty:last-child,
|
||||
.uni-combox__selector-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,819 +0,0 @@
|
|||
<template>
|
||||
<view v-if="isShow" class="picker" @tap="onConfirm">
|
||||
<!-- 日期选择器 -->
|
||||
<view v-if="type!='time'" class="picker-modal">
|
||||
<view class="picker-modal-header">
|
||||
<view class="picker-icon picker-icon-zuozuo" :hover-stay-time="100" hover-class="picker-icon-active" @click.stop="onSetYear('-1')"></view>
|
||||
<view class="picker-icon picker-icon-zuo" :hover-stay-time="100" hover-class="picker-icon-active" @click.stop="onSetMonth('-1')"></view>
|
||||
<text class="picker-modal-header-title">{{title}}</text>
|
||||
<view class="picker-icon picker-icon-you" :hover-stay-time="100" hover-class="picker-icon-active" @click.stop="onSetMonth('+1')"></view>
|
||||
<view class="picker-icon picker-icon-youyou" :hover-stay-time="100" hover-class="picker-icon-active" @click.stop="onSetYear('+1')"></view>
|
||||
</view>
|
||||
<swiper class="picker-modal-body" :circular="true" :duration="200" :skip-hidden-item-layout="true" :current="calendarIndex" @change="onSwiperChange">
|
||||
<swiper-item class="picker-calendar" v-for="(calendar,calendarIndex2) in calendars" :key="calendarIndex2">
|
||||
<view class="picker-calendar-view" v-for="(week,index) in weeks" :key="index - 7">
|
||||
<view class="picker-calendar-view-item">{{week}}</view>
|
||||
</view>
|
||||
<view class="picker-calendar-view" v-for="(date,dateIndex) in calendar" :key="dateIndex" @click.stop="onSelectDate(date)">
|
||||
<!-- 背景样式 -->
|
||||
<view v-show="date.bgStyle.type" :class="'picker-calendar-view-'+date.bgStyle.type" :style="{background: date.bgStyle.background}"></view>
|
||||
<!-- 正常和选中样式 -->
|
||||
<view class="picker-calendar-view-item" :style="{opacity: date.statusStyle.opacity, color: date.statusStyle.color, background: date.statusStyle.background}">
|
||||
<text>{{date.title}}</text>
|
||||
</view>
|
||||
<!-- 小圆点样式 -->
|
||||
<view class="picker-calendar-view-dot" :style="{opacity: date.dotStyle.opacity, background: date.dotStyle.background}"></view>
|
||||
<!-- 信息样式 -->
|
||||
<view v-show="date.tips" class="picker-calendar-view-tips">{{date.tips}}</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<view class="picker-modal-footer">
|
||||
<view class="picker-modal-footer-info">
|
||||
<block v-if="isMultiSelect">
|
||||
<view class="picker-display">
|
||||
<text>{{beginText}}日期</text>
|
||||
<text class="picker-display-text">{{BeginTitle}}</text>
|
||||
<view v-if="isContainTime" class="picker-display-link" :hover-stay-time="100" hover-class="picker-display-link-active"
|
||||
:style="{color}" @click.stop="onShowTimePicker('begin')">{{BeginTimeTitle}}</view>
|
||||
</view>
|
||||
<view class="picker-display">
|
||||
<text>{{endText}}日期</text>
|
||||
<text class="picker-display-text">{{EndTitle}}</text>
|
||||
<view v-if="isContainTime" class="picker-display-link" :hover-stay-time="100" hover-class="picker-display-link-active"
|
||||
:style="{color}" @click.stop="onShowTimePicker('end')">{{EndTimeTitle}}</view>
|
||||
</view>
|
||||
</block>
|
||||
<block v-else>
|
||||
<view class="picker-display">
|
||||
<text>当前选择</text>
|
||||
<text class="picker-display-text">{{BeginTitle}}</text>
|
||||
<view v-if="isContainTime" class="picker-display-link" :hover-stay-time="100" hover-class="picker-display-link-active"
|
||||
:style="{color}" @click.stop="onShowTimePicker('begin')">{{BeginTimeTitle}}</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="picker-modal-footer-btn">
|
||||
<view class="picker-btn" :hover-stay-time="100" hover-class="picker-btn-active" @click.stop="onCancel">取消</view>
|
||||
<view class="picker-btn" :style="{color}" :hover-stay-time="100" hover-class="picker-btn-active" @click.stop="onConfirm">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 时间选择器 -->
|
||||
<view v-if="showTimePicker" class="picker">
|
||||
<view class="picker-modal picker-time">
|
||||
<view class="picker-modal-header">
|
||||
<text class="picker-modal-header-title">选择日期</text>
|
||||
</view>
|
||||
<picker-view class="picker-modal-time" indicator-class="picker-modal-time-item" :value="timeValue" @change.stop="onTimeChange">
|
||||
<picker-view-column>
|
||||
<view v-for="(v,i) in 24" :key="i">{{i<10?'0'+i:i}}时</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view v-for="(v,i) in 60" :key="i">{{i<10?'0'+i:i}}分</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column v-if="showSeconds">
|
||||
<view v-for="(v,i) in 60" :key="i">{{i<10?'0'+i:i}}秒</view>
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
<view class="picker-modal-footer">
|
||||
<view class="picker-modal-footer-info">
|
||||
<view class="picker-display">
|
||||
<text>当前选择</text>
|
||||
<text class="picker-display-text">{{PickerTimeTitle}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="picker-modal-footer-btn">
|
||||
<view class="picker-btn" :hover-stay-time="100" hover-class="picker-btn-active" @click.stop="onCancelTime">取消</view>
|
||||
<view class="picker-btn" :style="{color}" :hover-stay-time="100" hover-class="picker-btn-active" @click.stop="onConfirmTime">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 工具函数库
|
||||
*/
|
||||
const DateTools = {
|
||||
/**
|
||||
* 获取公历节日
|
||||
* @param date Date对象
|
||||
*/
|
||||
getHoliday(date) {
|
||||
let holidays = {
|
||||
'0101': '元旦',
|
||||
'0214': '情人',
|
||||
'0308': '妇女',
|
||||
'0312': '植树',
|
||||
'0401': '愚人',
|
||||
'0501': '劳动',
|
||||
'0504': '青年',
|
||||
'0601': '儿童',
|
||||
'0701': '建党',
|
||||
'0801': '建军',
|
||||
'0903': '抗日',
|
||||
'0910': '教师',
|
||||
'1001': '国庆',
|
||||
'1031': '万圣',
|
||||
'1224': '平安',
|
||||
'1225': '圣诞'
|
||||
};
|
||||
let value = this.format(date, 'mmdd');
|
||||
if (holidays[value]) return holidays[value];
|
||||
return false;
|
||||
},
|
||||
/**
|
||||
* 解析标准日期格式
|
||||
* @param s 日期字符串
|
||||
* @return 返回Date对象
|
||||
*/
|
||||
parse: s => new Date(s.replace(/(年|月|-)/g, '/').replace(/(日)/g, '')),
|
||||
/**
|
||||
* 比较日期是否为同一天
|
||||
* @param a Date对象
|
||||
* @param b Date对象
|
||||
* @return Boolean
|
||||
*/
|
||||
isSameDay: (a, b) => a.getMonth() == b.getMonth() && a.getFullYear() == b.getFullYear() && a.getDate() == b.getDate(),
|
||||
/**
|
||||
* 格式化Date对象
|
||||
* @param d 日期对象
|
||||
* @param f 格式字符串
|
||||
* @return 返回格式化后的字符串
|
||||
*/
|
||||
format(d, f) {
|
||||
var o = {
|
||||
"m+": d.getMonth() + 1,
|
||||
"d+": d.getDate(),
|
||||
"h+": d.getHours(),
|
||||
"i+": d.getMinutes(),
|
||||
"s+": d.getSeconds(),
|
||||
"q+": Math.floor((d.getMonth() + 3) / 3),
|
||||
};
|
||||
if (/(y+)/.test(f))
|
||||
f = f.replace(RegExp.$1, (d.getFullYear() + "").substr(4 - RegExp.$1.length));
|
||||
for (var k in o)
|
||||
if (new RegExp("(" + k + ")").test(f))
|
||||
f = f.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
|
||||
return f;
|
||||
},
|
||||
/**
|
||||
* 用于format格式化后的反解析
|
||||
* @param s 日期字符串
|
||||
* @param f 格式字符串
|
||||
* @return 返回Date对象
|
||||
*/
|
||||
inverse(s, f) {
|
||||
var o = {
|
||||
"y": '',
|
||||
"m": '',
|
||||
"d": '',
|
||||
"h": '',
|
||||
"i": '',
|
||||
"s": '',
|
||||
};
|
||||
let d = new Date();
|
||||
if (s.length != f.length) return d;
|
||||
for (let i in f)
|
||||
if (o[f[i]] != undefined) o[f[i]] += s[i];
|
||||
if (o.y) d.setFullYear(o.y.length < 4 ? (d.getFullYear() + '').substr(0, 4 - o.y.length) + o.y : o.y);
|
||||
o.m && d.setMonth(o.m - 1, 1);
|
||||
o.d && d.setDate(o.d - 0);
|
||||
o.h && d.setHours(o.h - 0);
|
||||
o.i && d.setMinutes(o.i - 0);
|
||||
o.s && d.setSeconds(o.s - 0);
|
||||
return d;
|
||||
},
|
||||
/**
|
||||
* 获取日历数组（42天）
|
||||
* @param date 日期对象或日期字符串
|
||||
* @param proc 处理日历(和forEach类似)，传递一个数组中的item
|
||||
* @return Array
|
||||
*/
|
||||
getCalendar(date, proc) {
|
||||
let it = new Date(date),
|
||||
calendars = [];
|
||||
it.setDate(1);
|
||||
it.setDate(it.getDate() - ((it.getDay() == 0 ? 7 : it.getDay()) - 1)); //偏移量
|
||||
for (let i = 0; i < 42; i++) {
|
||||
let tmp = {
|
||||
dateObj: new Date(it),
|
||||
title: it.getDate(),
|
||||
isOtherMonth: it.getMonth() < date.getMonth() || it.getMonth() > date.getMonth()
|
||||
};
|
||||
calendars.push(Object.assign(tmp, proc ? proc(tmp) : {}));
|
||||
it.setDate(it.getDate() + 1);
|
||||
}
|
||||
return calendars;
|
||||
},
|
||||
/**
|
||||
* 获取日期到指定的月份1号(不改变原来的date对象)
|
||||
* @param d Date对象
|
||||
* @param v 指定的月份
|
||||
* @return Date对象
|
||||
*/
|
||||
getDateToMonth(d, v) {
|
||||
let n = new Date(d);
|
||||
n.setMonth(v, 1);
|
||||
return n;
|
||||
},
|
||||
/**
|
||||
* 把时间数组转为时间字符串
|
||||
* @param t Array[时,分,秒]
|
||||
* @param showSecinds 是否显示秒
|
||||
* @return 字符串 时:分[:秒]
|
||||
*/
|
||||
formatTimeArray(t, s) {
|
||||
let r = [...t];
|
||||
if (!s) r.length = 2;
|
||||
r.forEach((v, k) => r[k] = ('0' + v).slice(-2));
|
||||
return r.join(':');
|
||||
}
|
||||
};
|
||||
|
||||
export default {
|
||||
props: {
|
||||
//颜色
|
||||
color: {
|
||||
type: String,
|
||||
default: '#409eff'
|
||||
},
|
||||
//是否显示秒 针对type为datetime或time时生效
|
||||
showSeconds: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//初始的值
|
||||
value: [String, Array],
|
||||
//类型date time datetime range rangetime
|
||||
type: {
|
||||
type: String,
|
||||
default: 'range'
|
||||
},
|
||||
//是否显示
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//初始格式
|
||||
format: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
//显示公历节日
|
||||
showHoliday: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
//显示提示
|
||||
showTips: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//开始文案 针对type为范围选择时生效
|
||||
beginText: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
//结束文案 针对type为范围选择时生效
|
||||
endText: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isShow: false, //是否显示
|
||||
isMultiSelect: false, //是否为多选
|
||||
isContainTime: false, //是否包含时间
|
||||
date: {}, //当前日期对象
|
||||
weeks: ["一", "二", "三", "四", "五", "六", "日"],
|
||||
title: '初始化', //标题
|
||||
calendars: [[],[],[]], //日历数组
|
||||
calendarIndex: 1, //当前日历索引
|
||||
checkeds: [], //选中的日期对象集合
|
||||
showTimePicker: false, //是否显示时间选择器
|
||||
timeValue: [0, 0, 0], //时间选择器的值
|
||||
timeType: 'begin', //当前时间选择的类型
|
||||
beginTime: [0, 0, 0], //当前所选的开始时间值
|
||||
endTime: [0, 0, 0], //当前所选的结束时间值
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
//设置值
|
||||
setValue(value) {
|
||||
this.date = new Date();
|
||||
this.checkeds = [];
|
||||
this.isMultiSelect = this.type.indexOf('range') >= 0;
|
||||
this.isContainTime = this.type.indexOf('time') >= 0;
|
||||
//将字符串解析为Date对象
|
||||
let parseDateStr = (str) => (this.format ? DateTools.inverse(str, this.format) : DateTools.parse(str));
|
||||
if (value) {
|
||||
if (this.isMultiSelect) {
|
||||
Array.isArray(value) && value.forEach((dateStr, index) => {
|
||||
let date = parseDateStr(dateStr);
|
||||
let time = [date.getHours(), date.getMinutes(), date.getSeconds()];
|
||||
if (index == 0) this.beginTime = time;
|
||||
else this.endTime = time;
|
||||
this.checkeds.push(date);
|
||||
});
|
||||
} else {
|
||||
if (this.type == 'time') {
|
||||
let date = parseDateStr('2019/1/1 ' + value);
|
||||
this.beginTime = [date.getHours(), date.getMinutes(), date.getSeconds()];
|
||||
this.onShowTimePicker('begin');
|
||||
} else {
|
||||
this.checkeds.push(parseDateStr(value));
|
||||
if (this.isContainTime) this.beginTime = [
|
||||
this.checkeds[0].getHours(),
|
||||
this.checkeds[0].getMinutes(),
|
||||
this.checkeds[0].getSeconds()
|
||||
];
|
||||
}
|
||||
}
|
||||
if (this.checkeds.length) this.date = new Date(this.checkeds[0]);
|
||||
} else {
|
||||
if (this.isContainTime) {
|
||||
this.beginTime = [this.date.getHours(), this.date.getMinutes(), this.date.getSeconds()];
|
||||
if (this.isMultiSelect) this.endTime = [...this.beginTime];
|
||||
}
|
||||
this.checkeds.push(new Date(this.date));
|
||||
}
|
||||
if (this.type != 'time') this.refreshCalendars(true);
|
||||
else this.onShowTimePicker('begin');
|
||||
},
|
||||
//改变年份
|
||||
onSetYear(value) {
|
||||
this.date.setFullYear(this.date.getFullYear() + parseInt(value));
|
||||
this.refreshCalendars(true);
|
||||
},
|
||||
//改变月份
|
||||
onSetMonth(value) {
|
||||
this.date.setMonth(this.date.getMonth() + parseInt(value));
|
||||
this.refreshCalendars(true);
|
||||
},
|
||||
//时间选择变更
|
||||
onTimeChange(e) {
|
||||
this.timeValue = e.detail.value;
|
||||
},
|
||||
//设置时间选择器的显示状态
|
||||
onShowTimePicker(type) {
|
||||
this.showTimePicker = true;
|
||||
this.timeType = type;
|
||||
this.timeValue = type == 'begin' ? [...this.beginTime] : [...this.endTime];
|
||||
},
|
||||
//处理日历
|
||||
procCalendar(item) {
|
||||
//定义初始样式
|
||||
item.statusStyle = {
|
||||
opacity: 1,
|
||||
color: item.isOtherMonth ? '#ddd' : '#000',
|
||||
background: 'transparent'
|
||||
};
|
||||
item.bgStyle = {
|
||||
type: '',
|
||||
background: 'transparent'
|
||||
};
|
||||
item.dotStyle = {
|
||||
opacity: 1,
|
||||
background: 'transparent'
|
||||
};
|
||||
item.tips = "";
|
||||
//标记今天的日期
|
||||
if (DateTools.isSameDay(new Date(), item.dateObj)) {
|
||||
item.statusStyle.color = this.color;
|
||||
if (item.isOtherMonth) item.statusStyle.opacity = 0.3;
|
||||
}
|
||||
//标记选中项
|
||||
this.checkeds.forEach(date => {
|
||||
if (DateTools.isSameDay(date, item.dateObj)) {
|
||||
item.statusStyle.background = this.color;
|
||||
item.statusStyle.color = '#fff';
|
||||
item.statusStyle.opacity = 1;
|
||||
if (this.isMultiSelect && this.showTips) item.tips = this.beginText;
|
||||
}
|
||||
});
|
||||
//节假日或今日的日期标点
|
||||
if (item.statusStyle.background != this.color) {
|
||||
let holiday = this.showHoliday ? DateTools.getHoliday(item.dateObj) : false;
|
||||
if (holiday || DateTools.isSameDay(new Date(), item.dateObj)) {
|
||||
item.title = holiday || item.title;
|
||||
item.dotStyle.background = this.color;
|
||||
if (item.isOtherMonth) item.dotStyle.opacity = 0.2;
|
||||
}
|
||||
} else {
|
||||
item.title = item.dateObj.getDate();
|
||||
}
|
||||
//有两个日期
|
||||
if (this.checkeds.length == 2) {
|
||||
if (DateTools.isSameDay(this.checkeds[0], item.dateObj)) { //开始日期
|
||||
item.bgStyle.type = 'bgbegin';
|
||||
}
|
||||
if (DateTools.isSameDay(this.checkeds[1], item.dateObj)) { //结束日期
|
||||
if (this.isMultiSelect && this.showTips) item.tips = item.bgStyle.type ? this.beginText + ' / ' + this.endText : this.endText;
|
||||
if (!item.bgStyle.type) { //开始日期不等于结束日期
|
||||
item.bgStyle.type = 'bgend';
|
||||
} else {
|
||||
item.bgStyle.type = '';
|
||||
}
|
||||
}
|
||||
if (!item.bgStyle.type && (+item.dateObj > +this.checkeds[0] && +item.dateObj < +this.checkeds[1])) { //中间的日期
|
||||
item.bgStyle.type = 'bg';
|
||||
item.statusStyle.color = this.color;
|
||||
}
|
||||
if (item.bgStyle.type) {
|
||||
item.bgStyle.background = this.color;
|
||||
item.dotStyle.opacity = 1;
|
||||
item.statusStyle.opacity = 1;
|
||||
}
|
||||
}
|
||||
},
|
||||
//刷新日历
|
||||
refreshCalendars(refresh = false) {
|
||||
let date = new Date(this.date);
|
||||
let before = DateTools.getDateToMonth(date, date.getMonth() - 1);
|
||||
let after = DateTools.getDateToMonth(date, date.getMonth() + 1);
|
||||
if (this.calendarIndex == 0) {
|
||||
if(refresh) this.calendars.splice(0, 1, DateTools.getCalendar(date, this.procCalendar));
|
||||
this.calendars.splice(1, 1, DateTools.getCalendar(after, this.procCalendar));
|
||||
this.calendars.splice(2, 1, DateTools.getCalendar(before, this.procCalendar));
|
||||
} else if (this.calendarIndex == 1) {
|
||||
this.calendars.splice(0, 1, DateTools.getCalendar(before, this.procCalendar));
|
||||
if(refresh) this.calendars.splice(1, 1, DateTools.getCalendar(date, this.procCalendar));
|
||||
this.calendars.splice(2, 1, DateTools.getCalendar(after, this.procCalendar));
|
||||
} else if (this.calendarIndex == 2) {
|
||||
this.calendars.splice(0, 1, DateTools.getCalendar(after, this.procCalendar));
|
||||
this.calendars.splice(1, 1, DateTools.getCalendar(before, this.procCalendar));
|
||||
if(refresh) this.calendars.splice(2, 1, DateTools.getCalendar(date, this.procCalendar));
|
||||
}
|
||||
this.title = DateTools.format(this.date, 'yyyy年mm月');
|
||||
},
|
||||
//滑块切换
|
||||
onSwiperChange(e) {
|
||||
this.calendarIndex = e.detail.current;
|
||||
let calendar = this.calendars[this.calendarIndex];
|
||||
this.date = new Date(calendar[22].dateObj); //取中间一天，保证是当前的月份
|
||||
this.refreshCalendars();
|
||||
},
|
||||
//选中日期
|
||||
onSelectDate(date) {
|
||||
if (~this.type.indexOf('range') && this.checkeds.length == 2) this.checkeds = [];
|
||||
else if (!(~this.type.indexOf('range')) && this.checkeds.length) this.checkeds = [];
|
||||
this.checkeds.push(new Date(date.dateObj));
|
||||
this.checkeds.sort((a, b) => a - b); //从小到大排序
|
||||
this.calendars.forEach(calendar => {
|
||||
calendar.forEach(this.procCalendar); //重新处理
|
||||
});
|
||||
},
|
||||
//时间选择取消
|
||||
onCancelTime() {
|
||||
this.showTimePicker = false;
|
||||
this.type == 'time' && this.onCancel();
|
||||
},
|
||||
//时间选择确定
|
||||
onConfirmTime() {
|
||||
if (this.timeType == 'begin') this.beginTime = this.timeValue;
|
||||
else this.endTime = this.timeValue;
|
||||
this.showTimePicker = false;
|
||||
this.type == 'time' && this.onConfirm();
|
||||
},
|
||||
//取消
|
||||
onCancel() {
|
||||
this.$emit('cancel', false);
|
||||
},
|
||||
//确定
|
||||
onConfirm() {
|
||||
let result = {
|
||||
value: null,
|
||||
date: null
|
||||
};
|
||||
//定义默认格式
|
||||
let defaultFormat = {
|
||||
'date': 'yyyy/mm/dd',
|
||||
'time': 'hh:ii' + (this.showSeconds ? ':ss' : ''),
|
||||
'datetime': ''
|
||||
};
|
||||
defaultFormat['datetime'] = defaultFormat.date + ' ' + defaultFormat.time;
|
||||
let fillTime = (date, timeArr) => {
|
||||
date.setHours(timeArr[0], timeArr[1]);
|
||||
if (this.showSeconds) date.setSeconds(timeArr[2]);
|
||||
};
|
||||
if (this.type == 'time') {
|
||||
let date = new Date();
|
||||
fillTime(date, this.beginTime);
|
||||
result.value = DateTools.format(date, this.format ? this.format : defaultFormat.time);
|
||||
result.date = date;
|
||||
} else {
|
||||
if (this.isMultiSelect) {
|
||||
let values = [],
|
||||
dates = [];
|
||||
if (this.checkeds.length < 2) return uni.showToast({
|
||||
icon: 'none',
|
||||
title: '请选择两个日期'
|
||||
});
|
||||
this.checkeds.forEach((date, index) => {
|
||||
let newDate = new Date(date);
|
||||
if (this.isContainTime) {
|
||||
let time = [this.beginTime, this.endTime];
|
||||
fillTime(newDate, time[index]);
|
||||
}
|
||||
values.push(DateTools.format(newDate, this.format ? this.format : defaultFormat[this.isContainTime ?
|
||||
'datetime' : 'date']));
|
||||
dates.push(newDate);
|
||||
});
|
||||
result.value = values;
|
||||
result.date = dates;
|
||||
} else {
|
||||
let newDate = new Date(this.checkeds[0]);
|
||||
if (this.isContainTime) {
|
||||
newDate.setHours(this.beginTime[0], this.beginTime[1]);
|
||||
if (this.showSeconds) newDate.setSeconds(this.beginTime[2]);
|
||||
}
|
||||
result.value = DateTools.format(newDate, this.format ? this.format : defaultFormat[this.isContainTime ?
|
||||
'datetime' : 'date']);
|
||||
result.date = newDate;
|
||||
}
|
||||
}
|
||||
this.$emit('confirm', result);
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
BeginTitle() {
|
||||
let value = '未选择';
|
||||
if (this.checkeds.length) value = DateTools.format(this.checkeds[0], 'yy/mm/dd');
|
||||
return value;
|
||||
},
|
||||
EndTitle() {
|
||||
let value = '未选择';
|
||||
if (this.checkeds.length == 2) value = DateTools.format(this.checkeds[1], 'yy/mm/dd');
|
||||
return value;
|
||||
},
|
||||
PickerTimeTitle() {
|
||||
return DateTools.formatTimeArray(this.timeValue, this.showSeconds);
|
||||
},
|
||||
BeginTimeTitle() {
|
||||
return this.BeginTitle != '未选择' ? DateTools.formatTimeArray(this.beginTime, this.showSeconds) : '';
|
||||
},
|
||||
EndTimeTitle() {
|
||||
return this.EndTitle != '未选择' ? DateTools.formatTimeArray(this.endTime, this.showSeconds) : '';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
show(newValue, oldValue) {
|
||||
newValue && this.setValue(this.value);
|
||||
this.isShow = newValue;
|
||||
},
|
||||
value(newValue, oldValue) {
|
||||
setTimeout(()=>{
|
||||
this.setValue(newValue);
|
||||
}, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$z-index: 999;
|
||||
$cell-spacing: 20upx;
|
||||
$calendar-size: 630upx;
|
||||
$calendar-item-size: 90upx;
|
||||
|
||||
.picker {
|
||||
position: fixed;
|
||||
z-index: $z-index;
|
||||
background: rgba(255, 255, 255, 0);
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 28upx;
|
||||
|
||||
&-btn {
|
||||
padding: $cell-spacing*0.5 $cell-spacing;
|
||||
border-radius: 12upx;
|
||||
color: #666;
|
||||
|
||||
&-active {
|
||||
background: rgba(0, 0, 0, .1);
|
||||
}
|
||||
}
|
||||
|
||||
&-display {
|
||||
color: #666;
|
||||
|
||||
&-text {
|
||||
color: #000;
|
||||
margin: 0 $cell-spacing*0.5;
|
||||
}
|
||||
|
||||
&-link {
|
||||
display: inline-block;
|
||||
|
||||
&-active {
|
||||
background: rgba(0, 0, 0, .1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-time {
|
||||
width: $calendar-size - 80upx !important;
|
||||
left: ((750upx - $calendar-size) / 2 + 40upx) !important;
|
||||
}
|
||||
|
||||
&-modal {
|
||||
background: #fff;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: (750upx - $calendar-size) / 2;
|
||||
width: $calendar-size;
|
||||
transform: translateY(-50%);
|
||||
box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
|
||||
border-radius: 12upx;
|
||||
|
||||
&-header {
|
||||
text-align: center;
|
||||
line-height: 80upx;
|
||||
font-size: 32upx;
|
||||
|
||||
&-title {
|
||||
display: inline-block;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.picker-icon {
|
||||
display: inline-block;
|
||||
line-height: 50upx;
|
||||
width: 50upx;
|
||||
height: 50upx;
|
||||
border-radius: 50upx;
|
||||
text-align: center;
|
||||
margin: 10upx;
|
||||
background: #fff;
|
||||
font-size: 36upx;
|
||||
|
||||
&-active {
|
||||
background: rgba(0, 0, 0, .1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-body {
|
||||
width: $calendar-size !important;
|
||||
height: $calendar-size !important;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&-time {
|
||||
width: 100%;
|
||||
height: 180upx;
|
||||
text-align: center;
|
||||
line-height: 60upx;
|
||||
}
|
||||
|
||||
&-footer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: $cell-spacing;
|
||||
|
||||
&-info {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
&-btn {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-calendar {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
&-view {
|
||||
position: relative;
|
||||
width: $calendar-item-size;
|
||||
height: $calendar-item-size;
|
||||
text-align: center;
|
||||
|
||||
&-bgbegin,
|
||||
&-bg,
|
||||
&-bgend,
|
||||
&-item,
|
||||
&-dot,
|
||||
&-tips {
|
||||
position: absolute;
|
||||
transition: .2s;
|
||||
}
|
||||
|
||||
&-bgbegin,
|
||||
&-bg,
|
||||
&-bgend {
|
||||
opacity: .15;
|
||||
height: 80%;
|
||||
}
|
||||
|
||||
&-bg {
|
||||
left: 0;
|
||||
top: 10%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&-bgbegin {
|
||||
border-radius: $calendar-item-size 0 0 $calendar-item-size;
|
||||
top: 10%;
|
||||
left: 10%;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
&-bgend {
|
||||
border-radius: 0 $calendar-item-size $calendar-item-size 0;
|
||||
top: 10%;
|
||||
left: 0%;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
&-item {
|
||||
left: 5%;
|
||||
top: 5%;
|
||||
width: 90%;
|
||||
height: 90%;
|
||||
border-radius: $calendar-item-size;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&-dot {
|
||||
right: 10%;
|
||||
top: 10%;
|
||||
width: 12upx;
|
||||
height: 12upx;
|
||||
border-radius: 12upx;
|
||||
}
|
||||
|
||||
&-tips {
|
||||
bottom: 100%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: #4E4B46;
|
||||
color: #fff;
|
||||
border-radius: 12upx;
|
||||
padding: 10upx 20upx;
|
||||
font-size: 24upx;
|
||||
width: max-content;
|
||||
margin-bottom: 5px;
|
||||
pointer-events: none;
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-style: solid;
|
||||
border-width: 5px 5px 0 5px;
|
||||
border-color: #4E4B46 transparent transparent transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "mxdatepickericon";
|
||||
src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAMYAAsAAAAACBgAAALMAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDIgqDRIJiATYCJAMUCwwABCAFhG0HSRvfBsg+QCa3noNAyAQ9w6GDvbwpNp2vloCyn8bD/x+y+/5qDhtj+T4eRVEcbsCoKMFASzCgLdDkmqYDwgxkWQ6YH5L/YnppOlLEjlnter43YRjU7M6vJ3iGADVAgJn5kqjv/wEii23T86UsAQT+04fV+o97VTMx4PPZt4DlorLXwIQiGMA5uhaVrBWqGHfQXcTEiE+PE+g2SUlxWlLVBHwUYFMgrgwSB3wstTKSGzqF1nOyiGeeOtNjV4An/vvxR58PSc3AzrMViyDvPo/7dVEUzn5GROfIWAcU4rLXfMFdhte56y4We9gGNEVIezkBOOaQXUrbTf/hJVkhGpDdCw7dSOEzByMEn3kIic98hMxnAfeFPKWCbjRcA148/HxhCEkaA94eGWFaGolsblpaWz8/Po2WVuNHh1fmBpZHIpqal9fOjizhTteY+RZ9rv02I/pq0W6QVH3pSncBz3m55r9ZIPycHfmenvxe4uyutIgfT5u4bgkDusl9gcF0rnfnz+b2NpSaQWBFeu8GIL1xQj5AH/6FAsEr/50F28e/gA9ny6KjLrxIp0TE+UucmQOl5AFNLXkzZufWamWHYEI39PEP2If97CMdm51N6DSmIekwAVmneXTBr0PVYx+aTgfQbU3p+R4jKHdRurBq0oEw6AKSfm+QDbpGF/w3VOP+oBnMHbqdx409FjP4RRHHkAj5IWgQiBUjHfMTuQ1Icpg5avI4sQVRu8EHdWptM1aKrIjuscfeL+kZwxBTYoElztOQ2UygjRIjEphaZsyWodHgvm9SC8QC/JygEA6DiCDeEMhAQFhhOpvxa/18A0TiYMahIy0L2hYIZWeYH9JR085Al4qts1re5St2/SR6DINBGEVYQCWOETHDMAHZ+pcZIQJGTV4RtMmg8UbhuWL1+VLLA2RFHYC71kiRo0SNpjwQh8pj2EFU3oTNmS1WqgIA') format('woff2');
|
||||
}
|
||||
|
||||
.picker-icon {
|
||||
font-family: "mxdatepickericon" !important;
|
||||
}
|
||||
|
||||
.picker-icon-you:before {
|
||||
content: "\e63e";
|
||||
}
|
||||
|
||||
.picker-icon-zuo:before {
|
||||
content: "\e640";
|
||||
}
|
||||
|
||||
.picker-icon-zuozuo:before {
|
||||
content: "\e641";
|
||||
}
|
||||
|
||||
.picker-icon-youyou:before {
|
||||
content: "\e642";
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,64 +0,0 @@
|
|||
<template>
|
||||
<view class="sidebar">
|
||||
<navigator url="/pages/index/index" open-type="redirect">
|
||||
<view class="item" :class="path==1?'active':''">
|
||||
装船指令
|
||||
</view>
|
||||
</navigator>
|
||||
<navigator url="/pages/discharge/index" open-type="redirect">
|
||||
<view class="item" :class="path==2?'active':''">
|
||||
卸船指令
|
||||
</view>
|
||||
</navigator>
|
||||
<navigator url="/pages/shipWork/index" open-type="redirect">
|
||||
<view class="item" :class="path==3?'active':''">
|
||||
船舶作业
|
||||
</view>
|
||||
</navigator>
|
||||
<navigator url="/pages/quality/index" open-type="redirect">
|
||||
<view class="item" :class="path==4?'active':''">
|
||||
货物质量
|
||||
</view>
|
||||
</navigator>
|
||||
<navigator url="/pages/monitor/index" open-type="redirect">
|
||||
<view class="item" :class="path==5?'active':''">
|
||||
场位监控
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "footTab",
|
||||
props: {
|
||||
path: {
|
||||
type: [String || Number]
|
||||
},
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
components: {},
|
||||
methods: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.sidebar {
|
||||
min-width: 100px;
|
||||
background-color: #f2f2f2;
|
||||
|
||||
.item {
|
||||
height: 45px;
|
||||
line-height: 45px;
|
||||
text-align: center;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #5573d7;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,55 +0,0 @@
|
|||
/**
|
||||
* 递归使用call方式 this指向
|
||||
*
|
||||
* @param {String} componentName 需要查找的组件的名称
|
||||
* @param {String} eventName 事件名称
|
||||
* @param {Object} params 需要传递的参数
|
||||
*/
|
||||
function broadcast(componentName, eventName, params) {
|
||||
// 循环子节点找到需要的节点，没有查找到就递归进行查找
|
||||
this.$children.map(child => {
|
||||
if (componentName === child.$options.name) {
|
||||
child.$emit.apply(child, [eventName].concat(params))
|
||||
} else {
|
||||
broadcast.apply(child, [componentName, eventName].concat(params))
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export default {
|
||||
methods: {
|
||||
/**
|
||||
* 派发 向上查找一个
|
||||
* @param {Object} componentName 需要查找的组件的名称
|
||||
* @param {Object} eventName 事件名称
|
||||
* @param {Object} params 需要传递的参数
|
||||
*/
|
||||
dispatch(componentName, eventName, params) {
|
||||
// 找到最近父节点 $root 根节点
|
||||
let parent = this.$parent || this.$root
|
||||
// 获取当前实例的名称
|
||||
let name = parent.$options.name
|
||||
|
||||
// 当前存在节点并且当前节点没有名称或者名称不等于我们要查找的节点名称，则继续遍历
|
||||
while (parent && (!name || name !== componentName)) {
|
||||
parent = parent.$parent
|
||||
if (parent) {
|
||||
name = parent.$options.name
|
||||
}
|
||||
}
|
||||
// 如果有节点则表示找到
|
||||
if (parent) {
|
||||
parent.$emit.apply(parent, [eventName].concat(params))
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 广播 向下查找多个
|
||||
* @param {Object} componentName 需要查找的组件的名称
|
||||
* @param {Object} eventName 事件名称
|
||||
* @param {Object} params 需要传递的参数
|
||||
*/
|
||||
broadcast(componentName, eventName, params) {
|
||||
broadcast.call(this, componentName, eventName, params)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,320 +0,0 @@
|
|||
<template>
|
||||
<view class="tn-input-class tn-input" :class="{
|
||||
'tn-input--border': border,
|
||||
'tn-input--error': validateState
|
||||
}" :style="{
|
||||
padding: `0 ${border ? 20 : 0}rpx`,
|
||||
borderColor: borderColor,
|
||||
textAlign: inputAlign
|
||||
}" @tap.stop="inputClick">
|
||||
<textarea v-if="type === 'textarea'" class="tn-input__input tn-input__textarea"
|
||||
style="width: 100%; height: 50px;" :value="defaultValue" :placeholder="placeholder"
|
||||
:placeholderStyle="placeholderStyle" :disabled="disabled || type === 'select'" :maxlength="maxLength"
|
||||
:fixed="fixed" :focus="focus" :autoHeight="autoHeight" :selectionStart="elSelectionStart"
|
||||
:selectionEnd="elSelectionEnd" :cursorSpacing="cursorSpacing" :showConfirmBar="showConfirmBar"
|
||||
@input="handleInput" @blur="handleBlur" @focus="onFocus" @confirm="onConfirm" />
|
||||
<input v-else class="tn-input__input" :type="type === 'password' ? 'text' : type"
|
||||
style="width: 100%; height: 50px;" :value="defaultValue" :password="type === 'password' && !showPassword"
|
||||
:placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled || type === 'select'"
|
||||
:maxlength="maxLength" :focus="focus" :confirmType="confirmType" :selectionStart="elSelectionStart"
|
||||
:selectionEnd="elSelectionEnd" :cursorSpacing="cursorSpacing" :showConfirmBar="showConfirmBar"
|
||||
@input="handleInput" @blur="handleBlur" @focus="onFocus" @confirm="onConfirm" />
|
||||
|
||||
<!-- 右边的icon -->
|
||||
<view class="tn-input__right-icon tn-flex tn-flex-col-center">
|
||||
<!-- 清除按钮 -->
|
||||
<view v-if="clearable && value !== '' && focused"
|
||||
class="tn-input__right-icon__item tn-input__right-icon__clear" @tap="onClear">
|
||||
<view class="icon tn-icon-close"></view>
|
||||
</view>
|
||||
<view v-else-if="type === 'text' && !focused && showRightIcon && rightIcon !== ''"
|
||||
class="tn-input__right-icon__item tn-input__right-icon__clear">
|
||||
<view class="icon" :class="[`tn-icon-${rightIcon}`]"></view>
|
||||
</view>
|
||||
<!-- 显示密码按钮 -->
|
||||
<view v-if="passwordIcon && type === 'password'"
|
||||
class="tn-input__right-icon__item tn-input__right-icon__clear" @tap="showPassword = !showPassword">
|
||||
<view v-if="!showPassword" class="tn-icon-eye-hide"></view>
|
||||
<view v-else class="icon tn-icon-eye"></view>
|
||||
</view>
|
||||
<!-- 可选项箭头 -->
|
||||
<view v-if="type === 'select'" class="tn-input__right-icon__item tn-input__right-icon__select" :class="{
|
||||
'tn-input__right-icon__select--reverse': selectOpen
|
||||
}">
|
||||
<view class="icon tn-icon-up-triangle"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Emitter from '../u-input/emitter.js'
|
||||
export default {
|
||||
mixins: [Emitter],
|
||||
name: 'tn-input',
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
// 输入框的类型
|
||||
type: {
|
||||
type: String,
|
||||
default: 'text'
|
||||
},
|
||||
// 输入框文字对齐方式
|
||||
inputAlign: {
|
||||
type: String,
|
||||
default: 'left'
|
||||
},
|
||||
// 文本框为空时显示的信息
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
placeholderStyle: {
|
||||
type: String,
|
||||
default: 'color: #AAAAAA'
|
||||
},
|
||||
// 是否禁用输入框
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 可输入文字的最大长度
|
||||
maxLength: {
|
||||
type: Number,
|
||||
default: 255
|
||||
},
|
||||
// 输入框高度
|
||||
height: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
// 根据内容自动调整高度
|
||||
autoHeight: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 键盘右下角显示的文字，仅在text时生效
|
||||
confirmType: {
|
||||
type: String,
|
||||
default: 'done'
|
||||
},
|
||||
// 输入框自定义样式
|
||||
customStyle: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
// 是否固定输入框
|
||||
fixed: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 是否自动获取焦点
|
||||
focus: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 当type为password时，是否显示右侧密码图标
|
||||
passwordIcon: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 当type为 input或者textarea时是否显示边框
|
||||
border: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 边框的颜色
|
||||
borderColor: {
|
||||
type: String,
|
||||
default: '#dcdfe6'
|
||||
},
|
||||
// 当type为select时，旋转右侧图标，标记当时select是打开还是关闭
|
||||
selectOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 是否可清空
|
||||
clearable: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 光标与键盘的距离
|
||||
cursorSpacing: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
// selectionStart和selectionEnd需要搭配使用，自动聚焦时生效
|
||||
// 光标起始位置
|
||||
selectionStart: {
|
||||
type: Number,
|
||||
default: -1
|
||||
},
|
||||
// 光标结束位置
|
||||
selectionEnd: {
|
||||
type: Number,
|
||||
default: -1
|
||||
},
|
||||
// 自动去除两端空格
|
||||
trim: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 是否显示键盘上方的完成按钮
|
||||
showConfirmBar: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 是否在输入框内最右边显示图标
|
||||
showRightIcon: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 最右边图标的名称
|
||||
rightIcon: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 输入框样式
|
||||
inputStyle() {
|
||||
let style = {}
|
||||
// 如果没有设置高度，根据不同的类型设置一个默认值
|
||||
style.minHeight = this.height ? this.height + 'rpx' :
|
||||
this.type === 'textarea' ? this.textareaHeight + 'rpx' : this.inputHeight + 'rpx'
|
||||
|
||||
style = Object.assign(style, this.customStyle)
|
||||
|
||||
return style
|
||||
},
|
||||
// 光标起始位置
|
||||
elSelectionStart() {
|
||||
return String(this.selectionStart)
|
||||
},
|
||||
// 光标结束位置
|
||||
elSelectionEnd() {
|
||||
return String(this.selectionEnd)
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 默认值
|
||||
defaultValue: this.value,
|
||||
// 输入框高度
|
||||
inputHeight: 70,
|
||||
// textarea的高度
|
||||
textareaHeight: 100,
|
||||
// 标记验证的状态
|
||||
validateState: false,
|
||||
// 标记是否获取到焦点
|
||||
focused: false,
|
||||
// 是否预览密码
|
||||
showPassword: false,
|
||||
// 用于头条小程序，判断@input中，前后的值是否发生了变化，因为头条中文下，按下键没有输入内容，也会触发@input事件
|
||||
lastValue: '',
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
value(newVal, oldVal) {
|
||||
this.defaultValue = newVal
|
||||
// 当值发生变化时，并且type为select时，不会触发input事件
|
||||
// 模拟input事件
|
||||
if (newVal !== oldVal && this.type === 'select') {
|
||||
this.handleInput({
|
||||
detail: {
|
||||
value: newVal
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 监听form-item发出的错误事件，将输入框变成红色
|
||||
this.$on("on-form-item-error", this.onFormItemError)
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* input事件
|
||||
*/
|
||||
handleInput(event) {
|
||||
let value = event.detail.value
|
||||
// 是否需要去掉空格
|
||||
if (this.trim) value = this.$tn.string.trim(value)
|
||||
// 原生事件
|
||||
this.$emit('input', value)
|
||||
// model赋值
|
||||
this.defaultValue = value
|
||||
// 过一个生命周期再发送事件给tn-form-item，否则this.$emit('input')更新了父组件的值，但是微信小程序上
|
||||
// 尚未更新到tn-form-item，导致获取的值为空，从而校验混论
|
||||
// 这里不能延时时间太短，或者使用this.$nextTick，否则在头条上，会造成混乱
|
||||
setTimeout(() => {
|
||||
// 头条小程序由于自身bug，导致中文下，每按下一个键(尚未完成输入)，都会触发一次@input，导致错误，这里进行判断处理
|
||||
// #ifdef MP-TOUTIAO
|
||||
if (this.$tn.string.trim(value) === this.lastValue) return
|
||||
this.lastValue = value
|
||||
// #endif
|
||||
|
||||
// 发送当前的值到form-item进行校验
|
||||
this.dispatch('tn-form-item', 'on-form-change', value)
|
||||
}, 40)
|
||||
},
|
||||
/**
|
||||
* blur事件
|
||||
*/
|
||||
handleBlur(event) {
|
||||
let value = event.detail.value
|
||||
|
||||
// 由于点击清除图标也会触发blur事件，导致图标消失从而无法点击
|
||||
setTimeout(() => {
|
||||
this.focused = false
|
||||
}, 100)
|
||||
|
||||
// 原生事件
|
||||
this.$emit('blur', value)
|
||||
// 过一个生命周期再发送事件给tn-form-item，否则this.$emit('blur')更新了父组件的值，但是微信小程序上
|
||||
// 尚未更新到tn-form-item，导致获取的值为空，从而校验混论
|
||||
// 这里不能延时时间太短，或者使用this.$nextTick，否则在头条上，会造成混乱
|
||||
setTimeout(() => {
|
||||
// 头条小程序由于自身bug，导致中文下，每按下一个键(尚未完成输入)，都会触发一次@input，导致错误，这里进行判断处理
|
||||
// #ifdef MP-TOUTIAO
|
||||
if (this.$tn.string.trim(value) === this.lastValue) return
|
||||
this.lastValue = value
|
||||
// #endif
|
||||
|
||||
// 发送当前的值到form-item进行校验
|
||||
this.dispatch('tn-form-item', 'on-form-blur', value)
|
||||
}, 40)
|
||||
},
|
||||
// 处理校验错误
|
||||
onFormItemError(status) {
|
||||
this.validateState = status
|
||||
},
|
||||
// 聚焦事件
|
||||
onFocus(event) {
|
||||
this.focused = true
|
||||
this.$emit('focus')
|
||||
},
|
||||
// 点击确认按钮事件
|
||||
onConfirm(event) {
|
||||
this.$emit('confirm', event.detail.value)
|
||||
},
|
||||
// 清除事件
|
||||
onClear(event) {
|
||||
this.$emit('input', '')
|
||||
},
|
||||
// 点击事件
|
||||
inputClick() {
|
||||
this.$emit('click')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -1,208 +0,0 @@
|
|||
.so-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
z-index: 998
|
||||
}
|
||||
|
||||
.so-plate {
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
background: #fff;
|
||||
padding: 25upx 25upx 0 25upx
|
||||
}
|
||||
|
||||
.so-plate-head {
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
-webkit-box-pack: justify;
|
||||
justify-content: space-between;
|
||||
-webkit-box-align: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.so-plate-type {
|
||||
-webkit-box-flex: 1;
|
||||
flex: 1;
|
||||
display: block
|
||||
}
|
||||
|
||||
.so-plate-type label {
|
||||
display: inline-block;
|
||||
min-height: 32upx;
|
||||
font-size: 26upx;
|
||||
margin-right: 20upx
|
||||
}
|
||||
|
||||
.so-plate-body {
|
||||
box-sizing: border-box;
|
||||
padding: 30upx 0;
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
-webkit-box-pack: justify;
|
||||
justify-content: space-between;
|
||||
-webkit-box-align: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.so-plate-word {
|
||||
border: 1upx solid #ccc;
|
||||
border-radius: 10upx;
|
||||
height: 0;
|
||||
margin: 0 5upx;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: calc(4.28571429%);
|
||||
width: calc(4.28571429%);
|
||||
position: relative
|
||||
}
|
||||
|
||||
.so-plate-word.active {
|
||||
border-color: #007aff;
|
||||
box-shadow: 0 0 15upx 0 #007aff
|
||||
}
|
||||
|
||||
.so-plate-word text {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-webkit-transform: translateX(-50%) translateY(-50%);
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
font-weight: 700;
|
||||
font-size: 32upx
|
||||
}
|
||||
|
||||
.so-plate-dot {
|
||||
width: 15upx;
|
||||
height: 15upx;
|
||||
background: #ccc;
|
||||
border-radius: 50%;
|
||||
margin: 0 5upx
|
||||
}
|
||||
|
||||
.so-plate-keyboard {
|
||||
background: #eee;
|
||||
margin-left: -25upx;
|
||||
margin-right: -25upx;
|
||||
padding: 20upx 25upx 10upx 25upx;
|
||||
box-sizing: border-box;
|
||||
-webkit-transition: all .3s;
|
||||
transition: all .3s
|
||||
}
|
||||
|
||||
.so-plate-keyboard>view {
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
-webkit-box-pack: justify;
|
||||
justify-content: space-between
|
||||
}
|
||||
|
||||
.so-plate-key {
|
||||
display: block;
|
||||
background: #fff;
|
||||
border-radius: 10upx;
|
||||
box-shadow: 0 0 8upx 0 #bbb;
|
||||
width: 80upx;
|
||||
height: 80upx;
|
||||
margin: 5upx 0;
|
||||
font-size: 32upx;
|
||||
text-align: center;
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
justify-content: center;
|
||||
position: relative
|
||||
}
|
||||
|
||||
.so-plate-key.hover {
|
||||
background: #efefef
|
||||
}
|
||||
|
||||
.so-plate-key.fill-block {
|
||||
width: 80upx;
|
||||
height: 80upx;
|
||||
background: none;
|
||||
box-shadow: none
|
||||
}
|
||||
|
||||
.so-plate-btn {
|
||||
display: inline-block;
|
||||
background: #fff;
|
||||
border-radius: 10upx;
|
||||
box-shadow: 0 0 10upx 0 #bbb;
|
||||
font-size: 28upx;
|
||||
text-align: center;
|
||||
margin: 0 0 0 10upx
|
||||
}
|
||||
|
||||
.so-plate-btn-group {
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
-webkit-box-pack: justify;
|
||||
justify-content: space-between;
|
||||
background: #eee;
|
||||
margin-left: -25upx;
|
||||
margin-right: -25upx;
|
||||
box-sizing: border-box;
|
||||
padding: 0 25upx 10upx 25upx
|
||||
}
|
||||
|
||||
.so-plate-btn--cancel {
|
||||
margin: 0
|
||||
}
|
||||
|
||||
.so-plate-btn--submit {
|
||||
background: #5773f9;
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.so-plate-btn--delete {
|
||||
color: #fd6b6d
|
||||
}
|
||||
|
||||
.animation-scale-up {
|
||||
-webkit-animation-duration: .2s;
|
||||
animation-duration: .2s;
|
||||
-webkit-animation-timing-function: ease-out;
|
||||
animation-timing-function: ease-out;
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
-webkit-animation-name: scale-up;
|
||||
animation-name: scale-up
|
||||
}
|
||||
|
||||
@-webkit-keyframes scale-up {
|
||||
0% {
|
||||
opacity: .8;
|
||||
-webkit-transform: scale(.8);
|
||||
transform: scale(.8)
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes scale-up {
|
||||
0% {
|
||||
opacity: .8;
|
||||
-webkit-transform: scale(.8);
|
||||
transform: scale(.8)
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1)
|
||||
}
|
||||
}
|
||||
|
|
@ -1,154 +0,0 @@
|
|||
.so-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
z-index: 998;
|
||||
}
|
||||
.so-plate {
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
background: #fff;
|
||||
padding: 25upx 25upx 0 25upx;
|
||||
&-head {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
&-type {
|
||||
flex:1;
|
||||
display:block;
|
||||
label {
|
||||
display: inline-block;
|
||||
min-height: 32upx;
|
||||
font-size: 26upx;
|
||||
margin-right: 10upx;
|
||||
}
|
||||
}
|
||||
&-body {
|
||||
box-sizing: border-box;
|
||||
padding: 30upx 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
&-word {
|
||||
border: 1upx solid #ccc;
|
||||
border-radius: 10upx;
|
||||
height: 0;
|
||||
margin: 0 5upx;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: calc((100% - 70upx) / 7);
|
||||
width: calc((100% - 70upx) / 7);
|
||||
position: relative;
|
||||
&.active {
|
||||
border-color: #007aff;
|
||||
box-shadow: 0 0 15upx 0 #007aff;
|
||||
}
|
||||
text {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
font-weight: 700;
|
||||
font-size: 32upx;
|
||||
}
|
||||
}
|
||||
&-dot {
|
||||
width: 15upx;
|
||||
height: 15upx;
|
||||
background: #ccc;
|
||||
border-radius: 50%;
|
||||
margin: 0 5upx;
|
||||
}
|
||||
&-keyboard {
|
||||
background: #eee;
|
||||
margin-left: -25upx;
|
||||
margin-right: -25upx;
|
||||
padding: 20upx 25upx 10upx 25upx;
|
||||
box-sizing: border-box;
|
||||
transition: all .3s;
|
||||
&>view{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
&-key {
|
||||
display: block;
|
||||
background: #fff;
|
||||
border-radius: 10upx;
|
||||
box-shadow: 0 0 8upx 0 #bbb;
|
||||
width: 80upx;
|
||||
height: 80upx;
|
||||
margin: 5upx 0;
|
||||
font-size: 32upx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
&.hover {
|
||||
background: #efefef;
|
||||
}
|
||||
&.fill-block {
|
||||
width: 80upx;
|
||||
height: 80upx;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
&-btn {
|
||||
display: inline-block;
|
||||
background: #fff;
|
||||
border-radius: 10upx;
|
||||
box-shadow: 0 0 10upx 0 #bbb;
|
||||
font-size: 28upx;
|
||||
text-align: center;
|
||||
margin:0 0 0 10upx;
|
||||
padding:0 25upx;
|
||||
&-group{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background: #eee;
|
||||
margin-left: -25upx;
|
||||
margin-right: -25upx;
|
||||
box-sizing: border-box;
|
||||
padding: 0 25upx 10upx 25upx;
|
||||
}
|
||||
&--cancel{
|
||||
margin:0;
|
||||
}
|
||||
&--submit{
|
||||
background:#5773f9;
|
||||
color:#fff;
|
||||
}
|
||||
&--delete{
|
||||
color:#fd6b6d;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.animation-scale-up {
|
||||
animation-duration: .2s;
|
||||
animation-timing-function: ease-out;
|
||||
animation-fill-mode: both;
|
||||
animation-name: scale-up
|
||||
}
|
||||
@keyframes scale-up {
|
||||
0% {
|
||||
opacity: .8;
|
||||
transform: scale(.8)
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: scale(1)
|
||||
}
|
||||
}
|
||||
|
|
@ -1,265 +0,0 @@
|
|||
/**
|
||||
* @author minisola
|
||||
* @version 20190814
|
||||
*/
|
||||
<template>
|
||||
<view class="so-mask">
|
||||
<view class="so-plate animation-scale-up">
|
||||
<view class="so-plate-head">
|
||||
<view class="so-plate-type">
|
||||
<radio-group @change="typeChange">
|
||||
<label>
|
||||
<radio value="1" :checked="type===1" />
|
||||
普通车牌
|
||||
</label>
|
||||
<label>
|
||||
<radio value="2" :checked="type===2" />
|
||||
新能源车牌
|
||||
</label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view class="so-plate-body">
|
||||
<view class="so-plate-word" :class="{ active: currentInputIndex == 0 }" @tap="inputSwitch" data-index="0">
|
||||
<text>{{ currentInputValue[0] }}</text>
|
||||
</view>
|
||||
<view class="so-plate-word" :class="{ active: currentInputIndex == 1 }" @tap="inputSwitch" data-index="1">
|
||||
<text>{{ currentInputValue[1] }}</text>
|
||||
</view>
|
||||
<view class="so-plate-dot"></view>
|
||||
<view class="so-plate-word" :class="{ active: currentInputIndex == 2 }" @tap="inputSwitch" data-index="2">
|
||||
<text>{{ currentInputValue[2] }}</text>
|
||||
</view>
|
||||
<view class="so-plate-word" :class="{ active: currentInputIndex == 3 }" @tap="inputSwitch" data-index="3">
|
||||
<text>{{ currentInputValue[3] }}</text>
|
||||
</view>
|
||||
<view class="so-plate-word" :class="{ active: currentInputIndex == 4 }" @tap="inputSwitch" data-index="4">
|
||||
<text>{{ currentInputValue[4] }}</text>
|
||||
</view>
|
||||
<view class="so-plate-word" :class="{ active: currentInputIndex == 5 }" @tap="inputSwitch" data-index="5">
|
||||
<text>{{ currentInputValue[5] }}</text>
|
||||
</view>
|
||||
<view class="so-plate-word" :class="{ active: currentInputIndex == 6 }" @tap="inputSwitch" data-index="6">
|
||||
<text>{{ currentInputValue[6] }}</text>
|
||||
</view>
|
||||
<view class="so-plate-word" :class="{ active: currentInputIndex == 7 }" @tap="inputSwitch" v-if="type == 2" data-index="7">
|
||||
<text>{{ currentInputValue[7] }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="so-plate-foot">
|
||||
<view class="so-plate-keyboard" :style="{height:keyboardHeight}">
|
||||
<view id="keyboard">
|
||||
<block v-if="inputType == 1">
|
||||
<view hover-class="hover" class="so-plate-key" v-for="el of provinceText" :key="el" :data-value="el" @tap="chooseKey">{{ el }}</view>
|
||||
</block>
|
||||
<block v-if="inputType == 1">
|
||||
<text class="so-plate-key fill-block"></text>
|
||||
</block>
|
||||
<block v-if="inputType >= 3">
|
||||
<view hover-class="hover" class="so-plate-key" v-for="el of numberText" :key="el" :data-value="el" @tap="chooseKey">{{ el }}</view>
|
||||
</block>
|
||||
<block v-if="inputType >= 2">
|
||||
<view hover-class="hover" class="so-plate-key" v-for="el of wordText" :key="el" :data-value="el" @tap="chooseKey">{{ el }}</view>
|
||||
</block>
|
||||
<block v-if="inputType == 3">
|
||||
<text v-for="el of fillBlock" :key="el.num" class="so-plate-key fill-block"></text>
|
||||
</block>
|
||||
<block v-if="inputType == 4">
|
||||
<view hover-class="hover" class="so-plate-key" v-for="el of lastWordText" :key="el" :data-value="el" @tap="chooseKey">{{ el }}</view>
|
||||
</block>
|
||||
<text v-if="inputType == 4" class="so-plate-key fill-block"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="so-plate-btn-group">
|
||||
<view>
|
||||
<button class="so-plate-btn so-plate-btn--cancel" @tap="$emit('close')">取消</button>
|
||||
</view>
|
||||
<view>
|
||||
<button class="so-plate-btn so-plate-btn--delete" @tap="deleteKey">删除</button>
|
||||
<button class="so-plate-btn so-plate-btn--submit" @tap="exportPlate">完成</button>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'uni-plate-input',
|
||||
data() {
|
||||
return {
|
||||
type: 1, //车牌类型
|
||||
currentInputIndex: 0, //当前编辑的输入框
|
||||
currentInputValue: ['', '', '', '', '', '', ''],
|
||||
fillBlock:[{num:11},{num:12},{num:13},{num:14},{num:15},{num:16}], //避免:key报错
|
||||
keyboardHeightInit:false,
|
||||
keyboardHeight:'auto',
|
||||
provinceText: [
|
||||
'粤',
|
||||
'京',
|
||||
'冀',
|
||||
'沪',
|
||||
'津',
|
||||
'晋',
|
||||
'蒙',
|
||||
'辽',
|
||||
'吉',
|
||||
'黑',
|
||||
'苏',
|
||||
'浙',
|
||||
'皖',
|
||||
'闽',
|
||||
'赣',
|
||||
'鲁',
|
||||
'豫',
|
||||
'鄂',
|
||||
'湘',
|
||||
'桂',
|
||||
'琼',
|
||||
'渝',
|
||||
'川',
|
||||
'贵',
|
||||
'云',
|
||||
'藏',
|
||||
'陕',
|
||||
'甘',
|
||||
'青',
|
||||
'宁',
|
||||
'新'
|
||||
],
|
||||
numberText: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
|
||||
wordText: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'],
|
||||
lastWordText: ['挂', '港', '学', '领', '警']
|
||||
};
|
||||
},
|
||||
props: {
|
||||
plate: {
|
||||
type: String
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
//输入框类型
|
||||
inputType() {
|
||||
switch (this.currentInputIndex) {
|
||||
case 0:
|
||||
return 1;
|
||||
break;
|
||||
case 1:
|
||||
return 2;
|
||||
break;
|
||||
case 2:
|
||||
return 3;
|
||||
break;
|
||||
case 3:
|
||||
return 3;
|
||||
break;
|
||||
case 4:
|
||||
return 3;
|
||||
break;
|
||||
case 5:
|
||||
return 3;
|
||||
break;
|
||||
case 6:
|
||||
return this.type==2 ? 3 :4 ;
|
||||
break;
|
||||
case 7:
|
||||
return 4;
|
||||
break;
|
||||
default:
|
||||
return 1;
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
currentInputIndex:function(n,o){
|
||||
if(!this.keyboardHeightInit) return
|
||||
this.$nextTick(()=>{
|
||||
this.changeKeyboardHeight()
|
||||
})
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//车牌类型切换
|
||||
typeChange(e) {
|
||||
this.$emit("typeChange",e.detail.value);
|
||||
const {value} = e.detail;
|
||||
this.type = parseInt(value)
|
||||
this.currentInputIndex = 0
|
||||
if(value==1){
|
||||
this.currentInputValue = ['','','','','','','']
|
||||
}else{
|
||||
this.currentInputValue = ['','','','','','','','']
|
||||
}
|
||||
},
|
||||
inputSwitch(e) {
|
||||
const { index } = e.currentTarget.dataset;
|
||||
this.currentInputIndex = parseInt(index);
|
||||
},
|
||||
chooseKey(e) {
|
||||
const { value } = e.currentTarget.dataset;
|
||||
this.$set(this.currentInputValue, this.currentInputIndex, value);
|
||||
if(this.type==1 && this.currentInputIndex<6){
|
||||
this.currentInputIndex++
|
||||
}
|
||||
if(this.type==2 && this.currentInputIndex<7){
|
||||
this.currentInputIndex++
|
||||
}
|
||||
},
|
||||
deleteKey(){
|
||||
this.$set(this.currentInputValue,this.currentInputIndex,'')
|
||||
if(this.currentInputIndex!=0) this.currentInputIndex--
|
||||
},
|
||||
exportPlate(){
|
||||
const plate = this.currentInputValue.join('')
|
||||
let err = false
|
||||
if(this.type===1&&plate.length!=7){
|
||||
err = true
|
||||
}else if(this.type===2&&plate.length!=8){
|
||||
err = true
|
||||
}
|
||||
if(err) return uni.showToast({
|
||||
title:'请输入完整的车牌号码',
|
||||
icon:'none'
|
||||
})
|
||||
|
||||
this.$emit('export',plate)
|
||||
},
|
||||
changeKeyboardHeight(){
|
||||
const that = this
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('#keyboard').boundingClientRect();
|
||||
query.exec(function(res) {
|
||||
if(res&&res[0]){
|
||||
that.keyboardHeight = res[0].height + uni.upx2px(30) + 'px'
|
||||
that.keyboardHeightInit = true
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// console.log(this.plate);
|
||||
const plateKey = this.plate.split('')
|
||||
if(plateKey.length===7){
|
||||
this.type=1
|
||||
}else if(plateKey.length===8){
|
||||
this.type=2
|
||||
}
|
||||
if(plateKey.length===7 || plateKey.length===8){
|
||||
this.currentInputValue = plateKey
|
||||
this.currentInputIndex = plateKey.length-1
|
||||
}
|
||||
|
||||
setTimeout(() => { //在动画结束之后才开始获取
|
||||
this.$nextTick(()=>{
|
||||
this.changeKeyboardHeight()
|
||||
})
|
||||
}, 500);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
@import './uni-plate-input';
|
||||
</style>
|
||||
19
pages.json
19
pages.json
|
|
@ -1,16 +1,19 @@
|
|||
{
|
||||
// "easycom": {
|
||||
// "autoscan": true,
|
||||
// "custom": {
|
||||
// "^(.*)": "@/components/$1/$1.vue"
|
||||
|
||||
// }
|
||||
// },
|
||||
// "easycom": {
|
||||
// "autoscan": true,
|
||||
// "custom": {
|
||||
// "^(.*)": "@/components/$1/$1.vue"
|
||||
|
||||
// }
|
||||
// },
|
||||
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
|
||||
{
|
||||
"path": "pages/login/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登录"
|
||||
"navigationBarTitleText": "登录",
|
||||
"app-plus": {
|
||||
"softinputMode": "adjustPan"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
|
|||
|
|
@ -27,9 +27,9 @@
|
|||
</view>
|
||||
</view>
|
||||
<view class="status">
|
||||
<text v-if="item.vvyStatus==0" class="nStarted">● {{item.vvyStatusName}}</text>
|
||||
<text v-if="item.vvyStatus==1" class="green">● {{item.vvyStatusName}}</text>
|
||||
<text v-if="item.vvyStatus==2" class="complete">● {{item.vvyStatusName}}</text>
|
||||
<p v-if="item.vvyStatus==0" class="dfs">{{item.vvyStatusName}}</p>
|
||||
<p v-if="item.vvyStatus==1" class="zyz">{{item.vvyStatusName}}</p>
|
||||
<p v-if="item.vvyStatus==2" class="ywc">{{item.vvyStatusName}}</p>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
|
|
@ -50,6 +50,9 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<template v-if="isMore">
|
||||
<uni-load-more iconType="circle" status="loading" style="width: 100%;" />
|
||||
</template>
|
||||
</template>
|
||||
<o-empty v-else height="70vh" bg="#f5f6fa" />
|
||||
</view>
|
||||
|
|
@ -58,7 +61,6 @@
|
|||
@change="changePage" />
|
||||
</view> -->
|
||||
</view>
|
||||
<LotusLoading :lotusLoadingData="lotusLoadingData"></LotusLoading>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
|
@ -66,7 +68,6 @@
|
|||
<script>
|
||||
import HeadInfo from '@/components/head-info/head-info';
|
||||
import api from "../../common/api.js"
|
||||
import LotusLoading from "../../components/Winglau14-lotusLoading/Winglau14-LotusLoading.vue";
|
||||
let timers = null;
|
||||
export default {
|
||||
data() {
|
||||
|
|
@ -100,9 +101,8 @@
|
|||
// 港区信息
|
||||
portObj: {},
|
||||
|
||||
lotusLoadingData: {
|
||||
isShow: false //设置显示加载中组件true显示false隐藏
|
||||
}
|
||||
isMore: false,
|
||||
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
|
@ -113,7 +113,7 @@
|
|||
onReachBottom() {
|
||||
this.current++
|
||||
this.initData()
|
||||
this.lotusLoadingData.isShow = true
|
||||
this.isMore = true
|
||||
},
|
||||
onBackPress(options) {
|
||||
// 触发返回就会调用此方法，这里实现的是禁用物理返回，顶部导航栏的自定义返回 uni.navigateBack 仍可使用
|
||||
|
|
@ -125,7 +125,6 @@
|
|||
},
|
||||
components: {
|
||||
HeadInfo,
|
||||
LotusLoading
|
||||
},
|
||||
mounted() {
|
||||
this.initData()
|
||||
|
|
@ -208,7 +207,7 @@
|
|||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
this.lotusLoadingData.isShow = false
|
||||
this.isMore = false
|
||||
this.total = res.data.data.total
|
||||
this.itemList.push(...res.data.data.records)
|
||||
}
|
||||
|
|
@ -245,11 +244,11 @@
|
|||
height: 50px;
|
||||
background: #f5f6fa;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
position: fixed;
|
||||
top: 66px;
|
||||
right: 0;
|
||||
z-index: 995;
|
||||
padding-left: 20px;
|
||||
|
||||
.end {
|
||||
display: flex;
|
||||
|
|
@ -260,8 +259,7 @@
|
|||
height: 35px;
|
||||
line-height: 35px;
|
||||
padding-left: 10px;
|
||||
margin-right: 15px;
|
||||
margin-top: 10px;
|
||||
margin: 10px 15px 0 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
|
|
@ -285,6 +283,7 @@
|
|||
flex-wrap: wrap;
|
||||
position: relative;
|
||||
margin-top: 40px;
|
||||
padding-bottom: 50px;
|
||||
|
||||
/deep/.o-empty {
|
||||
width: 100%;
|
||||
|
|
@ -294,14 +293,14 @@
|
|||
width: calc(33.3% - 16px);
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 10px 20px;
|
||||
padding: 16px;
|
||||
position: relative;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
padding: 10px 0;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 24px;
|
||||
|
||||
.titleft {
|
||||
display: flex;
|
||||
|
|
@ -324,37 +323,46 @@
|
|||
.row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding: 10px 0;
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
|
||||
.nitem {
|
||||
// width: 49%;
|
||||
width: 49%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: #999;
|
||||
|
||||
.text {
|
||||
color: #929292;
|
||||
text {
|
||||
color: #23262e;
|
||||
}
|
||||
}
|
||||
|
||||
.nitem:nth-of-type(2n) {
|
||||
width: 35%;
|
||||
}
|
||||
|
||||
.nitem:nth-of-type(2n - 1) {
|
||||
width: 63%;
|
||||
}
|
||||
}
|
||||
|
||||
.status {
|
||||
margin-top: 5px;
|
||||
font-size: 16px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 23px;
|
||||
|
||||
.nStarted {
|
||||
color: #bbb;
|
||||
p {
|
||||
padding: 5px;
|
||||
border-radius: 13px 0 0 13px;
|
||||
}
|
||||
|
||||
.complete {
|
||||
.dfs {
|
||||
color: #0067CF;
|
||||
background: #F1F8FF;
|
||||
}
|
||||
|
||||
.zyz {
|
||||
color: #04B578;
|
||||
background: #E8FFF7;
|
||||
}
|
||||
|
||||
.ywc {
|
||||
color: #666666;
|
||||
background: #F7F7F7;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1579,16 +1579,21 @@
|
|||
|
||||
/deep/.uni-easyinput {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
/deep/.content-clear-icon {
|
||||
padding-right: 16px;
|
||||
}
|
||||
/deep/.content-clear-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/deep/.is-input-border {
|
||||
border-radius: 18.5px;
|
||||
}
|
||||
|
||||
/deep/.uni-easyinput__placeholder-class {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.rightInput {
|
||||
display: flex;
|
||||
|
||||
|
|
@ -1666,6 +1671,7 @@
|
|||
|
||||
.tjList {
|
||||
width: 240px;
|
||||
height: calc(100vh - 68px - 66px - 51px);
|
||||
background: #EBEDF1;
|
||||
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.10);
|
||||
float: left;
|
||||
|
|
@ -1679,6 +1685,7 @@
|
|||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
line-height: 21px;
|
||||
|
||||
p {
|
||||
color: #23262E;
|
||||
|
|
@ -1720,12 +1727,12 @@
|
|||
|
||||
.bottomInfo {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 9px;
|
||||
|
||||
p {
|
||||
font-size: 12px;
|
||||
color: #999999;
|
||||
margin-left: 10px;
|
||||
|
||||
text {
|
||||
margin-left: 4px;
|
||||
|
|
@ -1750,12 +1757,12 @@
|
|||
height: 87px;
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
padding: 16px 15px;
|
||||
padding: 16px;
|
||||
position: relative;
|
||||
|
||||
.imgBox {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
|
|
@ -1772,8 +1779,8 @@
|
|||
border-radius: 4px;
|
||||
|
||||
.imgBox {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
|
|
@ -1802,7 +1809,7 @@
|
|||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8px;
|
||||
padding: 12px 6px 1px;
|
||||
padding: 16px;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -2221,8 +2228,8 @@
|
|||
|
||||
.cwTop {
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 36px;
|
||||
|
|
@ -2234,7 +2241,7 @@
|
|||
height: 10px;
|
||||
margin-right: 8px;
|
||||
border-radius: 50%;
|
||||
margin-top: 12px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.statusText {
|
||||
|
|
@ -2444,14 +2451,14 @@
|
|||
|
||||
.drawerTop {
|
||||
display: flex;
|
||||
margin-top: 55px;
|
||||
margin-top: 24px;
|
||||
margin-bottom: 30px;
|
||||
|
||||
image {
|
||||
width: 14px;
|
||||
height: 24px;
|
||||
margin-right: 16px;
|
||||
margin-top: 3px;
|
||||
width: 10px;
|
||||
height: 14px;
|
||||
margin-right: 10px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
text {
|
||||
|
|
|
|||
|
|
@ -60,24 +60,24 @@
|
|||
<text>货物明细</text>
|
||||
</view>
|
||||
<view class="formNr">
|
||||
<uni-table border stripe emptyText="暂无更多数据">
|
||||
<uni-table stripe emptyText="暂无更多数据">
|
||||
<!-- 表头行 -->
|
||||
<uni-tr class="gray">
|
||||
<uni-th align="center" width="10">序号</uni-th>
|
||||
<uni-th align="center" width="22">车架号/条形码</uni-th>
|
||||
<uni-th align="center" width="15">作业状态</uni-th>
|
||||
<uni-th align="center" width="40">场位</uni-th>
|
||||
<uni-th align="center" width="15">货物性质</uni-th>
|
||||
<uni-th align="center" width="10">操作</uni-th>
|
||||
<uni-tr>
|
||||
<uni-th width="10">序号</uni-th>
|
||||
<uni-th width="22">车架号/条形码</uni-th>
|
||||
<uni-th width="15">作业状态</uni-th>
|
||||
<uni-th width="40">场位</uni-th>
|
||||
<uni-th width="15">货物性质</uni-th>
|
||||
<uni-th width="10">操作</uni-th>
|
||||
</uni-tr>
|
||||
<!-- 表格数据行 -->
|
||||
<uni-tr v-for="(item,index) in tableList" :key="index">
|
||||
<uni-td align="center">{{index + 1}}</uni-td>
|
||||
<uni-td align="center">{{item.vinCode}}</uni-td>
|
||||
<uni-td align="center">{{item.workStatus}}</uni-td>
|
||||
<uni-td align="center">{{item.yardPos}}</uni-td>
|
||||
<uni-td align="center">{{item.natureFlagName}}</uni-td>
|
||||
<uni-td align="center">
|
||||
<uni-td>{{index + 1}}</uni-td>
|
||||
<uni-td>{{item.vinCode}}</uni-td>
|
||||
<uni-td>{{item.workStatus}}</uni-td>
|
||||
<uni-td>{{item.yardPos}}</uni-td>
|
||||
<uni-td>{{item.natureFlagName}}</uni-td>
|
||||
<uni-td>
|
||||
<text class="operate" @click="open(item)">残损</text>
|
||||
</uni-td>
|
||||
</uni-tr>
|
||||
|
|
@ -335,14 +335,24 @@
|
|||
}
|
||||
|
||||
.formNr {
|
||||
.gray {
|
||||
background-color: #f9f9f9;
|
||||
/deep/.uni-table-th {
|
||||
background-color: #f4f4f4;
|
||||
color: #0B266A;
|
||||
font-size: 15px;
|
||||
|
||||
.uni-table-th-content {
|
||||
padding-left: 7.5px;
|
||||
border-left: 1px solid #0B266A;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.uni-table-td {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.operate {
|
||||
color: #2979ff;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -27,9 +27,9 @@
|
|||
</view>
|
||||
</view>
|
||||
<view class="status">
|
||||
<text v-if="item.vvyStatus==0" class="nStarted">● {{item.vvyStatusName}}</text>
|
||||
<text v-if="item.vvyStatus==1" class="green">● {{item.vvyStatusName}}</text>
|
||||
<text v-if="item.vvyStatus==2" class="complete">● {{item.vvyStatusName}}</text>
|
||||
<p v-if="item.vvyStatus==0" class="dfs">{{item.vvyStatusName}}</p>
|
||||
<p v-if="item.vvyStatus==1" class="zyz">{{item.vvyStatusName}}</p>
|
||||
<p v-if="item.vvyStatus==2" class="ywc">{{item.vvyStatusName}}</p>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
|
|
@ -50,6 +50,9 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<template v-if="isMore">
|
||||
<uni-load-more iconType="circle" status="loading" style="width: 100%;" />
|
||||
</template>
|
||||
</template>
|
||||
<o-empty v-else height="70vh" bg="#f5f6fa" />
|
||||
</view>
|
||||
|
|
@ -58,7 +61,6 @@
|
|||
@change="changePage" />
|
||||
</view> -->
|
||||
</view>
|
||||
<LotusLoading :lotusLoadingData="lotusLoadingData"></LotusLoading>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
|
@ -66,8 +68,6 @@
|
|||
<script>
|
||||
import HeadInfo from '@/components/head-info/head-info';
|
||||
import api from "../../common/api.js"
|
||||
import LotusLoading from "../../components/Winglau14-lotusLoading/Winglau14-LotusLoading.vue";
|
||||
let timers = null;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -100,19 +100,16 @@
|
|||
// 港区信息
|
||||
portObj: {},
|
||||
|
||||
lotusLoadingData: {
|
||||
isShow: false //设置显示加载中组件true显示false隐藏
|
||||
}
|
||||
isMore: false,
|
||||
}
|
||||
},
|
||||
components: {
|
||||
HeadInfo,
|
||||
LotusLoading
|
||||
},
|
||||
onReachBottom() {
|
||||
this.current++
|
||||
this.initData()
|
||||
this.lotusLoadingData.isShow = true
|
||||
this.isMore = true
|
||||
},
|
||||
onLoad() {
|
||||
this.portObj = uni.getStorageSync('portObj')
|
||||
|
|
@ -211,7 +208,7 @@
|
|||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
this.lotusLoadingData.isShow = false
|
||||
this.isMore = false
|
||||
this.total = res.data.data.total
|
||||
this.itemList.push(...res.data.data.records)
|
||||
}
|
||||
|
|
@ -253,11 +250,11 @@
|
|||
height: 50px;
|
||||
background: #f5f6fa;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
position: fixed;
|
||||
top: 66px;
|
||||
right: 0;
|
||||
z-index: 995;
|
||||
padding-left: 20px;
|
||||
|
||||
.end {
|
||||
display: flex;
|
||||
|
|
@ -268,8 +265,7 @@
|
|||
height: 35px;
|
||||
line-height: 35px;
|
||||
padding-left: 10px;
|
||||
margin-right: 15px;
|
||||
margin-top: 10px;
|
||||
margin: 10px 15px 0 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
|
|
@ -293,6 +289,7 @@
|
|||
flex-wrap: wrap;
|
||||
position: relative;
|
||||
margin-top: 40px;
|
||||
padding-bottom: 50px;
|
||||
|
||||
/deep/.o-empty {
|
||||
width: 100%;
|
||||
|
|
@ -302,15 +299,15 @@
|
|||
width: calc(33.3% - 16px);
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 10px 20px;
|
||||
padding: 16px;
|
||||
position: relative;
|
||||
margin-bottom: 16px;
|
||||
margin-right: 16px;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
padding: 10px 0;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 24px;
|
||||
|
||||
.titleft {
|
||||
display: flex;
|
||||
|
|
@ -333,37 +330,46 @@
|
|||
.row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding: 10px 0;
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
|
||||
.nitem {
|
||||
// width: 49%;
|
||||
width: 49%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: #999;
|
||||
|
||||
.text {
|
||||
color: #929292;
|
||||
text {
|
||||
color: #23262e;
|
||||
}
|
||||
}
|
||||
|
||||
.nitem:nth-of-type(2n) {
|
||||
width: 35%;
|
||||
}
|
||||
|
||||
.nitem:nth-of-type(2n - 1) {
|
||||
width: 63%;
|
||||
}
|
||||
}
|
||||
|
||||
.status {
|
||||
margin-top: 5px;
|
||||
font-size: 16px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 23px;
|
||||
|
||||
.nStarted {
|
||||
color: #bbb;
|
||||
p {
|
||||
padding: 5px;
|
||||
border-radius: 13px 0 0 13px;
|
||||
}
|
||||
|
||||
.complete {
|
||||
.dfs {
|
||||
color: #0067CF;
|
||||
background: #F1F8FF;
|
||||
}
|
||||
|
||||
.zyz {
|
||||
color: #04B578;
|
||||
background: #E8FFF7;
|
||||
}
|
||||
|
||||
.ywc {
|
||||
color: #666666;
|
||||
background: #F7F7F7;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
<!-- <button class="button" type="default" @click="ask">装船要求</button> -->
|
||||
<button class="button" type="default" @click="distribute('center','solo')">指令下发</button>
|
||||
</template>
|
||||
<template v-if="tabsValue == 2">
|
||||
<template v-if="tabsValue == 2 || tabsValue == 3 || tabsValue == 4">
|
||||
<button class="button" type="default" @click="ask">装船要求</button>
|
||||
</template>
|
||||
</view>
|
||||
|
|
@ -518,15 +518,9 @@
|
|||
<view></view>
|
||||
<view class="main main2">
|
||||
<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 class="li" v-for="(item,index) in pzPotList" :key="index">
|
||||
<view class="color" :style="item.background"></view>
|
||||
<view class="name">{{item.potCnname}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<template v-for="(item,index) in imgInfo.cabinInfoList">
|
||||
|
|
@ -574,44 +568,48 @@
|
|||
</view>
|
||||
|
||||
<view class="tableHead" @click="clickShow(item)">
|
||||
<text>货物明细</text>
|
||||
<uni-icons class="jt" type="bottom" size="24" v-if="item.isShow"></uni-icons>
|
||||
<uni-icons class="jt" type="top" size="24" v-if="!item.isShow"></uni-icons>
|
||||
<text>{{item.shipDecks}}层明细({{goodsInfo[index].stowageList.length}})</text>
|
||||
<p v-if="item.isShow">折叠</p>
|
||||
<p v-if="!item.isShow">展开</p>
|
||||
</view>
|
||||
<uni-table border stripe emptyText="暂无更多数据" v-if="item.isShow">
|
||||
<!-- 表头行 -->
|
||||
<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>
|
||||
<!-- 表格数据行 -->
|
||||
<template v-if="goodsInfo.length && goodsInfo.length > 0">
|
||||
<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>
|
||||
<view class="tableBox">
|
||||
<uni-table stripe emptyText="暂无更多数据" v-if="item.isShow">
|
||||
<!-- 表头行 -->
|
||||
<uni-tr>
|
||||
<uni-th width="20">积载编号</uni-th>
|
||||
<uni-th width="20">提单号</uni-th>
|
||||
<uni-th width="20">港口</uni-th>
|
||||
<uni-th width="20">品牌</uni-th>
|
||||
<uni-th width="20">车型</uni-th>
|
||||
<uni-th width="20">型号</uni-th>
|
||||
<uni-th width="20">车型明细</uni-th>
|
||||
<uni-th width="20">数量</uni-th>
|
||||
<uni-th width="20">长</uni-th>
|
||||
<uni-th width="20">宽</uni-th>
|
||||
<uni-th width="20">高</uni-th>
|
||||
<uni-th width="20">位置</uni-th>
|
||||
</uni-tr>
|
||||
</template>
|
||||
</uni-table>
|
||||
<!-- 表格数据行 -->
|
||||
<template v-if="goodsInfo.length && goodsInfo.length > 0">
|
||||
<uni-tr v-for="(item2,index2) in goodsInfo[index].stowageList"
|
||||
:key="index2">
|
||||
<uni-td>{{item2.stowageNo}}</uni-td>
|
||||
<uni-td>{{item2.mnfBl}}</uni-td>
|
||||
<uni-td>{{item2.potName}}</uni-td>
|
||||
<uni-td>{{item2.brdName}}</uni-td>
|
||||
<uni-td>{{item2.goodsTypeName}}</uni-td>
|
||||
<uni-td>{{item2.model}}</uni-td>
|
||||
<uni-td>{{item2.bvdName}}</uni-td>
|
||||
<uni-td>{{item2.amount}}</uni-td>
|
||||
<uni-td>{{item2.carLength}}</uni-td>
|
||||
<uni-td>{{item2.carWidth}}</uni-td>
|
||||
<uni-td>{{item2.carHeight}}</uni-td>
|
||||
<uni-td>{{item2.cabinNoList}}</uni-td>
|
||||
</uni-tr>
|
||||
</template>
|
||||
</uni-table>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
|
|
@ -619,7 +617,7 @@
|
|||
<custom-tab-pane :label="cwtName" name="c1_4" v-if="cwtIsShow">
|
||||
<view class="main" v-if="isCwnum == 0">
|
||||
<view></view>
|
||||
<view class="form">
|
||||
<view class="form form2">
|
||||
<view class="inputBox">
|
||||
<view class="leftInput">
|
||||
<uni-easyinput class="uni-mt-5" suffixIcon="search" v-model="mnfBl"
|
||||
|
|
@ -684,10 +682,12 @@
|
|||
<zb-tooltip placement="top-start" color="white"
|
||||
:visible.sync="v.isShow">
|
||||
<view slot="content">
|
||||
<view>
|
||||
<p v-for="(item2,idx) in v.carDetailList" :key="idx">
|
||||
{{item2.storeLine}}道，{{item2.storeSeatAmout}}车位
|
||||
</p>
|
||||
<view class="tipBox">
|
||||
<view class="li" v-for="(item2,idx) in v.carDetailList"
|
||||
:key="idx">
|
||||
<p>{{item2.storeLine}}道</p>
|
||||
<text>{{item2.storeSeatAmout}}车位</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 100%; height: 100%;">
|
||||
|
|
@ -712,19 +712,6 @@
|
|||
:brdId="brdId" :bvmId="bvmId" :potId="potId" :mnfBl="mnfBl"></place>
|
||||
</template>
|
||||
</custom-tab-pane>
|
||||
<custom-tab-pane :label="zcyqName" name="c1_5" v-if="zcyqIsShow">
|
||||
<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-drawer ref="showRight" mode="right" :mask-click="false">
|
||||
<view class="scroll-view">
|
||||
|
|
@ -804,7 +791,7 @@
|
|||
<uni-easyinput type="textarea" v-model="askValue" placeholder="请输入内容..."
|
||||
:disabled="askDisabled"></uni-easyinput>
|
||||
<view class="popupBtn">
|
||||
<view class="btnList">
|
||||
<view class="btnList" v-if="tabsValue == 0">
|
||||
<button class="button" type="default" @click="zcCancel">取 消</button>
|
||||
<button class="button" type="primary" @click="zcConfirm">提 交</button>
|
||||
</view>
|
||||
|
|
@ -927,9 +914,6 @@
|
|||
// 场位图显示
|
||||
cwtIsShow: false,
|
||||
cwtName: "",
|
||||
// 装船要求信息
|
||||
zcyqIsShow: false,
|
||||
zcyqName: "",
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -964,9 +948,6 @@
|
|||
} else if (e.code == "B5") {
|
||||
this.cwtIsShow = true
|
||||
this.cwtName = e.name
|
||||
} else if (e.code == "B6") {
|
||||
this.zcyqIsShow = true
|
||||
this.zcyqName = e.name
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
@ -1010,10 +991,10 @@
|
|||
this.activeIndex = 0
|
||||
if (e.value == 1 || e.value == 2) {
|
||||
this.loadOtherOrder()
|
||||
// this.askDisabled = true
|
||||
this.askDisabled = true
|
||||
} else if (e.value == 0) {
|
||||
this.loadSumOrder()
|
||||
// this.askDisabled = false
|
||||
this.askDisabled = false
|
||||
} else if (e.value == 3) {
|
||||
this.getPotList()
|
||||
this.getImgInfo()
|
||||
|
|
@ -1162,7 +1143,6 @@
|
|||
// }
|
||||
this.getBottomInfo(v.lwpId, index)
|
||||
})
|
||||
console.log(this.itemList)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
|
@ -1856,26 +1836,8 @@
|
|||
|
||||
.main2 {
|
||||
overflow: auto;
|
||||
}
|
||||
background-color: #fff;
|
||||
|
||||
.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 {
|
||||
|
|
@ -1903,16 +1865,21 @@
|
|||
|
||||
/deep/.uni-easyinput {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
/deep/.content-clear-icon {
|
||||
padding-right: 16px;
|
||||
}
|
||||
/deep/.content-clear-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/deep/.is-input-border {
|
||||
border-radius: 18.5px;
|
||||
}
|
||||
|
||||
/deep/.uni-easyinput__placeholder-class {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.rightInput {
|
||||
display: flex;
|
||||
|
||||
|
|
@ -1931,6 +1898,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
.form2 {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.buttonlist {
|
||||
padding: 10px;
|
||||
position: absolute;
|
||||
|
|
@ -1990,6 +1961,7 @@
|
|||
|
||||
.tjList {
|
||||
width: 240px;
|
||||
height: calc(100vh - 68px - 66px - 51px);
|
||||
background: #EBEDF1;
|
||||
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.10);
|
||||
float: left;
|
||||
|
|
@ -2003,6 +1975,7 @@
|
|||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
line-height: 21px;
|
||||
|
||||
p {
|
||||
color: #23262E;
|
||||
|
|
@ -2044,12 +2017,12 @@
|
|||
|
||||
.bottomInfo {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 9px;
|
||||
|
||||
p {
|
||||
font-size: 12px;
|
||||
color: #999999;
|
||||
margin-left: 10px;
|
||||
|
||||
text {
|
||||
margin-left: 4px;
|
||||
|
|
@ -2074,12 +2047,12 @@
|
|||
height: 87px;
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
padding: 16px 15px;
|
||||
padding: 16px;
|
||||
position: relative;
|
||||
|
||||
.imgBox {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
|
|
@ -2096,8 +2069,8 @@
|
|||
border-radius: 4px;
|
||||
|
||||
.imgBox {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
|
|
@ -2126,7 +2099,7 @@
|
|||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8px;
|
||||
padding: 12px 6px 1px;
|
||||
padding: 16px;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -2356,59 +2329,32 @@
|
|||
|
||||
.pzPot {
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 15px;
|
||||
|
||||
.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;
|
||||
.li {
|
||||
margin-right: 9px;
|
||||
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;
|
||||
}
|
||||
.name {
|
||||
font-size: 14px;
|
||||
color: rgba(0, 0, 0, 0.60);
|
||||
max-width: 126px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.color {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
margin: 6px
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.imgTable {
|
||||
|
|
@ -2416,13 +2362,19 @@
|
|||
padding: 0 20px 20px;
|
||||
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
font-family: MicrosoftYaHei-Bold;
|
||||
font-size: 22px;
|
||||
color: #999999;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.nr {
|
||||
margin: 10px 0;
|
||||
font-size: 16px;
|
||||
|
||||
.text {
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.imgLi {
|
||||
|
|
@ -2470,7 +2422,7 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin-left: 10px;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.imgSize {
|
||||
|
|
@ -2514,28 +2466,35 @@
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 12px;
|
||||
font-size: 20px;
|
||||
border: 1px solid #f2f2f2;
|
||||
|
||||
text {
|
||||
font-size: 18px;
|
||||
color: #0D518B;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 15px;
|
||||
color: #1677FF;
|
||||
}
|
||||
}
|
||||
|
||||
.gray {
|
||||
background-color: #fff;
|
||||
}
|
||||
.tableBox {
|
||||
/deep/.uni-table-th {
|
||||
background-color: #f4f4f4;
|
||||
color: #0B266A;
|
||||
font-size: 15px;
|
||||
|
||||
.uni-table-th-content {
|
||||
padding-left: 7.5px;
|
||||
border-left: 1px solid #C3CBD8;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
line-height: 50px;
|
||||
font-size: 21px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.text {
|
||||
display: inline-block;
|
||||
margin-right: 50px;
|
||||
}
|
||||
|
||||
/deep/.table--border {
|
||||
background-color: #fff;
|
||||
/deep/.uni-table-td {
|
||||
padding-left: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -2571,18 +2530,15 @@
|
|||
height: 100%;
|
||||
overflow: scroll;
|
||||
padding-left: 18px;
|
||||
background: #F5F6FA;
|
||||
background: #FAFAFA;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 10px;
|
||||
padding: 8px 16px;
|
||||
padding-bottom: 16px;
|
||||
|
||||
.rightBox {
|
||||
width: calc(33.3% - 10px);
|
||||
width: 33.3%;
|
||||
height: 214px;
|
||||
border: 1px solid #E1E5ED;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
/deep/.zb_tooltip_content {
|
||||
width: 100%;
|
||||
|
|
@ -2650,6 +2606,7 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 8px;
|
||||
background-color: #e1e5ed !important;
|
||||
}
|
||||
|
||||
/deep/.progress-bar .bar-double {
|
||||
|
|
@ -2687,6 +2644,29 @@
|
|||
color: #1677FF;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.tipBox {
|
||||
width: 150px;
|
||||
height: 50px;
|
||||
overflow: scroll;
|
||||
|
||||
.li {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 10px 0;
|
||||
border-bottom: 1px solid #999;
|
||||
font-size: 16px;
|
||||
|
||||
p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #23262E;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -2796,14 +2776,14 @@
|
|||
|
||||
.drawerTop {
|
||||
display: flex;
|
||||
margin-top: 55px;
|
||||
margin-top: 24px;
|
||||
margin-bottom: 30px;
|
||||
|
||||
image {
|
||||
width: 14px;
|
||||
height: 24px;
|
||||
margin-right: 16px;
|
||||
margin-top: 3px;
|
||||
width: 10px;
|
||||
height: 14px;
|
||||
margin-right: 10px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
text {
|
||||
|
|
|
|||
|
|
@ -136,25 +136,25 @@
|
|||
<text>货物明细</text>
|
||||
</view>
|
||||
<view class="formNr">
|
||||
<uni-table border stripe emptyText="暂无更多数据">
|
||||
<uni-table stripe emptyText="暂无更多数据">
|
||||
<!-- 表头行 -->
|
||||
<uni-tr class="gray">
|
||||
<uni-th align="center" width="10">序号</uni-th>
|
||||
<uni-th align="center" width="22">车架号/条形码</uni-th>
|
||||
<uni-th align="center" width="15">作业状态</uni-th>
|
||||
<uni-th align="center" width="40">场位</uni-th>
|
||||
<uni-th align="center" width="15">货物性质</uni-th>
|
||||
<uni-th align="center" width="10">操作</uni-th>
|
||||
<uni-tr>
|
||||
<uni-th width="10">序号</uni-th>
|
||||
<uni-th width="22">车架号/条形码</uni-th>
|
||||
<uni-th width="15">作业状态</uni-th>
|
||||
<uni-th width="40">场位</uni-th>
|
||||
<uni-th width="15">货物性质</uni-th>
|
||||
<uni-th width="10">操作</uni-th>
|
||||
</uni-tr>
|
||||
<!-- 表格数据行 -->
|
||||
<uni-tr v-for="(item,index) in tableList" :key="index">
|
||||
<uni-td align="center">{{index + 1}}</uni-td>
|
||||
<uni-td align="center">{{item.vinCode}}</uni-td>
|
||||
<uni-td align="center">{{item.workStatus}}</uni-td>
|
||||
<uni-td align="center" v-if="objInfo.tradeName == 'W'">{{item.yardPosition}}</uni-td>
|
||||
<uni-td align="center" v-if="objInfo.tradeName == 'N'">{{item.yardPos}}</uni-td>
|
||||
<uni-td align="center">{{item.natureFlagName}}</uni-td>
|
||||
<uni-td align="center">
|
||||
<uni-td>{{index + 1}}</uni-td>
|
||||
<uni-td>{{item.vinCode}}</uni-td>
|
||||
<uni-td>{{item.workStatus}}</uni-td>
|
||||
<uni-td v-if="objInfo.tradeName == 'W'">{{item.yardPosition}}</uni-td>
|
||||
<uni-td v-if="objInfo.tradeName == 'N'">{{item.yardPos}}</uni-td>
|
||||
<uni-td>{{item.natureFlagName}}</uni-td>
|
||||
<uni-td>
|
||||
<text class="operate" @click="open(item)">残损</text>
|
||||
</uni-td>
|
||||
</uni-tr>
|
||||
|
|
@ -438,14 +438,24 @@
|
|||
}
|
||||
|
||||
.formNr {
|
||||
.gray {
|
||||
background-color: #f9f9f9;
|
||||
/deep/.uni-table-th {
|
||||
background-color: #f4f4f4;
|
||||
color: #0B266A;
|
||||
font-size: 15px;
|
||||
|
||||
.uni-table-th-content {
|
||||
padding-left: 7.5px;
|
||||
border-left: 1px solid #C3CBD8;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.uni-table-td {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.operate {
|
||||
color: #2979ff;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -52,8 +52,7 @@
|
|||
<text>已停放车辆：{{lineData.stopGoodsAmout}}辆</text>
|
||||
</view>
|
||||
<view class="placeContent" v-if="selectValue == 1">
|
||||
<view class="placeList" style="border: 1px solid #E1E5ED;"
|
||||
v-for="(item,index) in lineData.lineStatisticsList">
|
||||
<view class="placeList" v-for="(item,index) in lineData.lineStatisticsList">
|
||||
<view class="listLeft">
|
||||
<template>
|
||||
<p><template v-if="item.yalNo >= 1 && item.yalNo <= 9">0</template>{{item.yalNo}}道</p>
|
||||
|
|
@ -250,7 +249,7 @@
|
|||
<style lang="less" scoped>
|
||||
.place {
|
||||
.placeTop {
|
||||
padding: 12px 16px;
|
||||
padding: 8px 16px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background-color: #F6F7F9;
|
||||
|
|
@ -318,6 +317,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
/deep/.uni-select {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
/deep/.uni-icons {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
@ -351,7 +354,6 @@
|
|||
padding: 10px 16px;
|
||||
width: 100%;
|
||||
background: #E6F4FF;
|
||||
border: 1px solid #BAE0FF;
|
||||
|
||||
text {
|
||||
margin-right: 20px;
|
||||
|
|
@ -401,6 +403,8 @@
|
|||
.placeList {
|
||||
display: flex;
|
||||
height: 70px;
|
||||
border: 1px solid #E1E5ED;
|
||||
border-bottom: none;
|
||||
|
||||
.listLeft {
|
||||
width: 80px;
|
||||
|
|
@ -440,7 +444,12 @@
|
|||
}
|
||||
|
||||
.wsy {
|
||||
background: #EEEEEE;
|
||||
background: #f7f9ff;
|
||||
|
||||
text {
|
||||
padding: 5px 10px;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.sy {
|
||||
|
|
@ -479,7 +488,6 @@
|
|||
|
||||
p {
|
||||
text-align: center;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
p:last-child {
|
||||
|
|
@ -500,6 +508,13 @@
|
|||
|
||||
.kz {
|
||||
background: #F7F9FF;
|
||||
text-align: center;
|
||||
|
||||
.kzText {
|
||||
padding: 5px 10px;
|
||||
background-color: #fff;
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
p:first-child {
|
||||
width: 70%;
|
||||
|
|
@ -532,6 +547,10 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeList:last-child {
|
||||
border-bottom: 1px solid #E1E5ED;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,7 +1,8 @@
|
|||
<template>
|
||||
<view class="login">
|
||||
<view class="leftImg">
|
||||
<image src="../../static/images/shipWork/loginImg.png"></image>
|
||||
<image :style="'height:'+screenHeight+'px !important;'" src="../../static/images/shipWork/loginImg.png">
|
||||
</image>
|
||||
<view class="pBox">
|
||||
<p>海通国际码头</p>
|
||||
<p>智能管控系统</p>
|
||||
|
|
@ -11,7 +12,7 @@
|
|||
<view class="loginTop">
|
||||
<image src="../../static/images/theme/logo.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="loginInfo">
|
||||
<scroll-view scroll-y="true" class="loginInfo">
|
||||
<view class="loginTitle">
|
||||
<p>账号密码登录</p>
|
||||
</view>
|
||||
|
|
@ -25,30 +26,30 @@
|
|||
</uni-easyinput>
|
||||
<button class="button" @click="loginGo('center')">立即登录</button>
|
||||
</view>
|
||||
</view>
|
||||
<uni-popup ref="popup" background-color="#fff" @maskClick="close">
|
||||
<view class="popupBox">
|
||||
<view class="popupTitle">
|
||||
请选择港区
|
||||
</view>
|
||||
<view class="ul">
|
||||
<view class="li" v-for="(item,index) in portList" :key="index"
|
||||
:class="{active:activeIndex == index}" @click="selectPort(item,index)">
|
||||
<text>{{item.pamName}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btnBox">
|
||||
<button class="btn" type="primary" @click="toGo">确 定</button>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<uni-popup ref="popup" background-color="#fff" @maskClick="close">
|
||||
<view class="popupBox">
|
||||
<view class="popupTitle">
|
||||
请选择港区
|
||||
</view>
|
||||
<view class="ul">
|
||||
<view class="li" v-for="(item,index) in portList" :key="index"
|
||||
:class="{active:activeIndex == index}" @click="selectPort(item,index)">
|
||||
<text>{{item.pamName}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
<uni-popup ref="popup2" type="dialog">
|
||||
<uni-popup-dialog type="error" title="通知" content="未开通权限，请联系管理员"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<uni-popup ref="popup3" type="dialog">
|
||||
<uni-popup-dialog type="error" title="通知" :content="errorTitle"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
</view>
|
||||
<view class="btnBox">
|
||||
<button class="btn" type="primary" @click="toGo">确 定</button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
<uni-popup ref="popup2" type="dialog">
|
||||
<uni-popup-dialog type="error" title="通知" content="未开通权限，请联系管理员"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<uni-popup ref="popup3" type="dialog">
|
||||
<uni-popup-dialog type="error" title="通知" :content="errorTitle"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<LotusLoading :lotusLoadingData="lotusLoadingData"></LotusLoading>
|
||||
</view>
|
||||
</template>
|
||||
|
|
@ -64,6 +65,7 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
screenHeight: "",
|
||||
// rtoswuhan1 wuhan_ceshi1
|
||||
account: '',
|
||||
// q123456
|
||||
|
|
@ -89,6 +91,9 @@
|
|||
components: {
|
||||
LotusLoading
|
||||
},
|
||||
onLoad() {
|
||||
this.screenHeight = uni.getSystemInfoSync().windowHeight;
|
||||
},
|
||||
methods: {
|
||||
// 点击图标
|
||||
iconC() {
|
||||
|
|
@ -257,7 +262,7 @@
|
|||
.pBox {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 16.2%;
|
||||
top: 117px;
|
||||
text-align: center;
|
||||
|
||||
p {
|
||||
|
|
@ -284,9 +289,7 @@
|
|||
|
||||
.loginInfo {
|
||||
width: 350px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin-top: 148px;
|
||||
|
||||
.loginTitle {
|
||||
font-size: 20px;
|
||||
|
|
@ -302,69 +305,70 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/deep/.is-input-border {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.popupBox {
|
||||
width: 280px;
|
||||
height: 320px;
|
||||
/deep/.uni-popup .uni-popup__wrapper {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.popupTitle {
|
||||
width: 100%;
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
.popupBox {
|
||||
width: 280px;
|
||||
|
||||
.popupTitle {
|
||||
width: 100%;
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
color: #23262E;
|
||||
border-bottom: 1px solid #eee;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
}
|
||||
|
||||
.ul {
|
||||
padding: 30px;
|
||||
max-height: 310px;
|
||||
overflow: scroll;
|
||||
|
||||
.li {
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
text-align: center;
|
||||
border: 1px solid #e7e7e7;
|
||||
margin-bottom: 10px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #0079fe;
|
||||
border-color: #0079fe;
|
||||
}
|
||||
}
|
||||
|
||||
.btnBox {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
border-radius: 0 0 16px 16px;
|
||||
|
||||
.btn {
|
||||
width: 170px;
|
||||
font-size: 16px;
|
||||
color: #23262E;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #eee;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
height: 36px;
|
||||
line-height: 18px;
|
||||
background-color: #fff;
|
||||
border: 1px solid rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
.ul {
|
||||
padding: 30px;
|
||||
height: 213px;
|
||||
overflow: scroll;
|
||||
|
||||
.li {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
border: 1px solid #ccc;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #0079fe;
|
||||
border-color: #0079fe;
|
||||
}
|
||||
}
|
||||
|
||||
.btnBox {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
border-radius: 0 0 16px 16px;
|
||||
|
||||
.btn {
|
||||
width: 170px;
|
||||
font-size: 16px;
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
height: 36px;
|
||||
line-height: 18px;
|
||||
background-color: #fff;
|
||||
border: 1px solid rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
.btn:last-child {
|
||||
color: #fff;
|
||||
background-color: #0067CF;
|
||||
}
|
||||
.btn:last-child {
|
||||
color: #fff;
|
||||
background-color: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -238,10 +238,12 @@
|
|||
<zb-tooltip placement="top-start" color="white"
|
||||
:visible.sync="v.isShow">
|
||||
<view slot="content">
|
||||
<view>
|
||||
<p v-for="(item2,idx) in v.carDetailList" :key="idx">
|
||||
{{item2.storeLine}}道，{{item2.storeSeatAmout}}车位
|
||||
</p>
|
||||
<view class="tipBox">
|
||||
<view class="li" v-for="(item2,idx) in v.carDetailList"
|
||||
:key="idx">
|
||||
<p>{{item2.storeLine}}道</p>
|
||||
<text>{{item2.storeSeatAmout}}车位</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 100%; height: 100%;">
|
||||
|
|
@ -1080,6 +1082,7 @@
|
|||
.container {
|
||||
height: 100vh;
|
||||
margin-top: 68px;
|
||||
background-color: #fff;
|
||||
|
||||
/deep/.tab .tab-bar {
|
||||
height: 66px;
|
||||
|
|
@ -1129,16 +1132,21 @@
|
|||
|
||||
/deep/.uni-easyinput {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
/deep/.content-clear-icon {
|
||||
padding-right: 16px;
|
||||
}
|
||||
/deep/.content-clear-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/deep/.is-input-border {
|
||||
border-radius: 18.5px;
|
||||
}
|
||||
|
||||
/deep/.uni-easyinput__placeholder-class {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.rightInput {
|
||||
display: flex;
|
||||
|
||||
|
|
@ -1163,8 +1171,8 @@
|
|||
.dataTitle {
|
||||
margin-top: 14px;
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
font-size: 14px;
|
||||
color: #1890FF;
|
||||
padding: 0 16px;
|
||||
|
|
@ -1251,7 +1259,7 @@
|
|||
display: flex;
|
||||
width: 100%;
|
||||
height: calc(100vh - 66px - 68px - 47px);
|
||||
margin-top: 16px;
|
||||
margin-top: 10px;
|
||||
|
||||
.cwLeft {
|
||||
width: 128px;
|
||||
|
|
@ -1285,18 +1293,15 @@
|
|||
height: 100%;
|
||||
overflow: scroll;
|
||||
padding-left: 18px;
|
||||
background: #F5F6FA;
|
||||
background: #FAFAFA;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 10px;
|
||||
padding: 8px 16px;
|
||||
padding-bottom: 16px;
|
||||
|
||||
.rightBox {
|
||||
width: calc(33.3% - 10px);
|
||||
width: 33.3%;
|
||||
height: 214px;
|
||||
border: 1px solid #E1E5ED;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
/deep/.zb_tooltip_content {
|
||||
width: 100%;
|
||||
|
|
@ -1364,6 +1369,7 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 8px;
|
||||
background-color: #e1e5ed !important;
|
||||
}
|
||||
|
||||
/deep/.progress-bar .bar-double {
|
||||
|
|
@ -1401,6 +1407,29 @@
|
|||
color: #1677FF;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.tipBox {
|
||||
width: 150px;
|
||||
height: 50px;
|
||||
overflow: scroll;
|
||||
|
||||
.li {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 10px 0;
|
||||
border-bottom: 1px solid #999;
|
||||
font-size: 16px;
|
||||
|
||||
p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #23262E;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1410,6 +1439,7 @@
|
|||
}
|
||||
|
||||
.tabs2 {
|
||||
background-color: #f5f6fa;
|
||||
margin-top: 66px;
|
||||
padding-bottom: 20px;
|
||||
|
||||
|
|
@ -1512,14 +1542,14 @@
|
|||
|
||||
.drawerTop {
|
||||
display: flex;
|
||||
margin-top: 55px;
|
||||
margin-top: 24px;
|
||||
margin-bottom: 30px;
|
||||
|
||||
image {
|
||||
width: 14px;
|
||||
height: 24px;
|
||||
margin-right: 16px;
|
||||
margin-top: 3px;
|
||||
width: 10px;
|
||||
height: 14px;
|
||||
margin-right: 10px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
text {
|
||||
|
|
|
|||
|
|
@ -52,8 +52,7 @@
|
|||
<text>已停放车辆：{{lineData.stopGoodsAmout}}辆</text>
|
||||
</view>
|
||||
<view class="placeContent" v-if="selectValue == 1">
|
||||
<view class="placeList" style="border: 1px solid #E1E5ED;"
|
||||
v-for="(item,index) in lineData.lineStatisticsList">
|
||||
<view class="placeList" v-for="(item,index) in lineData.lineStatisticsList">
|
||||
<view class="listLeft">
|
||||
<template>
|
||||
<p><template v-if="item.yalNo >= 1 && item.yalNo <= 9">0</template>{{item.yalNo}}道</p>
|
||||
|
|
@ -108,7 +107,7 @@
|
|||
<image src="../../static/images/wjhIcon.png" mode="" v-if="item2.godStatus == 'N'">
|
||||
</image>
|
||||
</view>
|
||||
<p>空置</p>
|
||||
<text class="kzText">空置</text>
|
||||
<p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p>
|
||||
</view>
|
||||
<view class="seatBox sy" :class="{syGl:item2.existFlag == '1'}" :key="index2"
|
||||
|
|
@ -289,7 +288,7 @@
|
|||
margin-right: 20px;
|
||||
|
||||
.kz {
|
||||
background: #EEEEEE;
|
||||
background: #F7F9FF;
|
||||
border: 1px solid #DCDCDC;
|
||||
}
|
||||
|
||||
|
|
@ -447,7 +446,12 @@
|
|||
}
|
||||
|
||||
.wsy {
|
||||
background: #EEEEEE;
|
||||
background: #f7f9ff;
|
||||
|
||||
text {
|
||||
padding: 5px 10px;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.sy {
|
||||
|
|
@ -486,7 +490,6 @@
|
|||
|
||||
p {
|
||||
text-align: center;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
p:last-child {
|
||||
|
|
@ -507,6 +510,13 @@
|
|||
|
||||
.kz {
|
||||
background: #F7F9FF;
|
||||
text-align: center;
|
||||
|
||||
.kzText {
|
||||
padding: 5px 10px;
|
||||
background-color: #fff;
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
p:first-child {
|
||||
width: 70%;
|
||||
|
|
@ -539,6 +549,10 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeList:last-child {
|
||||
border-bottom: 1px solid #E1E5ED;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -28,7 +28,7 @@
|
|||
<image src="../../static/images/zlIcon.png"></image>
|
||||
<text>板车照片</text>
|
||||
</view>
|
||||
<view class="picture">
|
||||
<view class="picture" :class="{picture2 : boardCarPhotos > 0}">
|
||||
<template v-for="(item,index) in boardCarPhotos">
|
||||
<image :key="item" :src="item" @click="clickImg(boardCarPhotos,index)"></image>
|
||||
</template>
|
||||
|
|
@ -39,7 +39,7 @@
|
|||
<image src="../../static/images/cpIcon.png"></image>
|
||||
<text>板车车牌照</text>
|
||||
</view>
|
||||
<view class="picture">
|
||||
<view class="picture" :class="{picture2 : boardCarList > 0}">
|
||||
<template v-for="(item,index) in boardCarList">
|
||||
<image :key="item" :src="item" @click="clickImg(boardCarList,index)"></image>
|
||||
</template>
|
||||
|
|
@ -121,7 +121,7 @@
|
|||
<image src="../../static/images/zsIcon.png"></image>
|
||||
<text>质损照片</text>
|
||||
</view>
|
||||
<view class="picture">
|
||||
<view class="picture" :class="{picture2 : qualityDamage > 0}">
|
||||
<template v-for="(item,index) in qualityDamage">
|
||||
<image :key="item" :src="item" @click="clickImg(qualityDamage,index)"></image>
|
||||
</template>
|
||||
|
|
@ -132,7 +132,7 @@
|
|||
<image src="../../static/images/cjhIcon.png"></image>
|
||||
<text>车架号图片</text>
|
||||
</view>
|
||||
<view class="picture">
|
||||
<view class="picture" :class="{picture2 : carFrameNumber > 0}">
|
||||
<template v-for="(item,index) in carFrameNumber">
|
||||
<image :key="item" :src="item" @click="clickImg(carFrameNumber,index)"></image>
|
||||
</template>
|
||||
|
|
@ -273,13 +273,14 @@
|
|||
}
|
||||
|
||||
.itemBox {
|
||||
padding: 24px 16px;
|
||||
padding: 16px;
|
||||
background: #fff;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.formTitle {
|
||||
font-size: 18px;
|
||||
color: #666;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
|
||||
|
|
@ -292,7 +293,6 @@
|
|||
}
|
||||
|
||||
.picture {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
|
|
@ -303,6 +303,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
.picture2 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.zsInfo {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
|
|
|||
|
|
@ -25,12 +25,6 @@
|
|||
</template>
|
||||
</radio-group>
|
||||
<view class="radioInput">
|
||||
<!-- <uInput v-model="feed" type="textarea" :autoHeight="true" placeholder="请输入客户反馈内容"
|
||||
:maxLength="200" @click="inputFocus" @blur="inputBlur" v-if="current == '客户反馈'" />
|
||||
</uInput>
|
||||
<uInput v-model="remark" type="textarea" :autoHeight="true" placeholder="请输入其他内容"
|
||||
:maxLength="200" @click="inputFocus" @blur="inputBlur" v-if="current == '其他'" />
|
||||
</uInput> -->
|
||||
<template v-if="isFeed">
|
||||
<uni-easyinput type="textarea" autoHeight v-model="feed" placeholder="请输入客户反馈内容"
|
||||
maxlength="200" @focus="inputFocus" @blur="inputBlur"></uni-easyinput>
|
||||
|
|
@ -218,7 +212,6 @@
|
|||
<script>
|
||||
import LotusLoading from "../../components/Winglau14-lotusLoading/Winglau14-LotusLoading.vue";
|
||||
import signRegion from "../quality/sign.vue";
|
||||
import uInput from "../../components/u-input/index.vue";
|
||||
export default {
|
||||
name: "monEdit",
|
||||
data() {
|
||||
|
|
@ -369,7 +362,6 @@
|
|||
components: {
|
||||
LotusLoading,
|
||||
signRegion,
|
||||
uInput
|
||||
},
|
||||
onShow() {
|
||||
let signImg = uni.getStorageSync('signImg')
|
||||
|
|
@ -380,6 +372,7 @@
|
|||
this.baseImg(this.signImg, "1")
|
||||
}
|
||||
let hzzsImg = uni.getStorageSync('hzzsImg')
|
||||
console.log(hzzsImg)
|
||||
if (hzzsImg != "") {
|
||||
this.hzzsImg = uni.getStorageSync('hzzsImg')
|
||||
}
|
||||
|
|
@ -1433,7 +1426,7 @@
|
|||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background: #fff;
|
||||
z-index: 999;
|
||||
z-index: 996;
|
||||
|
||||
/deep/.uni-steps {
|
||||
height: 80px;
|
||||
|
|
@ -1446,7 +1439,7 @@
|
|||
|
||||
/deep/.uni-steps__row-title {
|
||||
font-size: 16px;
|
||||
margin-top: 16px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/deep/.uni-icons {
|
||||
|
|
@ -1456,6 +1449,12 @@
|
|||
/deep/.uni-steps__row-container {
|
||||
margin-top: 14px;
|
||||
}
|
||||
|
||||
/deep/.uni-steps__row-circle {
|
||||
background-color: #fff !important;
|
||||
border: 3px solid #B7BDC6;
|
||||
padding: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
|
|
@ -1499,13 +1498,17 @@
|
|||
.radioList {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 20px;
|
||||
margin-top: 24px;
|
||||
|
||||
.radioBox {
|
||||
display: flex;
|
||||
width: 15%;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
/deep/uni-radio .uni-radio-input {
|
||||
border: 1px solid #dcdfe6;
|
||||
}
|
||||
}
|
||||
|
||||
.radioInput {
|
||||
|
|
@ -1514,13 +1517,23 @@
|
|||
}
|
||||
|
||||
.picture {
|
||||
margin-top: 30px;
|
||||
margin-top: 24px;
|
||||
|
||||
/deep/.file-picker__box {
|
||||
width: 120px !important;
|
||||
height: 120px !important;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
/deep/.is-add {
|
||||
background: url(../../static/images/xjpz.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
border: 1px solid transparent !important;
|
||||
|
||||
.is-add {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.inputBox {
|
||||
|
|
@ -1538,9 +1551,13 @@
|
|||
|
||||
.sign {
|
||||
color: #2979ff;
|
||||
width: 160px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
margin-left: 20px;
|
||||
font-size: 16px;
|
||||
border: 1px solid #2979ff;
|
||||
}
|
||||
|
||||
.editSign {
|
||||
|
|
@ -1589,7 +1606,7 @@
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #EEEEEE;
|
||||
padding: 16px;
|
||||
padding: 10px;
|
||||
|
||||
.liTitle {
|
||||
min-width: 120px;
|
||||
|
|
|
|||
|
|
@ -9,12 +9,9 @@
|
|||
<uni-easyinput suffixIcon="search" v-model="carValue" placeholder="请输入车架号"
|
||||
@iconClick="iconClick">
|
||||
</uni-easyinput>
|
||||
<superwei-combox class="select" :candidates="shipList" :isJSON="true" keyName="shipVvy"
|
||||
placeholder="船名/航次" v-model="shipValue" @select="shipChange"
|
||||
@input="shipInput"></superwei-combox>
|
||||
<button class="btn" @click="onSearch">搜索</button>
|
||||
</view>
|
||||
<view class="right" @click="screen">
|
||||
<p>船名/航次<uni-icons type="bottom" style="margin-left: 5px;" size="16"></uni-icons></p>
|
||||
<p>质损环节<uni-icons type="bottom" style="margin-left: 5px;" size="16"></uni-icons></p>
|
||||
<p>品牌<uni-icons type="bottom" style="margin-left: 5px;" size="16"></uni-icons></p>
|
||||
</view>
|
||||
|
|
@ -96,6 +93,12 @@
|
|||
<image src="../../static/images/leftJt.png" mode=""></image>
|
||||
<text>返回</text>
|
||||
</view>
|
||||
<view class="drawerTitle">
|
||||
船名/航次
|
||||
</view>
|
||||
<superwei-combox class="select" :candidates="shipList" :isJSON="true" keyName="shipVvy"
|
||||
placeholder="船名/航次" v-model="shipValue" @select="shipChange"
|
||||
@input="shipInput"></superwei-combox>
|
||||
<view class="drawerTitle">
|
||||
质损环节
|
||||
</view>
|
||||
|
|
@ -189,10 +192,6 @@
|
|||
iconClick() {
|
||||
this.initData()
|
||||
},
|
||||
// 搜索按钮
|
||||
onSearch() {
|
||||
this.initData()
|
||||
},
|
||||
// 点击筛选
|
||||
screen() {
|
||||
this.$refs.showRight.open();
|
||||
|
|
@ -203,6 +202,10 @@
|
|||
},
|
||||
// 重置
|
||||
reset() {
|
||||
// 船名/航次
|
||||
this.shipId = ""
|
||||
this.shipValue = ""
|
||||
this.vvyId = ""
|
||||
// 质损环节下拉
|
||||
this.zshjId = ""
|
||||
this.zshjName = ""
|
||||
|
|
@ -261,7 +264,6 @@
|
|||
this.shipId = e.vslCd
|
||||
this.shipValue = e.shipVvy
|
||||
this.vvyId = e.vvyId
|
||||
this.current = 1
|
||||
},
|
||||
// 质损环节下拉
|
||||
zshjChange(e) {
|
||||
|
|
@ -405,14 +407,14 @@
|
|||
position: fixed;
|
||||
right: 50px;
|
||||
bottom: 50px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
border-radius: 50%;
|
||||
background-color: #2979ff;
|
||||
color: #fff;
|
||||
font-size: 24px;
|
||||
font-size: 22px;
|
||||
text-align: center;
|
||||
line-height: 100px;
|
||||
line-height: 90px;
|
||||
font-weight: bold;
|
||||
z-index: 999;
|
||||
}
|
||||
|
|
@ -424,7 +426,7 @@
|
|||
background: #FAFAFA;
|
||||
border-top: 1px solid #EEEEEE;
|
||||
border-bottom: 1px solid #EEEEEE;
|
||||
padding: 10px;
|
||||
padding: 10px 16px;
|
||||
position: fixed;
|
||||
top: 66px;
|
||||
z-index: 995;
|
||||
|
|
@ -450,6 +452,15 @@
|
|||
padding-left: 10px;
|
||||
}
|
||||
|
||||
/deep/.content-clear-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/deep/.uni-easyinput__placeholder-class {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.btn {
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
|
|
@ -538,6 +549,9 @@
|
|||
|
||||
.col {
|
||||
margin-bottom: 10px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -571,14 +585,14 @@
|
|||
|
||||
.drawerTop {
|
||||
display: flex;
|
||||
margin-top: 55px;
|
||||
margin-top: 24px;
|
||||
margin-bottom: 30px;
|
||||
|
||||
image {
|
||||
width: 14px;
|
||||
height: 24px;
|
||||
margin-right: 16px;
|
||||
margin-top: 3px;
|
||||
width: 10px;
|
||||
height: 14px;
|
||||
margin-right: 10px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
text {
|
||||
|
|
|
|||
|
|
@ -9,9 +9,9 @@
|
|||
class="canvsborder"></canvas>
|
||||
</view>
|
||||
<view class="sigh-btns">
|
||||
<van-button class="btn" type="default" @tap="handleCancel">取消</van-button>
|
||||
<van-button class="btn" type="default" @tap="handleReset">重写</van-button>
|
||||
<van-button class="btn" type="default" @tap="handleConfirm">确认</van-button>
|
||||
<view class="btn qx" @click="handleCancel">取消</view>
|
||||
<view class="btn qc" @click="handleReset">清除</view>
|
||||
<view class="btn bc" @click="handleConfirm">保存</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -215,6 +215,10 @@
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.container {
|
||||
height: calc(100vh - 68px);
|
||||
padding-bottom: 30px;
|
||||
|
|
@ -236,21 +240,43 @@
|
|||
.sigh-btns {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 10px 10px 0;
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
/deep/.van-button {
|
||||
width: 100px;
|
||||
height: 50px;
|
||||
background-color: #fff;
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.qc {
|
||||
color: #0067CF;
|
||||
background-color: rgba(0, 103, 207, 0.10);
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
|
||||
|
||||
.mycanvas {
|
||||
margin: auto 0rpx;
|
||||
background-color: #ececec;
|
||||
background-color: #fbfbfb;
|
||||
border: 1px dashed #eee;
|
||||
}
|
||||
|
||||
.canvsborder {
|
||||
|
|
|
|||
|
|
@ -11,9 +11,9 @@
|
|||
</view>
|
||||
</view>
|
||||
<view class="sigh-btns">
|
||||
<van-button class="btn" type="default" @tap="handleCancel">取消</van-button>
|
||||
<van-button class="btn" type="default" @tap="handleReset">重写</van-button>
|
||||
<van-button class="btn" type="default" @tap="handleConfirm">确认</van-button>
|
||||
<view class="btn qx" @click="handleCancel">取消</view>
|
||||
<view class="btn qc" @click="handleReset">清除</view>
|
||||
<view class="btn bc" @click="handleConfirm">保存</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -47,6 +47,7 @@
|
|||
if ('params' in options) {
|
||||
// 获取传递的对象参数，使用decodeURIComponent解码，并转为对象
|
||||
this.imgUrl = JSON.parse(decodeURIComponent(options.params)).imgUrl
|
||||
console.log(this.imgUrl)
|
||||
}
|
||||
this.loginObj = uni.getStorageSync('loginObj')
|
||||
if (this.imgUrl == "") {
|
||||
|
|
@ -67,7 +68,8 @@
|
|||
success: (res) => {
|
||||
if (res.statusCode == 200) {
|
||||
this.imgUrl = res.data
|
||||
this.init(this.imgUrl)
|
||||
console.log(this.imgUrl)
|
||||
this.init()
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
@ -107,7 +109,6 @@
|
|||
//每次触摸开始，开启新的路径
|
||||
this.ctx.beginPath();
|
||||
},
|
||||
|
||||
//触摸移动，获取到路径点
|
||||
touchmove: function(e) {
|
||||
let moveX = e.changedTouches[0].x;
|
||||
|
|
@ -123,12 +124,10 @@
|
|||
}
|
||||
tempPoint.push(movePoint);
|
||||
},
|
||||
|
||||
// 触摸结束，将未绘制的点清空防止对后续路径产生干扰
|
||||
touchend: function() {
|
||||
this.points = [];
|
||||
},
|
||||
|
||||
/* ***********************************************
|
||||
# 绘制笔迹
|
||||
# 1.为保证笔迹实时显示，必须在移动的同时绘制笔迹
|
||||
|
|
@ -146,16 +145,15 @@
|
|||
this.ctx.stroke();
|
||||
this.ctx.draw(true);
|
||||
},
|
||||
|
||||
handleCancel() {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
});
|
||||
},
|
||||
|
||||
//清空画布
|
||||
handleReset: function() {
|
||||
var that = this
|
||||
that.points = []
|
||||
uni.request({
|
||||
url: `${that.$local}/api/miniapp/typeRef/domain/REFERENCE_DIAGRAM`,
|
||||
header: {
|
||||
|
|
@ -172,12 +170,11 @@
|
|||
// that.ctx.clearRect(0, 0, 624, 224);
|
||||
// that.ctx.draw(true);
|
||||
// tempPoint = [];
|
||||
|
||||
},
|
||||
|
||||
//将签名笔迹上传到服务器，并将返回来的地址存到本地
|
||||
handleConfirm: function() {
|
||||
let that = this
|
||||
console.log(that.points)
|
||||
uni.canvasToTempFilePath({
|
||||
canvasId: 'mycanvas',
|
||||
success: function(e) {
|
||||
|
|
@ -195,32 +192,18 @@
|
|||
console.error(error)
|
||||
})
|
||||
});
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
base64ToFile(base64, name) {
|
||||
if (typeof base64 != 'string') {
|
||||
return;
|
||||
}
|
||||
var arr = base64.split(',')
|
||||
var type = arr[0].match(/:(.*?);/)[1]
|
||||
var fileExt = type.split('/')[1]
|
||||
var bstr = atob(arr[1])
|
||||
var n = bstr.length
|
||||
var u8arr = new Uint8Array(n)
|
||||
while (n--) {
|
||||
u8arr[n] = bstr.charCodeAt(n)
|
||||
}
|
||||
return new File([u8arr], `${name}.` + fileExt, {
|
||||
type: type
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.container {
|
||||
height: calc(100vh - 68px);
|
||||
padding-bottom: 30px;
|
||||
|
|
@ -241,26 +224,42 @@
|
|||
.sigh-btns {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 100px 10px 0;
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
/deep/.van-button {
|
||||
width: 100px;
|
||||
height: 50px;
|
||||
background-color: #fff;
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.qc {
|
||||
color: #0067CF;
|
||||
background-color: rgba(0, 103, 207, 0.10);
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
|
||||
.mycanvas {
|
||||
margin: auto 0rpx;
|
||||
background-color: transparent;
|
||||
margin-top: 130px;
|
||||
width: 624px;
|
||||
height: 224px;
|
||||
z-index: 999;
|
||||
transform: scale(1.75)
|
||||
background-color: #fff;
|
||||
border: 1px dashed #eee;
|
||||
}
|
||||
|
||||
.canvasBg {
|
||||
|
|
|
|||
|
|
@ -29,9 +29,9 @@
|
|||
</view>
|
||||
</view>
|
||||
<view class="status">
|
||||
<text v-if="item.handoverStatus==0" class="nStarted">● 未完成</text>
|
||||
<text v-if="item.handoverStatus==1" class="green">● 进行中 </text>
|
||||
<text v-if="item.handoverStatus==2" class="complete">● 已完成</text>
|
||||
<p v-if="item.handoverStatus==0" class="dfs">未完成</p>
|
||||
<p v-if="item.handoverStatus==1" class="zyz">进行中</p>
|
||||
<p v-if="item.handoverStatus==2" class="ywc">已完成</p>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
|
|
@ -52,6 +52,9 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<template v-if="isMore">
|
||||
<uni-load-more iconType="circle" status="loading" style="width: 100%;" />
|
||||
</template>
|
||||
</template>
|
||||
<o-empty v-else height="70vh" bg="#f5f6fa" />
|
||||
</view>
|
||||
|
|
@ -60,13 +63,11 @@
|
|||
@change="changePage" />
|
||||
</view> -->
|
||||
</view>
|
||||
<LotusLoading :lotusLoadingData="lotusLoadingData"></LotusLoading>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import LotusLoading from "../../components/Winglau14-lotusLoading/Winglau14-LotusLoading.vue";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -110,9 +111,7 @@
|
|||
pageSize: 12,
|
||||
current: 1,
|
||||
|
||||
lotusLoadingData: {
|
||||
isShow: false //设置显示加载中组件true显示false隐藏
|
||||
}
|
||||
isMore: false,
|
||||
}
|
||||
},
|
||||
onBackPress(options) {
|
||||
|
|
@ -126,10 +125,7 @@
|
|||
onReachBottom() {
|
||||
this.current++
|
||||
this.initData()
|
||||
this.lotusLoadingData.isShow = true
|
||||
},
|
||||
components: {
|
||||
LotusLoading
|
||||
this.isMore = true
|
||||
},
|
||||
mounted() {
|
||||
this.loginObj = uni.getStorageSync('loginObj')
|
||||
|
|
@ -224,9 +220,10 @@
|
|||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
this.lotusLoadingData.isShow = false
|
||||
this.isMore = false
|
||||
this.total = res.data.data.total
|
||||
this.itemList.push(...res.data.data.records)
|
||||
console.log(this.itemList)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
|
@ -257,7 +254,6 @@
|
|||
|
||||
.form {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
.end {
|
||||
display: flex;
|
||||
|
|
@ -292,6 +288,7 @@
|
|||
position: relative;
|
||||
margin-top: 15px;
|
||||
gap: 16px;
|
||||
padding-bottom: 50px;
|
||||
|
||||
/deep/.o-empty {
|
||||
width: 100%;
|
||||
|
|
@ -302,13 +299,13 @@
|
|||
width: 32.2%;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 10px 20px;
|
||||
padding: 16px;
|
||||
position: relative;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
padding: 10px 0;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 24px;
|
||||
|
||||
.titleft {
|
||||
display: flex;
|
||||
|
|
@ -331,29 +328,46 @@
|
|||
.row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding: 10px 0;
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
|
||||
.nitem {
|
||||
width: 46%;
|
||||
width: 49%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: #999;
|
||||
|
||||
.text {
|
||||
color: #929292;
|
||||
text {
|
||||
color: #23262e;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.status {
|
||||
margin-top: 5px;
|
||||
font-size: 16px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 23px;
|
||||
|
||||
.nStarted {
|
||||
color: #bbb;
|
||||
p {
|
||||
padding: 5px;
|
||||
border-radius: 13px 0 0 13px;
|
||||
}
|
||||
|
||||
.complete {
|
||||
.dfs {
|
||||
color: #0067CF;
|
||||
background: #F1F8FF;
|
||||
}
|
||||
|
||||
.zyz {
|
||||
color: #04B578;
|
||||
background: #E8FFF7;
|
||||
}
|
||||
|
||||
.ywc {
|
||||
color: #666666;
|
||||
background: #F7F7F7;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,9 +9,9 @@
|
|||
class="canvsborder"></canvas>
|
||||
</view>
|
||||
<view class="sigh-btns">
|
||||
<van-button class="btn" type="default" @tap="handleCancel">取消</van-button>
|
||||
<van-button class="btn" type="default" @tap="handleReset">重写</van-button>
|
||||
<van-button class="btn" type="default" @tap="handleConfirm">确认</van-button>
|
||||
<view class="btn qx" @click="handleCancel">取消</view>
|
||||
<view class="btn qc" @click="handleReset">清除</view>
|
||||
<view class="btn bc" @click="handleConfirm">保存</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -237,6 +237,10 @@
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.container {
|
||||
height: calc(100vh - 68px);
|
||||
padding-bottom: 30px;
|
||||
|
|
@ -258,21 +262,43 @@
|
|||
.sigh-btns {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 10px 10px 0;
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
/deep/.van-button {
|
||||
width: 100px;
|
||||
height: 50px;
|
||||
background-color: #fff;
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.qc {
|
||||
color: #0067CF;
|
||||
background-color: rgba(0, 103, 207, 0.10);
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
|
||||
|
||||
.mycanvas {
|
||||
margin: auto 0rpx;
|
||||
background-color: #ececec;
|
||||
background-color: #fbfbfb;
|
||||
border: 1px dashed #eee;
|
||||
}
|
||||
|
||||
.canvsborder {
|
||||
|
|
|
|||
|
|
@ -45,11 +45,10 @@
|
|||
@confirm="delConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<van-button type="danger" v-if="obj.state == 'look'" @click="del">删除</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'add' || obj.state == 'edit'"
|
||||
@click="save">保存</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
|
||||
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">保存</view>
|
||||
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -348,11 +347,30 @@
|
|||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc {
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -490,14 +490,14 @@
|
|||
|
||||
.drawerTop {
|
||||
display: flex;
|
||||
margin-top: 55px;
|
||||
margin-top: 24px;
|
||||
margin-bottom: 30px;
|
||||
|
||||
image {
|
||||
width: 14px;
|
||||
height: 24px;
|
||||
margin-right: 16px;
|
||||
margin-top: 3px;
|
||||
width: 10px;
|
||||
height: 14px;
|
||||
margin-right: 10px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
text {
|
||||
|
|
@ -542,6 +542,7 @@
|
|||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -82,6 +82,9 @@
|
|||
<uni-popup-message :type="msgType" :message="popupText"
|
||||
:duration="2000"></uni-popup-message>
|
||||
</uni-popup>
|
||||
<template v-if="isMore">
|
||||
<uni-load-more iconType="circle" status="loading" style="width: 100%;" />
|
||||
</template>
|
||||
</template>
|
||||
<o-empty v-else height="70vh" bg="#f5f6fa" />
|
||||
</view>
|
||||
|
|
@ -189,7 +192,7 @@
|
|||
jcList: ["shipInfoTable", "voyageScheduleDataPadRespDTO", "voyageScheduleDataDetailRespDTOList",
|
||||
"shipmentBasicShiftList", "shipOption"
|
||||
],
|
||||
|
||||
isMore: false,
|
||||
lotusLoadingData: {
|
||||
isShow: false //设置显示加载中组件true显示false隐藏
|
||||
}
|
||||
|
|
@ -202,7 +205,7 @@
|
|||
onReachBottom() {
|
||||
this.current++
|
||||
this.initData()
|
||||
this.lotusLoadingData.isShow = true
|
||||
this.isMore = true
|
||||
},
|
||||
onBackPress(options) {
|
||||
// 触发返回就会调用此方法，这里实现的是禁用物理返回，顶部导航栏的自定义返回 uni.navigateBack 仍可使用
|
||||
|
|
@ -261,7 +264,7 @@
|
|||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.statusCode === 200) {
|
||||
this.lotusLoadingData.isShow = false
|
||||
this.isMore = false
|
||||
this.total = res.data.data.total
|
||||
if (flag && flag == 'new') {
|
||||
this.pageSize = 12
|
||||
|
|
@ -1085,7 +1088,6 @@
|
|||
width: 100%;
|
||||
background: #f5f6fa;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
position: fixed;
|
||||
top: 66px;
|
||||
right: 0;
|
||||
|
|
@ -1121,7 +1123,8 @@
|
|||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
padding: 16px;
|
||||
margin-top: 30px;
|
||||
margin-top: 40px;
|
||||
padding-bottom: 50px;
|
||||
|
||||
/deep/.o-empty {
|
||||
width: 100%;
|
||||
|
|
@ -1133,13 +1136,12 @@
|
|||
margin-top: 15px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 10px 5px;
|
||||
padding: 16px;
|
||||
position: relative;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
padding: 10px 20px;
|
||||
margin-bottom: 10px;
|
||||
margin-bottom: 24px;
|
||||
|
||||
image {
|
||||
width: 32px;
|
||||
|
|
@ -1158,25 +1160,29 @@
|
|||
.row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding: 0px 16px;
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
|
||||
.nitem {
|
||||
width: 46%;
|
||||
margin-bottom: 12px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: #999;
|
||||
|
||||
.text {
|
||||
color: #929292;
|
||||
text {
|
||||
color: #23262e;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
border-top: 1px solid #EEEEEE;
|
||||
padding-top: 10px;
|
||||
padding-top: 14px;
|
||||
|
||||
.fitem {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -57,12 +57,12 @@
|
|||
@confirm="delConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<template v-if="status == 0 || status == 4 || status == 5 || status == 'null'">
|
||||
<van-button type="danger" v-if="obj.state == 'look'" @click="del">删除</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'add' || obj.state == 'edit'"
|
||||
@click="save">保存</van-button>
|
||||
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
|
||||
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</view>
|
||||
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">
|
||||
保存</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -405,11 +405,30 @@
|
|||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc {
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -91,7 +91,6 @@
|
|||
</view>
|
||||
</custom-tab-pane>
|
||||
</custom-tabs>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -34,11 +34,10 @@
|
|||
@confirm="delConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<van-button type="danger" v-if="obj.state == 'look'" @click="del">删除</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'add' || obj.state == 'edit'"
|
||||
@click="save">保存</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
|
||||
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">保存</view>
|
||||
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -310,11 +309,30 @@
|
|||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc {
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -56,11 +56,10 @@
|
|||
@confirm="delConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<van-button type="danger" v-if="obj.state == 'look'" @click="del">删除</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'add' || obj.state == 'edit'"
|
||||
@click="save">保存</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
|
||||
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">保存</view>
|
||||
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -397,11 +396,30 @@
|
|||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc {
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -53,11 +53,10 @@
|
|||
@confirm="delConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<van-button type="danger" v-if="obj.state == 'look'" @click="del">删除</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'add' || obj.state == 'edit'"
|
||||
@click="save">保存</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
|
||||
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">保存</view>
|
||||
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -448,6 +447,16 @@
|
|||
height: 120px !important;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
/deep/.is-add {
|
||||
background: url(../../static/images/xjpz.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
border: 1px solid transparent !important;
|
||||
|
||||
.is-add {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pictureLook {
|
||||
|
|
@ -499,13 +508,30 @@
|
|||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border: 1px solid #E1E5ED;
|
||||
box-shadow: 0 -1px 4px 0 rgba(0, 0, 0, 0.05);
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc {
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -58,12 +58,11 @@
|
|||
</view>
|
||||
</view>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<template v-if="status == 0 || status == 4 || status == 5 || status == 'null'">
|
||||
<van-button type="danger" v-if="obj.state == 'look'" @click="del">删除</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'add' || obj.state == 'edit'"
|
||||
@click="save">保存</van-button>
|
||||
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
|
||||
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</view>
|
||||
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">保存</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -507,11 +506,30 @@
|
|||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc{
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -240,8 +240,8 @@
|
|||
</van-tabs>
|
||||
</view>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<van-button type="info" @click="save">保存</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<view class="btn bc" @click="save">保存</view>
|
||||
</view>
|
||||
<LotusLoading :lotusLoadingData="lotusLoadingData"></LotusLoading>
|
||||
</view>
|
||||
|
|
@ -1710,21 +1710,33 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 0px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -197,10 +197,10 @@
|
|||
@confirm="delConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<template v-if="status == 0 || status == 4 || status == 5 || status == 'null'">
|
||||
<!-- <van-button type="danger" @click="del">删除</van-button> -->
|
||||
<van-button type="info" @click="edit('edit')">编辑</van-button>
|
||||
<!-- <view class="btn sc" @click="del">删除</view> -->
|
||||
<view class="btn bc" @click="edit('edit')">编辑</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -486,21 +486,38 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 0px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc {
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,22 +3,68 @@
|
|||
<head-view :title="title" url="/pages/shipWork/documentList"></head-view>
|
||||
<view class="container contentFixed">
|
||||
<view class="ul">
|
||||
<view class="li">船名：{{shipInfo.vslCnname}}</view>
|
||||
<view class="li">总重：{{shipInfo.vslGton}}</view>
|
||||
<view class="li">净重：{{shipInfo.vslNetton}}</view>
|
||||
<view class="li">长度：{{shipInfo.vslLoa}}</view>
|
||||
<view class="li">宽度：{{shipInfo.vslBreadth}}</view>
|
||||
<view class="li">空载吃水：{{shipInfo.vslDraftunload}}</view>
|
||||
<view class="li">重载吃水：{{shipInfo.vslDraftload}}</view>
|
||||
<view class="li">舱口高度：{{shipInfo.spmCabinht}}</view>
|
||||
<view class="li">最低作业潮水：{{shipInfo.spmMintide}}</view>
|
||||
<view class="li">驾驶台位置：{{shipInfo.spmCab}}</view>
|
||||
<view class="li">跳板中左：{{shipInfo.spmBoardCentrele}}</view>
|
||||
<view class="li">跳板前左：{{shipInfo.spmBoardFrontle}}</view>
|
||||
<view class="li">跳板后左：{{shipInfo.spmBoardLaterle}}</view>
|
||||
<view class="li">跳板中右：{{shipInfo.spmBoardCentrerg}}</view>
|
||||
<view class="li">跳板后右 ：{{shipInfo.spmBoardLaterrg}}</view>
|
||||
<view class="li">跳板前右：{{shipInfo.spmBoardFrontrg}}</view>
|
||||
<view class="li">
|
||||
<p>船名：</p><text>{{shipInfo.vslCnname}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>总重：</p><text>{{shipInfo.vslGton}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>净重：</p>
|
||||
<text>{{shipInfo.vslNetton}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>长度：</p>
|
||||
<text>{{shipInfo.vslLoa}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>宽度：</p>
|
||||
<text>{{shipInfo.vslBreadth}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>空载吃水：</p>
|
||||
<text>{{shipInfo.vslDraftunload}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>重载吃水：</p>
|
||||
<text>{{shipInfo.vslDraftload}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>舱口高度：</p>
|
||||
<text>{{shipInfo.spmCabinht}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>最低作业潮水：</p>
|
||||
<text>{{shipInfo.spmMintide}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>驾驶台位置：</p>
|
||||
<text>{{shipInfo.spmCab}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>跳板中左：</p>
|
||||
<text>{{shipInfo.spmBoardCentrele}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>跳板前左：</p>
|
||||
<text>{{shipInfo.spmBoardFrontle}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>跳板后左：</p>
|
||||
<text>{{shipInfo.spmBoardLaterle}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>跳板中右：</p>
|
||||
<text>{{shipInfo.spmBoardCentrerg}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>跳板后右 ：</p>
|
||||
<text>{{shipInfo.spmBoardLaterrg}}</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>跳板前右：</p>
|
||||
<text>{{shipInfo.spmBoardFrontrg}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -59,16 +105,30 @@
|
|||
<style lang="less" scoped>
|
||||
.shipInfo {
|
||||
.container {
|
||||
padding: 30px 20px;
|
||||
padding: 16px;
|
||||
|
||||
.ul {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 0 20px;
|
||||
padding: 24px 16px;
|
||||
background-color: #fff;
|
||||
|
||||
.li {
|
||||
min-width: 45%;
|
||||
margin: 10px 20px;
|
||||
width: 32%;
|
||||
margin-bottom: 12px;
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
font-size: 16px;
|
||||
|
||||
p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #23262E;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,38 +2,127 @@
|
|||
<view class="shipPlan">
|
||||
<head-view :title="title" url="/pages/shipWork/documentList"></head-view>
|
||||
<view class="container contentFixed">
|
||||
<p class="title">基本信息</p>
|
||||
<view class="ul">
|
||||
<view class="li wLi">船名：{{shipInfo.spmName}}</view>
|
||||
<view v-for="(item,index) in vvyList" :key="index">
|
||||
<view class="li">{{item.importExportFlagName}}航次：{{item.vvyName}}</view>
|
||||
<view class="li">贸易类型：{{item.tradeTypeName}}</view>
|
||||
<view class="li">航线：{{item.lcoName}}</view>
|
||||
<view class="li">船公司：{{item.shipComName}}</view>
|
||||
<view class="li wLi">船代：{{item.shipAgentName}}</view>
|
||||
<view class="liBox">
|
||||
<p class="title">基本信息</p>
|
||||
<view class="ul">
|
||||
<view class="li wLi">
|
||||
<p>船名：</p>
|
||||
<text v-if="shipInfo.spmName != 'null'">{{shipInfo.spmName}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="liContent" v-for="(item,index) in vvyList" :key="index">
|
||||
<view class="li">
|
||||
<p>{{item.importExportFlagName}}航次：</p>
|
||||
<text v-if="item.vvyName != 'null'">{{item.vvyName}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>贸易类型：</p>
|
||||
<text v-if="item.tradeTypeName != 'null'">{{item.tradeTypeName}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>航线：</p>
|
||||
<text v-if="item.lcoName != 'null'">{{item.lcoName}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>船公司：</p>
|
||||
<text v-if="item.shipComName != 'null'">{{item.shipComName}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>船代：</p>
|
||||
<text v-if="item.shipAgentName != 'null'">{{item.shipAgentName}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<p class="title">船期信息</p>
|
||||
<view class="ul">
|
||||
<view class="li">计划到港时间：{{shipInfo.planArrivePortTime}}</view>
|
||||
<view class="li">计划离港时间：{{shipInfo.planDeparturePortTime}}</view>
|
||||
<view class="li">计划靠泊时间：{{shipInfo.planBerthingTime}}</view>
|
||||
<view class="li">计划离泊时间：{{shipInfo.planAnchoringTime}}</view>
|
||||
<view class="li">确报时间：{{shipInfo.confirmTime}}</view>
|
||||
<view class="li">船期状态：{{shipInfo.shipmentStatus}}</view>
|
||||
<view class="li">靠泊状态：{{shipInfo.berthStatus}}</view>
|
||||
<view class="li">计划泊位：{{shipInfo.planBerthageName}}</view>
|
||||
<view class="liBox">
|
||||
<p class="title">船期信息</p>
|
||||
<view class="ul">
|
||||
<view class="li">
|
||||
<p>计划到港时间：</p>
|
||||
<text v-if="shipInfo.planArrivePortTime != 'null'">{{shipInfo.planArrivePortTime}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>计划离港时间：</p>
|
||||
<text v-if="shipInfo.planDeparturePortTime != 'null'">{{shipInfo.planDeparturePortTime}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>计划靠泊时间：</p>
|
||||
<text v-if="shipInfo.planBerthingTime != 'null'">{{shipInfo.planBerthingTime}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>计划离泊时间：</p>
|
||||
<text v-if="shipInfo.planAnchoringTime != 'null'">{{shipInfo.planAnchoringTime}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>确报时间：</p>
|
||||
<text v-if="shipInfo.confirmTime != 'null'">{{shipInfo.confirmTime}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>船期状态：</p>
|
||||
<text v-if="shipInfo.shipmentStatus != 'null'">{{shipInfo.shipmentStatus}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>靠泊状态：</p>
|
||||
<text v-if="shipInfo.berthStatus != 'null'">{{shipInfo.berthStatus}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>计划泊位：</p>
|
||||
<text v-if="shipInfo.planBerthageName != 'null'">{{shipInfo.planBerthageName}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<p class="title">计划信息</p>
|
||||
<view class="ul" v-for="(item,index) in vvyList" :key="index">
|
||||
<view class="li">{{item.importExportFlagName}}航次：{{item.vvyName}}</view>
|
||||
<view class="li">计划开工时间：{{item.planStartTime}}</view>
|
||||
<view class="li">计划完工时间：{{item.planFinishTime}}</view>
|
||||
<view class="li">品牌：{{item.vgdGoodName}}</view>
|
||||
<view class="li">计划数量：{{item.planAmount}}</view>
|
||||
<view class="li">工班人数：{{item.planNum}}</view>
|
||||
<view class="li">计划组数：{{item.teamNum}}</view>
|
||||
<view class="liBox">
|
||||
<p class="title">计划信息</p>
|
||||
<view class="ul" v-for="(item,index) in vvyList" :key="index">
|
||||
<view class="li">
|
||||
<p>{{item.importExportFlagName}}航次：</p>
|
||||
<text v-if="item.vvyName != 'null'">{{item.vvyName}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>计划开工时间：</p>
|
||||
<text v-if="item.planStartTime != 'null'">{{item.planStartTime}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>计划完工时间：</p>
|
||||
<text v-if="item.planFinishTime != 'null'">{{item.planFinishTime}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>品牌：</p>
|
||||
<text v-if="item.vgdGoodName != 'null'">{{item.vgdGoodName}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>计划数量：</p>
|
||||
<text v-if="item.planAmount != 'null'">{{item.planAmount}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>工班人数：</p>
|
||||
<text v-if="item.planNum != 'null'">{{item.planNum}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
<view class="li">
|
||||
<p>计划组数：</p>
|
||||
<text v-if="item.teamNum != 'null'">{{item.teamNum}}</text>
|
||||
<text v-else>-</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -80,28 +169,52 @@
|
|||
<style lang="less" scoped>
|
||||
.shipPlan {
|
||||
.container {
|
||||
padding: 30px 20px;
|
||||
padding: 16px;
|
||||
|
||||
.title {
|
||||
padding-left: 10px;
|
||||
border-left: 5px solid #2979ff;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.liBox {
|
||||
width: 100%;
|
||||
padding: 24px 16px;
|
||||
background-color: #fff;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.ul {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 0 20px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.li {
|
||||
min-width: 45%;
|
||||
margin: 10px 20px 0;
|
||||
.title {
|
||||
display: flex;
|
||||
margin-bottom: 20px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.wLi {
|
||||
width: 100%;
|
||||
.ul {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.liContent {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.li {
|
||||
min-width: 32%;
|
||||
margin-bottom: 12px;
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
font-size: 16px;
|
||||
|
||||
p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #23262E;
|
||||
}
|
||||
}
|
||||
|
||||
.wLi {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,9 +9,9 @@
|
|||
class="canvsborder"></canvas>
|
||||
</view>
|
||||
<view class="sigh-btns">
|
||||
<van-button class="btn" type="default" @tap="handleCancel">取消</van-button>
|
||||
<van-button class="btn" type="default" @tap="handleReset">重写</van-button>
|
||||
<van-button class="btn" type="default" @tap="handleConfirm">确认</van-button>
|
||||
<view class="btn qx" @click="handleCancel">取消</view>
|
||||
<view class="btn qc" @click="handleReset">清除</view>
|
||||
<view class="btn bc" @click="handleConfirm">保存</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -206,6 +206,10 @@
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.container {
|
||||
height: calc(100vh - 68px);
|
||||
padding-bottom: 30px;
|
||||
|
|
@ -228,21 +232,43 @@
|
|||
.sigh-btns {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 10px 10px 0;
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
/deep/.van-button {
|
||||
width: 100px;
|
||||
height: 50px;
|
||||
background-color: #fff;
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.qc {
|
||||
color: #0067CF;
|
||||
background-color: rgba(0, 103, 207, 0.10);
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
|
||||
|
||||
.mycanvas {
|
||||
margin: auto 0rpx;
|
||||
background-color: #ececec;
|
||||
background-color: #fbfbfb;
|
||||
border: 1px dashed #eee;
|
||||
}
|
||||
|
||||
.canvsborder {
|
||||
|
|
|
|||
|
|
@ -51,12 +51,11 @@
|
|||
@confirm="delConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<template v-if="status == 0 || status == 4 || status == 5 || status == 'null'">
|
||||
<van-button type="danger" v-if="obj.state == 'look'" @click="del">删除</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'add' || obj.state == 'edit'"
|
||||
@click="save">保存</van-button>
|
||||
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
|
||||
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</view>
|
||||
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">保存</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -396,11 +395,30 @@
|
|||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc {
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -63,12 +63,11 @@
|
|||
@confirm="delConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<template v-if="status == 0 || status == 4 || status == 5 || status == 'null'">
|
||||
<van-button type="danger" v-if="obj.state == 'look'" @click="del">删除</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'add' || obj.state == 'edit'"
|
||||
@click="save">保存</van-button>
|
||||
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
|
||||
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</view>
|
||||
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">保存</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -418,11 +417,30 @@
|
|||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc {
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -67,11 +67,10 @@
|
|||
@confirm="delConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<van-button type="danger" v-if="obj.state == 'look'" @click="del">删除</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'add' || obj.state == 'edit'"
|
||||
@click="save">保存</van-button>
|
||||
<van-button type="info" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</van-button>
|
||||
<view class="btn qx" @click="cancel">取消</view>
|
||||
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
|
||||
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">保存</view>
|
||||
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')">编辑</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -448,11 +447,30 @@
|
|||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
.btn {
|
||||
margin: 15.5px 17px;
|
||||
width: 200px;
|
||||
height: 49px;
|
||||
border-radius: 2px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 49px;
|
||||
}
|
||||
|
||||
.qx {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.sc {
|
||||
background-color: #E50101;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bc {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,150 @@
|
|||
项目名称：海通Pad
|
||||
项目描述：
|
||||
技术架构描述：uni-app
|
||||
|
||||
外部组件列表及描述：
|
||||
components/head-info 首页头部内容
|
||||
参数：
|
||||
navIndex 选中头部导航下标
|
||||
|
||||
components/head-view 内容头部，用于返回标题展示
|
||||
参数：
|
||||
title 标题
|
||||
type 是否有下拉内容（船舶作业中用到）
|
||||
url 跳转路径（不传则返回上一级）
|
||||
|
||||
components/lx-progress-bar 进度条（uni-app插件市场）
|
||||
components/uni-drawer 抽屉（uni-app官方组件）
|
||||
components/Winglau14-lotusLoading 全屏加载中（uni-app插件市场）
|
||||
|
||||
源代码清单：
|
||||
登录：
|
||||
pages/login/index 登录页
|
||||
装船指令：
|
||||
pages/index/index 装船指令首页
|
||||
pages/index/instruct 装船指令内容
|
||||
pages/index/instructDetails 装船指令指令详情
|
||||
pages/index/place 装船指令场位图
|
||||
卸船指令：
|
||||
pages/discharge/index 卸船指令首页
|
||||
pages/discharge/instruct 卸船指令内容
|
||||
pages/discharge/instructDetails 卸船指令指令详情
|
||||
船舶作业：
|
||||
pages/shipWork/index 船舶作业首页
|
||||
pages/shipWork/documentList 船舶作业内容列表选择
|
||||
pages/shipWork/mixWork 杂项单证首页
|
||||
pages/shipWork/peopleAdd 杂项单证人员信息新增查看编辑
|
||||
pages/shipWork/shiftAdd 杂项单证工班信息新增编辑
|
||||
pages/shipWork/shiftDetails 杂项单证工班信息查看
|
||||
pages/shipWork/mixSign 杂项单证签名
|
||||
pages/shipWork/untieCord 系解缆首页
|
||||
pages/shipWork/untieAdd 系解缆新增查看编辑
|
||||
pages/shipWork/untieSign 系解缆签名
|
||||
pages/shipWork/supply 供给首页
|
||||
pages/shipWork/supplyAdd 供给新增查看编辑
|
||||
pages/shipWork/supplySign 供给签名
|
||||
pages/shipWork/workAssign 指导员作业布置首页
|
||||
pages/shipWork/workAssignAdd 指导员作业布置新增查看编辑
|
||||
pages/shipWork/workAssignSign 指导员作业布置签名
|
||||
pages/shipWork/notice 船舶装卸通知单首页
|
||||
pages/shipWork/noticeAdd 船舶装卸通知单新增查看编辑
|
||||
pages/shipWork/noticeSign 船舶装卸通知单签名
|
||||
pages/shipWork/opinion 质量意见征询首页
|
||||
pages/shipWork/opinionAdd 质量意见征询新增查看编辑
|
||||
pages/shipWork/opinionSign 质量意见征询签名
|
||||
pages/shipWork/abnormal 异常情况首页
|
||||
pages/shipWork/abnormalAdd 异常情况新增查看编辑
|
||||
pages/shipWork/abnormalSign 异常情况询签名
|
||||
pages/shipWork/mafi MAFI清单首页
|
||||
pages/shipWork/mafiAdd MAFI清单新增查看编辑
|
||||
pages/shipWork/mafiSign MAFI清单询签名
|
||||
pages/shipWork/sign 签名页
|
||||
pages/shipWork/patrol 安全巡检首页
|
||||
pages/shipWork/patrolAdd 安全巡检新增查看编辑
|
||||
pages/shipWork/shipInfo 船舶资料
|
||||
pages/shipWork/shipPlan 船舶计划
|
||||
pages/shipWork/brandDetails 作业查询
|
||||
pages/shipWork/carDetails 作业查询详情
|
||||
残损信息：
|
||||
pages/quality/index 残损信息首页
|
||||
pages/quality/edit 残损信息新增编辑
|
||||
pages/quality/details 残损信息详情
|
||||
pages/quality/sign 残损信息签名
|
||||
pages/quality/zsEdit 质损图编辑
|
||||
场位管控：
|
||||
pages/monitor/index 场位管控首页
|
||||
pages/monitor/place 场位管控车道车位图
|
||||
进出口货物交接单：
|
||||
pages/receipt/index 进出口货物交接单首页
|
||||
pages/receipt/details 进出口货物交接单详情
|
||||
pages/receipt/sign 进出口货物交接单签名
|
||||
|
||||
接口使用清单：（接口地址：https://rtops4.haitongauto.com/tos/api/doc.html#/home）
|
||||
登录
|
||||
app登录：/api/app/login
|
||||
获取港区：/api/app/user/getMinato
|
||||
选择港区：/api/app/user/setMinato
|
||||
|
||||
装船指令（内贸）
|
||||
总指令下发：/api/domestic/load/command/commandIssued
|
||||
根据包id -> dlcId 指令暂停：/api/domestic/load/command/commandPause
|
||||
分指令界面:重新发送指令：/api/domestic/load/command/commandReissuedForBranch
|
||||
分指令界面:发送指令：/api/domestic/load/command/commandSendForBranch
|
||||
内贸分页查询 flag：true-总指令-false分指令：/api/domestic/load/command/page
|
||||
获取该工作包下所有货物明细数据：/api/domestic/load/command/pageForCargoDetails
|
||||
根据指令id获取装船计划分组数据：/api/domestic/load/command/queryLoadPlanGroupForDclId
|
||||
选择船：/api/domestic/load/command/queryLoadVoyages
|
||||
装船指令（外贸）
|
||||
总指令下发：/api/shipInstructions/commandIssued
|
||||
根据包id -> lwpId 指令暂停：/api/shipInstructions/commandPause
|
||||
分指令界面:重新发送指令：/api/shipInstructions/commandReissuedForBranch
|
||||
分指令界面:发送指令：/api/shipInstructions/commandSendForBranch
|
||||
配载详情：根据配载ID查询配载的货物明细信息：/api/shipInstructions/goodsDetail/page
|
||||
货列表详情 基本信息-详细信息：/api/shipInstructions/listDetail
|
||||
总指令：分页查询：/api/shipInstructions/page
|
||||
装船指令-分指令分页：/api/shipInstructions/pageCommandForBranch
|
||||
获取该工具包下所有货物明细数据：/api/shipInstructions/pageForCargoDetails
|
||||
根据key条件查询出航次下拉框 条件：船名、船代码、航次 可根据ieType区分进出口：/api/shipInstructions/queryByKey
|
||||
根据指令包 id 获取配给载数据：/api/shipInstructions/queryStowageForLwpId
|
||||
获取装船指令航次数据：/api/shipInstructions/queryStowageVoyages
|
||||
卸船指令：
|
||||
总指令下发：/api/unload/command/commandIssued
|
||||
根据包id -> lwpId 指令暂停：/api/unload/command/commandPause
|
||||
分指令界面:重新发送指令：/api/unload/command/commandReissuedForBranch
|
||||
分指令界面:发送指令：/api/unload/command/commandSendForBranch
|
||||
卸船指令-总指令：分页查询：/api/unload/command/page
|
||||
卸船指令-分指令分页：/api/unload/command/pageCommandForBranch
|
||||
获取该工作包下所有货物明细数据：/api/unload/command/pageForCargoDetails
|
||||
根据指令id获取卸船计划分组数据：/api/unload/command/queryShipUnloaderPlanGroupForLwpId
|
||||
卸船指令选择船：获取卸船计划航次数据：/api/unload/command/queryUnloadVoyages
|
||||
船舶作业：
|
||||
pad-下载：/api/shipOperate/download
|
||||
pad-获取港区：/api/shipOperate/queryPortArea
|
||||
pad-装船作业-选择船-船名航次条件框：/api/shipOperate/queryShipmentVoyageData
|
||||
pad-选择船：/api/shipOperate/select
|
||||
pad-上传：/api/shipOperate/upload
|
||||
安全巡检：
|
||||
新增：/api/safetyInspection
|
||||
安全巡检界面详情：/api/safetyInspection/details/{id}
|
||||
分页查询：/api/safetyInspection/page
|
||||
根据ID更新：/api/safetyInspection/{id}
|
||||
安全巡检界面删除：/api/safetyInspection/{id}
|
||||
场位管控：
|
||||
场位异常货物信息：/api/yardGoods/monitor/error/list
|
||||
释放堆场异常信息：/api/yardGoods/monitor/free/goods
|
||||
在场货品牌：/api/yardGoods/monitor/goods/brand
|
||||
货物列表：/api/yardGoods/monitor/goods/list
|
||||
堆场下拉：/api/yardGoods/monitor/goods/manage/page
|
||||
在场货港口：/api/yardGoods/monitor/goods/pot
|
||||
车道统计车辆情况：/api/yardGoods/monitor/line/statistics
|
||||
区域统计车辆情况：/api/yardGoods/monitor/region/statistics
|
||||
车位统计车辆情况：/api/yardGoods/monitor/seat/statistics
|
||||
场位概况：/api/yardGoods/monitor/situation
|
||||
进出口货物交接单：
|
||||
获取船只：/shp/iEDeliverySlipController/page
|
||||
获取当前航次的船信息：/shp/iEDeliverySlipController/page
|
||||
获取数据：/shp/iEDeliverySlipController/planPage
|
||||
获取当前行的数据：/shp/iEDeliverySlipController/iEDeliverySlipPlanDamage
|
||||
|
||||
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
|
|
@ -4,7 +4,7 @@
|
|||
<view :class="[direction==='column'?'uni-steps__column-text-container':'uni-steps__row-text-container']">
|
||||
<view v-for="(item,index) in options" :key="index"
|
||||
:class="[direction==='column'?'uni-steps__column-text':'uni-steps__row-text']">
|
||||
<text :style="{color:index === active?activeColor:deactiveColor}"
|
||||
<text :style="{color:index === active?activeColor:'#23262e'}"
|
||||
:class="[direction==='column'?'uni-steps__column-title':'uni-steps__row-title']">{{item.title}}</text>
|
||||
<text :style="{color: deactiveColor}"
|
||||
:class="[direction==='column'?'uni-steps__column-desc':'uni-steps__row-desc']">{{item.desc}}</text>
|
||||
|
|
|
|||
Loading…
Reference in New Issue