qzyReal
/
pco


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654
							<!DOCTYPE html>
<html>
	<head>
		<title>入境登记-添加/修改</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<!-- 所有的 css js 资源 -->
		<link rel="stylesheet" href="../../static/kj/element-ui/theme-chalk/index.css">
		<link rel="stylesheet" href="../../static/sa.css">
		<script src="../../static/kj/vue.min.js"></script>
		<script src="../../static/kj/element-ui/index.js"></script>
		<script src="../../static/kj/httpVueLoader.js"></script>
		<script src="../../static/kj/jquery.min.js"></script>
		<script src="../../static/kj/layer/layer.js"></script>
		<script src="../../static/sa.js"></script>
		<script src="../../static/kj/upload-util.js"></script>
		<style type="text/css">
			.c-panel .el-form .c-label {
				width: 7em !important;
			}

			.c-panel .el-form .c-panel .el-form {
				width: 180px;
			}

			.item-num .el-input__inner {
				width: 130px;
			}

			.xj {
				display: inline;
				color: red;
				margin-left: 9px;
				font-weight: bold;
			}

			.hj {
				color: red;
				margin-left: 9px;
				font-weight: bold;

			}

			.china-car-size .el-input__inner {
				width: 130px;
			}
			.flex-item {
				width: 360px;
				padding-bottom: 20px;
			}
		</style>
	</head>
	<body>
		<div class="vue-box sbot" style="display: none;" :style="'display: block;'">
			<!-- ------- 内容部分 ------- -->
			<div class="s-body">
				<div class="c-panel">
					<div class="c-title">数据添加</div>
					<el-form v-if="m" label-position="left">
						<el-row>
							<el-card class="box-card">
								<div slot="header" class="clearfix">
									<span>基本资料</span>
								</div>
								<div>
									<el-row>
										<el-col span=8>
											<div class="c-item">
												<label class="c-label"><span style="color: red;">*</span>业务项目：</label>
												<el-select v-model="m.goodsId" placeholder="请选择" @change="goodsChange">
													<el-option v-for="item in goodsList" :key="item.id"
														:label="item.name" :value="item.id">
													</el-option>
												</el-select>
											</div>
											<div class="c-item" v-if="goods.needOwner==1">
												<label class="c-label">
													<span style="color: red;">*</span>
													货物名称：</label>
												<el-input v-model="m.businessGoodsName" placeholder="填写货物" clearable>
												</el-input>
											</div>
										</el-col>
										<el-col span=8>
											<div class="c-item" v-if="goods.needCustomer">
												<label class="c-label"><span style="color: red;">*</span>客户：</label>
												<el-select v-model="m.customerId" placeholder="请选择" filterable>
													<el-option v-for="item in customerList" :key="item.id"
														:label="item.name" :value="item.id">
													</el-option>
												</el-select>
											</div>
											<div class="c-item" v-if="goods.needOperateTime==1">
												<label class="c-label"><span style="color: red;">*</span>数量（件）：</label>
												<el-input-number class="item-num" v-model="m.businessGoodsNum" :min="1"
													:max="99999" size="mini">
												</el-input-number>
											</div>
										</el-col>
										<el-col span=8>
											<div class="c-item" v-if="goods.needPartner">
												<label class="c-label"><span style="color: red;">*</span>合作伙伴：</label>
												<el-select v-model="m.pickCustomerId" placeholder="请选择" filterable
													:disabled="partnerDis">
													<el-option v-for="item in partnerList" :key="item.id"
														:label="item.name" :value="item.id">
													</el-option>
												</el-select>
											</div>
											<div class="c-item">
												<label class="c-label">作业人员：</label>
												<el-input v-model="m.operator" placeholder="作业人员" clearable>
												</el-input>
											</div>

										</el-col>
									</el-row>
								</div>
							</el-card>
						</el-row>
						<el-row>
							<el-card class="box-card">
								<div slot="header" class="clearfix">
									<span>业务车辆</span>
									<el-button style="float: right;" icon="el-icon-plus" type="primary"
										@click="showAddModal" v-if="goods.mulCar==1||car.list.length==0">添加
									</el-button>
								</div>
								<el-table :data="car.list">
									<el-table-column type="index" width="50" label="序号">
									</el-table-column>
									<el-table-column prop="carNo" label="车牌号">
									</el-table-column>
									<el-table-column prop="carType" label="类型">
									</el-table-column>
									<el-table-column prop="driverName" label="司机姓名" v-if="car.list.length>0&&car.list[0].driverName">
									</el-table-column>
									<el-table-column prop="driverPhone" label="司机电话" v-if="car.list.length>0&&car.list[0].driverName">
									</el-table-column>
									<el-table-column label="操作" fixed="right" width="140">
										<template slot-scope="s">
											<el-button class="c-btn" type="info" @click="editFn(s.row)">修改</el-button>
											<el-button class="c-btn" type="danger" @click="deleteFn(s.row)">删除
											</el-button>
										</template>
									</el-table-column>
								</el-table>
							</el-card>
						</el-row>
						<el-row>
							<el-card class="box-card">
								<div slot="header" class="clearfix">
									<span>业务类型</span>
								</div>
								<div>
									<div v-for="(type,index) in itemTypeList">
										<div style="display: flex;flex-wrap: wrap;">
											<div style="width: 360px;padding-bottom: 20px;">
												<label style="color: red;"
													v-if="type.need==1">*</label><label>{{type.name}}:</label>
												<el-select v-model="type.itemId" @change="itemChange(type)"
													placeholder="请选择">
													<el-option v-for="item in type.items" :key="item.id"
														:label="item.itemName" :value="item.id">
													</el-option>
												</el-select>
											</div>
											<div style="width: 360px;padding-bottom: 20px;"
												v-show="(type.itemAlias&&(type.itemAlias=='emptyStore'||type.itemAlias=='heavyStore'))">
												<label class="c-label">
													<span style="color: red;">*</span>
													取/存：</label>
												<el-select v-model="type.cabinetType" placeholder="请选择">
													<el-option v-for="item in type.cabinetTypeList" :key="item.value"
														:label="item.name" :value="item.value">
													</el-option>
												</el-select>
											</div>
											<div style="width: 360px;padding-bottom: 20px;" v-if="(type.itemName&&type.itemName.indexOf('集装箱')!==-1)
												||(type.itemName&&type.itemName.indexOf('堆存')!==-1)">
												<label class="c-label">
													<span style="color: red;">*</span>
													柜号：</label>
												<el-input v-model="type.cabinetNo" placeholder="柜号" clearable>
												</el-input>
											</div>
											<div style="width: 360px;padding-bottom: 20px;">
												<label class="c-label">
													<span style="color: red;">*</span>
													数量：</label>
												<el-input-number style="margin-left: 20px;" class="item-num"
													v-model="type.num" :min="1" :disabled="type.disabled" :max="100"
													size="mini"></el-input-number>
												<div class="xj" v-if="type.itemId">
													<label v-if="type.price>1">{{type.price * type.num}}元</label>
													<label v-else>—</label>
													<label @click="cleanItem(type)"
														style="margin-left: 5px;cursor: pointer;z-index: 999;">(<i
															class="el-icon-delete"></i>)</label>
												</div>
											</div>
											<div style="width: 360px;padding-bottom: 20px;"
												v-if="(type.itemAlias&&(type.itemAlias=='bigHeadCar'||type.itemAlias=='coldTruck'||type.itemAlias.indexOf('Store')>-1))">
												<label class="c-label">
													<span style="color: red;">*</span>
													<span v-if="type.cabinetType&&type.cabinetType==1">结束时间：</span>
													<span v-else>开始时间：</span></label>
												<el-date-picker type="datetime" v-model="type.coldStartTime"
													:placeholder="type.cabinetType&&type.cabinetType==1?'结束时间':'开始时间'"></el-date-picker>
											</div>
											<div style="width: 360px;padding-bottom: 20px;"></div>
										</div>
										<el-divider></el-divider>
									</div>
									<div class="hj">
										合计费用:<label v-if="totalPrice>5">{{totalPrice}}元</label>
										<label v-else>未计算</label>
									</div>
								</div>
							</el-card>
						</el-row>
					</el-form>
				</div>
			</div>
			<!-- ------- 底部按钮 ------- -->
			<div class="s-foot">
				<el-button type="primary" @click="ok()">确定</el-button>
				<el-button @click="closeFn()">取消</el-button>
			</div>
			<el-dialog title="车辆录入" :visible.sync="car.visible" width="300">
				<span>
					<el-form label-position="left">
						<div class="c-item">
							<label class="c-label"><span style="color: red;">*</span>车牌号：</label>
							<el-input v-model="car.form.carNo" placeholder="请输入车牌号" value-key='carNo'>
							</el-input>
						</div>
						<div class="c-item">
							<label class="c-label">车辆类型：</label>
							<el-select v-model="car.form.carType" placeholder="请选择" @change="carTypeChange">
								<el-option :label="item.name" :value="item.name" v-for="(item,index) in carTypeList">
								</el-option>
							</el-select>
						</div>
						<div class="c-item" v-if="m.goodsName=='集装箱正面吊装'">
							<label class="c-label">司机姓名：</label>
							<el-input v-model="car.form.driverName" placeholder="司机姓名">
							</el-input>
						</div>
						<div class="c-item"  v-if="m.goodsName=='集装箱正面吊装'">
							<label class="c-label">司机号码：</label>
							<el-input v-model="car.form.driverPhone" placeholder="司机号码">
							</el-input>
						</div>
					</el-form>
				</span>
				<span slot="footer" class="dialog-footer">
					<el-button @click="car.visible = false">取 消</el-button>
					<el-button type="primary" @click="confirmAdd">确 定</el-button>
				</span>
			</el-dialog>
		</div>
		<script>
			var app = new Vue({
				components: {
					"sa-item": httpVueLoader('../../sa-frame/com/sa-item.vue'),
					"sa-td": httpVueLoader('../../sa-frame/com/sa-td.vue')
				},
				el: '.vue-box',
				data: {
					m: {
						id: '', // 主键
						customerId: '', // 客户id
						pickCustomerId: '',
						customerName: '', // 客户名称
						operateTime: '',
						no: '', // 编号
						goodsId: '',
						goodsName: '', // 商品
						businessGoodsNum: 1,
						businessGoodsName: ''
					}, // 实体对象
					partnerDis: false,
					customerList: [],
					partnerList: [],
					carList: [],
					currentCustomerId: 1,
					itemTypeList: [],
					filterTypeList: [],
					goodsList: [],
					tableData: [],
					car: {
						visible: false,
						list: [],
						form: {
							carNo: '',
							carType: '',
							netWeight: '',
							driverName:'',
							driverPhone:'',
							carSize: ''
						}
					},
					declare: {
						visible: false,
						list: [],
						p: {
							pageNo: 1,
							pageSize: 8,
							dataCount: 0,
							declarePeople: '',
							production: '',
							declareNo: '1'
						}
					},
					goods: {
						id: '',
						name: '',
						needWeight: 1,
						needCarSize: 1,
						needDeclare: 1,
						needOperateTime: 1,
						chinaCarPay: 1,
						vietnamCarPay: 1,
						mulCar: 0,
					},
					carTypeList: []
				},
				computed: {
					totalPrice() {
						let itemList = this.itemTypeList.filter(obj => obj.itemId);
						let price = 0;
						for (let i in itemList) {
							let type = itemList[i];
							let num = type.num;
							let items = type.items;
							for (let j in items) {
								let item = items[j];
								if (item.id == type.itemId) {
									price += num * item.price;
									break;
								}
							}
						}
						return price;
					}
				},
				methods: {
					cabinetTypeChange(type) {
						console.log(type);
					},
					resetDclare() {
						this.declare.p.pageNo = 1;
						this.declare.p.pageSize = 8;
						this.declare.p.production = '';
						this.declare.p.declarePeople = '';
						this.getDeclareList();
					},
					handlerDeclare() {
						this.declare.visible = true;
						this.getDeclareList();
					},
					currentPageChange(page) {
						this.declare.p.pageNo = page;
						this.getDeclareList();
					},
					getDeclareList() {
						let declareNo = this.m.declareNo;
						if (declareNo) {
							this.declare.p.declareNo = declareNo;
						}
						sa.ajax('/TbDeclare/getNotBindList', sa.removeNull(this.declare.p), function(resp) {
							let list = resp.data;
							this.declare.list = list;
							this.declare.p.pageNo = resp.pageNo;
							this.declare.p.dataCount = resp.dataCount;
							list.forEach(row => {
								if (row.declareNo == this.m.declareNo && this.m.declareNo) {
									this.$nextTick(() => {
										this.$refs['declareTable'].toggleRowSelection(row, true)
									})
								}
							})
						}.bind(this))
					},
					cleanItem(type) {
						type.itemId = '';
						type.itemName = '';
						type.price = '';
						type.cabinetNo = '';
						type.coldStartTime = '';
					},
					itemChange(type) {
							let itemId = type.itemId;
							let item = type.items.filter(obj => obj.id == itemId).pop();
							if (item) {
								type.inc = item.inc;
								type.price = item.price;
								type.needRemark = item.needRemark;
								type.disabled = false;
								type.itemName = item.itemName;
								type.itemAlias = item.itemAlias;
								if (item.itemName == '人工、机械装卸车辆') {
									type.disabled = true;
								}
							}
					},
					confirmAdd() {
						let list = this.car.list;
						let carNo = this.car.form.carNo;
						let netWeight = this.car.form.netWeight;
						let goods = this.goods;
						let form = this.car.form;
						let carType = form.carType;
						if (!carNo) {
							sa.error('请录入车牌号')
							return false;
						}
						if (carType.indexOf('空') !== -1) {
							netWeight = 0;
						}
						let index = list.map(obj => obj.carNo).indexOf(carNo);
						if (index > -1) {
							list.splice(index, 1);
						}
						let phone=form.driverPhone;
						if(phone&&!sa.isPhone(phone)){
							sa.error('司机号码不正确')
							return;
						}
						let carSize = form.carSize;
						let car = {
							id: form.id,
							carNo: form.carNo.toUpperCase(),
							carType: carType,
							carSize: carSize,
							netWeight: netWeight,
							driverName:form.driverName,
							driverPhone:phone
						}
						this.car.list.push(car);
						this.car.visible = false;

					},
					showAddModal() {
						this.car.visible = true;
						this.car.form.carNo = '';
						this.car.form.carSize = '';
						this.car.form.netWeight = '';
						this.car.form.driverName='';
						this.car.form.driverPhone='';
					},
					editFn(data) {
						Object.assign(this.car, {
							visible: true,
							form: JSON.parse(JSON.stringify(data))
						})
					},
					deleteFn(data) {
						this.car.list.splice(this.car.list.indexOf(data), 1);
					},
					getGoods() {
						sa.ajax('/TbGoods/getList', {
							pageNo: 1,
							pageSize: 10
						}, function(resp) {
							let list = resp.data;
							if (list.length >= 1) {
								let initGoods = list[0];
								this.goods = initGoods
								this.m.goodsId = initGoods.id;
								this.m.goodsName = initGoods.name;
								this.getTypeByGoodsId();
							}
							this.goodsList = list;

						}.bind(this))
					},
					goodsChange(v) {
						let goodsList = this.goodsList;
						let goods = goodsList.filter(goods => goods.id == v).pop();
						this.goods = goods;
						this.m.goodsName = goods.name;
						this.getTypeByGoodsId();
					},
					getTypeByGoodsId() {
						sa.ajax('/TbItemType/getTypeByGoodsId', {
							goodsId: this.m.goodsId
						}, function(resp) {
							let list = resp.data;
							for (let i in list) {
								let type = list[i];
								let cabinetTypeList = [{
									value: 0,
									name: '存柜'
								}, {
									value: 1,
									name: '取柜'
								}];
								type.cabinetTypeList = cabinetTypeList;
								type.cabinetType = 0;
							}
							this.itemTypeList = list.filter(type => type.status == 1);

							//this.filterTypeList = JSON.parse(JSON.stringify(this.itemTypeList));
						}.bind(this))
					},
					getItemType() {
						sa.ajax('/TbItem/getItemType', function(resp) {
							let list = resp.data;
							if (list.length > 0) {
								this.car.form.carType = list[0].name;
							}
							this.carTypeList = list;
						}.bind(this))
					},
					carTypeChange(v) {

					},
					getCustomerList() {
						sa.ajax('/TbCostomer/getList', {
							pageNo: 1,
							pageSize: 200,
							sortType: 20,
							judgeStatus: 2
						}, function(res) {
							let list = res.data;
							this.customerList = list;
							this.partnerList = list.filter(obj => obj.type != 0);
							this.getCurrentCustomer();
						}.bind(this));
					},
					closeFn() {
						parent.app.f5();
						sa.closeCurrIframe();
					},
					validBefore() {
						let goods = this.goods;
						let needCustomer = goods.needCustomer;
						let m = this.m;
						if (needCustomer == 1 && !m.customerId) {
							sa.error('请选择客户');
							return false;
						}
						if (goods.needOperateTime == 1 && (!m.businessGoodsNum || m.businessGoodsNum <= 0)) {
							sa.error('请输入件数');
							return false;
						}
						if (!m.businessGoodsName && goods.needOwner == 1) {
							sa.error('请填写货物');
							return false;
						}
						if (this.car.list.length == 0) {
							sa.error('请录入车辆');
							return false;
						}
						return true;
					},
					// 提交数据
					ok: function() {
						let goods = this.goods;
						let needCustomer = goods.needCustomer;
						let m = this.m;
						if (needCustomer == 1 && !m.customerId) {
							sa.error('请选择客户');
							return false;
						}

						if (!m.businessGoodsName && goods.needOwner == 1) {
							sa.error('请填写货物');
							return false;
						}
						if (goods.needOperateTime == 1 && (!m.businessGoodsNum || m.businessGoodsNum <= 0)) {
							sa.error('请填写货物件数');
							return false;
						}
						if (this.car.list.length == 0) {
							sa.error('请录入车辆');
							return false;
						}
						let typeList = this.itemTypeList;
						let selectList = [];
						for (let i in typeList) {
							let type = typeList[i];
							if (type.need == 1 && !type.itemId) {
								sa.error('【' + type.name + '】必选');
								return false;
							}

							if (type.itemId) {
								let obj = {
									typeId: type.id,
									typeName: type.name,
									id: type.itemId,
									num: type.num,
									price: type.price,
									remark: type.remark,
									cabinetNo: type.cabinetNo,
									coldStartTime: type.coldStartTime,
									itemAlias: type.itemAlias,
									cabinetType: type.cabinetType
								}
								selectList.push(obj);
							}
						}
						if (needCustomer != 1) {
							m.customerId = '';
						}
						m.itemJson = JSON.stringify(selectList);
						let carList = this.car.list;
						m.carJson = JSON.stringify(carList);
						let chinaCarNo = carList
							.filter(car => sa.isCarNo(car.carNo.toUpperCase()))
							.map(car => car.carNo.toUpperCase())
							.join("、");
						let yueCarNo = carList
							.filter(car => !sa.isCarNo(car.carNo.toUpperCase()))
							.map(car => car.carNo.toUpperCase())
							.join("、");
						m.cardNo = yueCarNo;
						m.chinaCarNo = chinaCarNo;
						sa.ajax('/TbBusiness/addOtherBusiness', sa.removeNull(m), function(res) {
							sa.alert('增加成功', this.clean);
						}.bind(this));
					},
					// 添加/修改 完成后的动作
					clean: function() {
						parent.app.f5(); // 刷新父页面列表
						sa.closeCurrIframe(); // 关闭本页
					},
					getCurrentCustomer() {
						sa.ajax('/TbCostomer/getCurrentCustomerId', function(resp) {
							let id = resp.data;
							this.currentCustomerId = id;
							let partnerList = this.partnerList;
							let arr = partnerList.filter(obj => obj.id == id);
							if (arr.length > 0) {
								this.m.pickCustomerId = id;
								this.partnerDis = true;
								this.m.customerId = id;
							}
						}.bind(this));
					},
				},
				mounted: function() {
					this.getGoods();
					this.getItemType();
					this.getCustomerList();
				}
			})
		</script>
	</body>
</html>