elink-star
/
epmet-work-uni
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

车辆新增页面

master
mk 10 months ago
parent
8938315312
commit
2df10e6029
4 changed files with 283 additions and 106 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 12
      pages.json
  2. 324
      subpages/carManagement/pages/add/add.vue
  3. 51
      subpages/carManagement/subpages/carManagement/pages/add/add.vue
  4. 2
      subpages/demandCheck/pages/dissatisfied/demandCheck/demandCheck.vue

12
pages.json
View File

@ -528,6 +528,18 @@
} }
} }
] ]
},
{
"root": "subpages/carManagement",
"pages": [
{
"path": "pages/add/add",
"name": "carManagement",
"style": {
"navigationStyle": "custom"
}
}
]
} }
], ],
"tabBar": { "tabBar": {

324
subpages/carManagement/pages/add/add.vue
View File

@ -2,121 +2,255 @@
<!-- subpages/carManagement/pages/add/add.wxml --> <!-- subpages/carManagement/pages/add/add.wxml -->
<view class="personal-info"> <view class="personal-info">
<view class="basic-info"> <view class="basic-info">
<view :class="'item ' + (isDisabled ? 'disabled' : '')"> <view class="item">
<view class="field"> <view class="field">
<text class="must">*</text> <text class="must">*</text>
<view class="field-text">事件分类</view> <view class="field-text">所属组织</view>
</view> </view>
<view class="value-dl" @tap="onOpen1"> <view style="overflow-x: hidden;">
<view :class="category ? 'di-name' : 'di-name1'">{{ category ? category : '请选择' }}</view> <jia-cascader :itemList="angencyList" :defaultItemList="defaultItemList"
<image class="di-but" src="/static/images/right.png" mode="aspectFit" /> @completeChange="completeGrid" @inputChange="change" :border="false"
:clearIcon="false"></jia-cascader>
</view> </view>
</view> </view>
<view class="item"> <view :class="'item '">
<view class="field"> <view class="field">
<text class="must">*</text> <text class="must">*</text>
<view class="field-text">发生地点</view> <view class="field-text">车牌号码</view>
</view> </view>
<view class="value-dl"> <view hover-class="backC" class="value-dl">
<view class="di-name" @tap="toughGetLocation">{{ addressContent }}</view> <input class="telInput" type="text" placeholder="请输入" v-model="formData.carNumber" />
<image class="di-but" v-if="!addressContent" src="/static/images/right.png" mode="aspectFit" />
<image class="di-but" v-else style="width: 46rpx; height: 46rpx" src="/static/images/导航.png" mode="aspectFit" @tap="routePlanning" />
</view> </view>
</view> </view>
<view :class="'item '">
<view :class="'item ' + (isDisabled ? 'disabled' : '')">
<view class="field"> <view class="field">
<text class="must">*</text> <text class="must">*</text>
<view class="field-text">{{ tabVal === '1' ? '需求人' : '责任人' }}</view> <view class="field-text">车主姓名</view>
</view>
<view hover-class="backC" class="value-dl">
<input class="telInput" type="text" placeholder="请输入" v-model="formData.carOwnerName" />
</view> </view>
<navigator hover-class="backC" class="value-dl" url="/subpages/demandCheck/pages/dissatisfied/searchResi/searchResi">
<view :class="resiName ? 'di-name' : 'di-name1'">
{{ resiName ? resiName : '请选择' }}
</view>
<image class="di-but" src="/static/images/right.png" mode="aspectFit" />
</navigator>
</view> </view>
<view :class="'item ' + (isDisabled ? 'disabled' : '')"> <view :class="'item '">
<view class="field"> <view class="field">
<text class="must">*</text> <text class="must">*</text>
<view class="field-text">{{ tabVal === '0' ? '责任人电话' : '联系电话' }}</view> <view class="field-text">车主电话</view>
</view>
<view hover-class="backC" class="value-dl">
<input class="telInput" type="text" placeholder="请输入" v-model="formData.carOwnerMobile" />
</view>
</view>
<view :class="'item '">
<view class="field">
<view class="field-text">车主身份证</view>
</view>
<view hover-class="backC" class="value-dl">
<input class="telInput" type="text" placeholder="请输入" v-model="formData.carOwnerNum" />
</view>
</view>
</view>
<view class="basic-info" style="padding-bottom:10px ;">
<view :class="'item '">
<view class="field">
<view class="field-text">车辆品牌</view>
</view>
<view hover-class="backC" class="value-dl">
<input class="telInput" type="text" placeholder="请输入" v-model="formData.carBrand" />
</view>
</view>
<view :class="'item '">
<view class="field">
<view class="field-text">车辆颜色</view>
</view>
<view class="value-dl">
<input class="telInput" type="text" placeholder="请输入" v-model="formData.carColor" />
</view>
</view>
<view :class="'item '">
<view class="field">
<view class="field-text">核载人数</view>
</view> </view>
<view hover-class="backC" class="value-dl"> <view hover-class="backC" class="value-dl">
<!-- <view class="di-name" > <u-number-box v-model="formData.carriersNum">
{{resiMobile?resiMobile:'请输入'}} <view slot="minus" class="minus">
</view> --> <u-icon name="minus" size="12" color=" #d0d0d0"></u-icon>
<input class="telInput" type="text" placeholder="请输入" :value="resiMobile" @blur="bindMobile" /> </view>
<text slot="input" style="width: 50px;text-align: center;" class="input">{{ formData.carriersNum
}}</text>
<view slot="plus" class="plus">
<u-icon name="plus" size="12" color=" #d0d0d0"></u-icon>
</view>
</u-number-box>
</view>
</view>
<view :class="'item '">
<view class="field">
<view class="field-text">购置日期</view>
</view>
<view hover-class="backC" class="value-dl" @tap="showTimePicker">
<view :class="formData.acquistionDate ? 'di-name' : 'di-name1'">{{ formData.acquistionDate ?
formData.acquistionDate : '请选择' }}
</view>
<image class="di-but" src="/static/images/right.png" mode="aspectFit" />
</view>
</view>
<u-datetime-picker :show="visibleTime" v-model="formData.acquistionDate" :maxDate="maxDate" mode="datetime"
@cancel="visibleTime = false" @confirm="onConfirmDate"></u-datetime-picker>
<view class="issue-content">
<view class="item1">
<view class="field">
<view class="field-text">备注说明</view>
</view>
</view> </view>
<textarea maxlength="500" v-model="formData.remark" placeholder="请输入备注说明(不超过500字)"></textarea>
</view> </view>
</view> </view>
<view class="bot_btn">
<button type="default" :plain="true" class="bottom_btn bottom_btn_close" @tap="close">取消</button>
<button type="primary" class="btn_bule bottom_btn" @tap="saveForm">提交</button>
</view>
</view> </view>
</template> </template>
<script> <script>
import wuxPicker from '../../../../../wxcomponents/dist/picker/index'; import {
formatTime
} from '../../../../utils/util';
const app = getApp();
import api from '../../../../utils/api';
// subpages/carManagement/pages/add/add.js // subpages/carManagement/pages/add/add.js
export default { export default {
components: { components: {
wuxPicker
}, },
data() { data() {
return { return {
isDisabled: false, visibleTime: false,
category: false, maxDate: null,
addressContent: '', angencyList: [],
tabVal: '', defaultItemList: [],
resiName: false, formData: {
resiMobile: '' agencyId: '',//所属组织
orgNamePath: '',//所属组织名称路径
carBrand: '',//车辆品牌
carOwnerMobile: '',//车主电话
carOwnerName: '',//车主姓名
orgIdPath: '',//所属组织路径
carNumber: '',//车牌号码
customerId: '',//客户Id
carColor: '',//车辆颜色
carriersNum: 1,//核载人数
acquistionDate: '',//购置日期
carOwnerNum: '',//车主证件号
remark: ''//备注
}
}; };
}, },
/** /**
* 生命周期函数--监听页面加载 * 生命周期函数--监听页面加载
*/ */
onLoad(options) {}, onLoad(options) {
this.setData({
angencyId: app.globalData.user.agencyId,
});
this.getAgencygridtree()
},
/** /**
* 生命周期函数--监听页面初次渲染完成 * 生命周期函数--监听页面初次渲染完成
*/ */
onReady() {}, onReady() { },
/** /**
* 生命周期函数--监听页面显示 * 生命周期函数--监听页面显示
*/ */
onShow() {}, onShow() { },
/** /**
* 生命周期函数--监听页面隐藏 * 生命周期函数--监听页面隐藏
*/ */
onHide() {}, onHide() { },
/** /**
* 生命周期函数--监听页面卸载 * 生命周期函数--监听页面卸载
*/ */
onUnload() {}, onUnload() { },
/** /**
* 页面相关事件处理函数--监听用户下拉动作 * 页面相关事件处理函数--监听用户下拉动作
*/ */
onPullDownRefresh() {}, onPullDownRefresh() { },
/** /**
* 页面上拉触底事件的处理函数 * 页面上拉触底事件的处理函数
*/ */
onReachBottom() {}, onReachBottom() { },
/** /**
* 用户点击右上角分享 * 用户点击右上角分享
*/ */
onShareAppMessage() {}, onShareAppMessage() { },
methods: { methods: {
onOpen1() { getAgencygridtree() {
console.log('占位：函数 onOpen1 未声明'); api.getAgencygridtree()
.then((res) => {
this.setData({
angencyList: this.convertLabelToText([res.data])
});
})
.catch((err) => {
console.log(err);
});
}, },
change(e) {
toughGetLocation() { console.log(e, '选中的');
console.log('占位：函数 toughGetLocation 未声明');
}, },
completeGrid(e) {
if(e.result){
this.setData({
'formData.orgNamePath':e.result.map(item=>item.text).join(','),
'formData.orgIdPath':e.result.map(item=>item.value).join(','),
agencyId:e.result[e.result.length - 1].value
})
}
},
convertLabelToText(tree) {
return tree.map(node => {
const newNode = {
...node
};
// 将 label 替换为 text
if (newNode.agencyName !== undefined) {
newNode.text = newNode.agencyName;
delete newNode.agencyName;
}
if (newNode.subAgencyList && newNode.subAgencyList.length > 0) {
newNode.children = newNode.subAgencyList
delete newNode.subAgencyList;
}
if (newNode.agencyId) {
newNode.value = newNode.agencyId
delete newNode.agencyId;
}
if (newNode.children && newNode.children.length > 0) {
newNode.children = this.convertLabelToText(newNode.children);
}
routePlanning() { return newNode;
console.log('占位：函数 routePlanning 未声明'); });
},
showTimePicker(e) {
this.setData({
visibleTime: true,
maxDate: new Date().getTime(),
acquistionDate: new Date().getTime()
});
}, },
onConfirmDate(e) {
this.setData({
visibleTime: false,
'formData.acquistionDate': formatTime(e.value)
});
bindMobile() { },
console.log('占位：函数 bindMobile 未声明'); saveForm() {
} console.log(this.formData);
},
} }
}; };
</script> </script>
@ -130,6 +264,7 @@ page {
padding-bottom: 20rpx; padding-bottom: 20rpx;
box-sizing: border-box; box-sizing: border-box;
} }
.personal-info { .personal-info {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -146,28 +281,33 @@ page {
padding: 0 20rpx; padding: 0 20rpx;
margin-top: 20rpx; margin-top: 20rpx;
} }
.item { .item {
border-bottom: 1rpx solid #e7eeee; border-bottom: 1rpx solid #e7eeee;
padding: 25rpx 0; padding: 25rpx 0;
line-height: 60rpx; line-height: 60rpx;
display: flex; display: flex;
} }
.field { .field {
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
width: 180rpx; width: 190rpx;
padding-left: 25rpx; padding-left: 25rpx;
} }
.field-d { .field-d {
width: 220rpx !important; width: 220rpx !important;
} }
.value-d { .value-d {
width: 450rpx !important; width: 450rpx !important;
} }
.field.mobile-field { .field.mobile-field {
width: 250rpx !important; width: 250rpx !important;
} }
.field .must { .field .must {
position: absolute; position: absolute;
top: 0; top: 0;
@ -176,6 +316,7 @@ page {
color: #f61616; color: #f61616;
font-size: 30rpx; font-size: 30rpx;
} }
.field .field-text { .field .field-text {
font-size: 32rpx; font-size: 32rpx;
font-family: Source Han Serif SC; font-family: Source Han Serif SC;
@ -201,6 +342,7 @@ page {
color: #333; color: #333;
line-height: 60rpx; line-height: 60rpx;
} }
.value-dl { .value-dl {
position: relative; position: relative;
display: flex; display: flex;
@ -213,6 +355,7 @@ page {
flex: 1; flex: 1;
} }
.telInput { .telInput {
margin-left: 40rpx; margin-left: 40rpx;
} }
@ -224,6 +367,7 @@ page {
margin-left: 40rpx; margin-left: 40rpx;
font-family: 'PingFangSC-Regular', sans-serif; font-family: 'PingFangSC-Regular', sans-serif;
} }
.di-name1 { .di-name1 {
margin-right: 14rpx; margin-right: 14rpx;
text-align: left; text-align: left;
@ -232,10 +376,12 @@ page {
font-family: 'PingFangSC-Regular', sans-serif; font-family: 'PingFangSC-Regular', sans-serif;
color: #999; color: #999;
} }
.di-but { .di-but {
width: 30rpx; width: 30rpx;
height: 34rpx; height: 34rpx;
} }
.value input { .value input {
text-align: right; text-align: right;
font-size: 34rpx; font-size: 34rpx;
@ -243,15 +389,18 @@ page {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
.value .picker { .value .picker {
position: relative; position: relative;
width: 100%; width: 100%;
padding-right: 40rpx; padding-right: 40rpx;
text-align: right; text-align: right;
} }
.value .picker .z-weak { .value .picker .z-weak {
color: #999; color: #999;
} }
.value .picker .menu-arrow { .value .picker .menu-arrow {
position: absolute; position: absolute;
top: 20rpx; top: 20rpx;
@ -259,6 +408,7 @@ page {
width: 16rpx; width: 16rpx;
height: 23rpx; height: 23rpx;
} }
.value-mobile { .value-mobile {
position: relative; position: relative;
width: 410rpx; width: 410rpx;
@ -271,6 +421,7 @@ page {
display: flex; display: flex;
margin-left: 30rpx; margin-left: 30rpx;
} }
.value-mobile .get-code { .value-mobile .get-code {
padding: 0 15rpx; padding: 0 15rpx;
height: 60rpx; height: 60rpx;
@ -282,9 +433,11 @@ page {
margin: 0; margin: 0;
margin-left: 25rpx; margin-left: 25rpx;
} }
.value-mobile .button-hover { .value-mobile .button-hover {
background: rgb(175, 1, 1); background: rgb(175, 1, 1);
} }
.value-mobile input { .value-mobile input {
text-align: right; text-align: right;
font-size: 34rpx; font-size: 34rpx;
@ -292,6 +445,7 @@ page {
height: 100%; height: 100%;
width: 55%; width: 55%;
} }
.placeholder-style { .placeholder-style {
font-size: 28rpx; font-size: 28rpx;
color: #999; color: #999;
@ -316,6 +470,7 @@ page {
justify-content: center; justify-content: center;
margin: 80rpx 0 65rpx; margin: 80rpx 0 65rpx;
} }
.submit-button button { .submit-button button {
height: 84rpx; height: 84rpx;
line-height: 84rpx; line-height: 84rpx;
@ -327,7 +482,68 @@ page {
border-radius: 84rpx; border-radius: 84rpx;
background: linear-gradient(to right, #82b4fd, #3e93fe); background: linear-gradient(to right, #82b4fd, #3e93fe);
} }
.disabled { .disabled {
pointer-events: none; /* 禁止点击 */ pointer-events: none;
/* 禁止点击 */
}
textarea {
width: 100%;
height: 298rpx;
background-color: #f7f7f7;
padding: 30rpx;
font-size: 34rpx;
color: #333;
line-height: 50rpx;
position: relative;
box-sizing: border-box;
}
.textarea-placeholder {
font-size: 32rpx;
color: #999;
line-height: 50rpx;
position: absolute;
left: 0;
top: 0;
}
.u-icon {
border-radius: 100%;
border: solid #d0d0d0 1px;
padding: 2px;
box-sizing: border-box;
}
.bot_btn {
display: flex;
background-color: #fff;
z-index: 10;
width: 100%;
justify-content: space-between;
position: fixed;
bottom: 0;
left: 50%;
box-sizing: border-box;
transform: translateX(-50%);
padding: 12rpx 90rpx;
box-sizing: border-box;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
.bot_btn .bottom_btn {
width: 240rpx;
height: 76rpx;
border-radius: 43rpx;
text-align: center;
line-height: 76rpx;
font-size: 32rpx;
}
.bot_btn .btn_bule {
background: #3974f6;
color: #fff;
} }
</style> </style>

51
subpages/carManagement/subpages/carManagement/pages/add/add.vue
View File

@ -1,51 +0,0 @@
<template>
<view>
<!-- subpages/carManagement/subpages/carManagement/pages/add/add.wxml -->
<text>subpages/carManagement/subpages/carManagement/pages/add/add.wxml</text>
</view>
</template>
<script>
// subpages/carManagement/subpages/carManagement/pages/add/add.js
export default {
data() {
return {};
}
/**
* 生命周期函数--监听页面加载
*/,
onLoad(options) {},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {},
/**
* 生命周期函数--监听页面显示
*/
onShow() {},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {},
methods: {}
};
</script>
<style>
/* subpages/carManagement/subpages/carManagement/pages/add/add.wxss */
</style>

2
subpages/demandCheck/pages/dissatisfied/demandCheck/demandCheck.vue
View File

@ -137,7 +137,7 @@
</view> </view>
<u-datetime-picker :show="visibleTime" v-model="happenTime" :maxDate="maxDate" <u-datetime-picker :show="visibleTime" v-model="happenTime" :maxDate="maxDate"
mode="datetime" @close="visibleTime = false" mode="datetime" @cancel="visibleTime = false"
@confirm="onConfirmDate"></u-datetime-picker> @confirm="onConfirmDate"></u-datetime-picker>
<view :class="'item ' + (isDisabled ? 'disabled' : '')" v-if="tabVal === '1'"> <view :class="'item ' + (isDisabled ? 'disabled' : '')" v-if="tabVal === '1'">
<view class="field"> <view class="field">

Write Preview
Loading…
Cancel
Save