business-edit.vue 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637
  1. <template>
  2. <view>
  3. <view class="box" v-show="hs.visible">
  4. <view class="top">
  5. <text class="title">录入核酸人员</text>
  6. </view>
  7. <view style="display: flex;">
  8. <u-button type="primary" @click="hs.visible=false" text="返回" style="width: 20px;" size="mini" />
  9. <u-button type="primary" @click="showHsModal" text="添加" icon="plus" style="width: 20px;" size="mini" />
  10. </view>
  11. <u-row style="margin-top: 70rpx;">
  12. <u-col span="4" style="text-align: center;">姓名</u-col>
  13. <u-col span="4" style="text-align: center;">联系号码</u-col>
  14. <u-col span="4" style="text-align: center;">操作</u-col>
  15. </u-row>
  16. <u-row v-for="item in hs.list" style="margin-top: 40rpx;">
  17. <u-col span="4" style="text-align: center;">{{item.name}}</u-col>
  18. <u-col span="4" style="text-align: center;">{{item.phone}}</u-col>
  19. <u-col span="4" style="text-align: center;">
  20. <u-row>
  21. <u-col span="6">
  22. <u-button type="primary" text="编辑" style="width: 20px;" @click="editFn(item)" size="mini">
  23. </u-button>
  24. </u-col>
  25. <u-col span="6">
  26. <u-button type="error" style="width: 20px;" text="删除" @click="deleteFn(item)" size="mini">
  27. </u-button>
  28. </u-col>
  29. </u-row>
  30. </u-col>
  31. </u-row>
  32. </view>
  33. <view class="box" v-show="!hs.visible">
  34. <view class="top">
  35. <text class="title">业务录入</text>
  36. </view>
  37. <view class="item" v-show="customerId=='1'">
  38. <view class="l">企业名称:</view>
  39. <view class="r">
  40. <picker v-if="customer.customerList.length>0" class="p-picker" id="qy"
  41. @change="bindPickerChange($event)" :value="customer.index" :range="customer.customerList"
  42. range-key="name">
  43. <text class="p-text">{{customer.customerList[customer.index].name}}</text>
  44. <u-icon class="p-icon" name="arrow-down-fill" size="20"></u-icon>
  45. </picker>
  46. </view>
  47. </view>
  48. <view class="item">
  49. <view class="l">境外车牌:</view>
  50. <view class="r">
  51. <u-input placeholder="输入车牌号" @input="carInputFn" v-model="form.cardNo" />
  52. </view>
  53. </view>
  54. <view class="item">
  55. <view class="l">规格(米):</view>
  56. <view class="r">
  57. <u-input type="number" placeholder="输入车辆规格" v-model="form.cardSize" />
  58. </view>
  59. </view>
  60. <view class="item">
  61. <view class="l">载重(吨):</view>
  62. <view class="r">
  63. <u-input type="number" placeholder="输入载重" v-model="form.netWeight" />
  64. </view>
  65. </view>
  66. <view class="item">
  67. <view class="l">货物:</view>
  68. <view class="r">
  69. <picker v-if="goods.goodsList.length>0" class="p-picker" id="hw" @change="bindPickerChange($event)"
  70. :value="goods.index" :range="goods.goodsList" range-key="name">
  71. <text class="p-text">{{goods.goodsList[goods.index].name}}</text>
  72. <u-icon class="p-icon" name="arrow-down-fill" size="20"></u-icon>
  73. </picker>
  74. </view>
  75. </view>
  76. <view class="item">
  77. <view class="l">预计入场:</view>
  78. <view class="r">
  79. <view class="r">
  80. <uni-datetime-picker placeholder="请选择" type="datetime" v-model="form.expectInDay"
  81. @close="closeFn" />
  82. </view>
  83. </view>
  84. </view>
  85. <view class="item">
  86. <view class="l">中国车牌号:</view>
  87. <view class="r">
  88. <u-input placeholder="中国车牌号" @input="handler()" v-model="form.chinaCarNo" />
  89. </view>
  90. </view>
  91. <view class="item">
  92. <view class="l">中国司机:</view>
  93. <view class="r">
  94. <u-input placeholder="司机姓名" @input="handler()" v-model="form.driverName" />
  95. </view>
  96. </view>
  97. <view class="item">
  98. <view class="l">联系号码:</view>
  99. <view class="r">
  100. <u-input placeholder="司机联系号码" @input="handler()" v-model="form.driverPhone" />
  101. </view>
  102. </view>
  103. <view class="item-line">
  104. 业务项
  105. </view>
  106. <view class="item" v-for="item in itemList" :key="item.id" v-if="item.items.length>0">
  107. <view class="l">{{item.name}}:</view>
  108. <view class="r">
  109. <view @click="selectItemFn(item)">
  110. <u-input placeholder="请选择" v-model="item.itemName" readonly clearable style="width: 120px;">
  111. <u-icon name="close" v-if="item.itemName" slot="suffix" color="#E5E5E5;" size="5"
  112. @click="item.itemName=''"></u-icon>
  113. </u-input>
  114. </view>
  115. <u-input placeholder="数量" border="surround" v-model="item.num" type="number" style="width: 10px;"
  116. v-if="item.itemName"></u-input>
  117. <view style="margin-left: 20rpx;color: red;" v-if="item.itemName">
  118. {{item.items.filter(obj=>obj.itemName==item.itemName)[0].price*item.num}}元
  119. </view>
  120. <u-icon name="plus" style="position: absolute;right: 10rpx;"
  121. v-if="item.itemName&&item.name.indexOf('人员核酸检测')!==-1" @click="addHsFn(true)"></u-icon>
  122. </view>
  123. </view>
  124. <view class="hj" v-show="totalPrice>0">
  125. 合计:{{totalPrice}}元
  126. </view>
  127. </view>
  128. <u-button type="primary" text="确定" @click="saveFn" v-show="!hs.visible"></u-button>
  129. <!-- ---------------------------------------------------------- -->
  130. <view class="bottom-safety"></view>
  131. <u-popup :show="car.carInput" :overlay="false" @close="car.carInput=false" borderRadius="10">
  132. <view style="padding: 40rpx;line-height: 60rpx;text-align: center;">
  133. <view v-for="item in car.filterList" :id="item.id"
  134. style="margin-bottom: 20rpx;border-bottom: 1rpx solid #E5E5E5;" @click="selectCarNo(item)">
  135. {{item.cardNo}}({{item.cardSize}})
  136. </view>
  137. </view>
  138. </u-popup>
  139. <u-popup :show="driver.show" :overlay="false" @close="driver.show=false" borderRadius="10">
  140. <view style="padding: 40rpx;line-height: 60rpx;text-align: center;">
  141. <view v-for="item in driver.filterList" :id="item.id"
  142. style="margin-bottom: 20rpx;border-bottom: 1rpx solid #E5E5E5;" @click="selectDriverFn(item)">
  143. {{item.name}}({{item.idCard}})
  144. </view>
  145. </view>
  146. </u-popup>
  147. <u-popup :show="show" closeable closeOnClickOverlay @close="show=false">
  148. <view style="padding: 40rpx;">
  149. <u-radio-group @change="itemSelectFn" placement="column" v-model="item.itemName">
  150. <u-radio v-for="item in item.items" :key="item.id" :label="item.itemName" :name="item.itemName"
  151. style="margin-top: 30rpx;">
  152. </u-radio>
  153. </u-radio-group>
  154. </view>
  155. </u-popup>
  156. <u-modal :show="modal.visible" showCancelButton closeOnClickOverlay @cancel="modal.visible=false"
  157. @confirm="addHsPeopleFn">
  158. <view style="">
  159. <u--input placeholder="姓名" border="surround" v-model="modal.form.name"></u--input>
  160. <u--input style="margin-top: 20rpx;" placeholder="联系号码" border="surround" v-model="modal.form.phone">
  161. </u--input>
  162. </view>
  163. </u-modal>
  164. </view>
  165. </template>
  166. <script>
  167. export default {
  168. data() {
  169. return {
  170. car: {
  171. carInput: false,
  172. filterList: [],
  173. },
  174. driver: {
  175. show: false,
  176. filterList: [],
  177. },
  178. customerId: '1',
  179. itemList: [],
  180. form: {
  181. customerId: '',
  182. customerIndex: 0,
  183. countryIndex: 0,
  184. goodsIndex: 0,
  185. cardNo: '',
  186. cardSize: '',
  187. goodsName: '',
  188. netWeight: '',
  189. chinaCarNo: '',
  190. driverName: '',
  191. driverPhone: ''
  192. },
  193. show: false,
  194. item: {
  195. items: []
  196. },
  197. customer: {
  198. index: 0,
  199. customerList: [],
  200. },
  201. carList: [],
  202. driverList: [],
  203. country: {
  204. index: 0,
  205. list: ['越南车', '中国车']
  206. },
  207. goods: {
  208. index: 0,
  209. goodsList: []
  210. },
  211. hs: {
  212. visible: false,
  213. list: []
  214. },
  215. modal: {
  216. visible: false,
  217. form: {
  218. name: '',
  219. phone: ''
  220. }
  221. }
  222. }
  223. },
  224. onLoad(optsions) {
  225. this.form.id = optsions.id;
  226. },
  227. onShow() {
  228. this.customerId = uni.getStorageSync('customerId');
  229. if (!this.form.id) {
  230. setTimeout(() => {
  231. this.checkStore();
  232. }, 1000)
  233. }
  234. },
  235. computed: {
  236. totalPrice() {
  237. let itemList = this.itemList.filter(obj => obj.itemName);
  238. let price = 0;
  239. for (let i in itemList) {
  240. let type = itemList[i];
  241. let items = type.items;
  242. for (let j in items) {
  243. let item = items[j];
  244. if (item.itemName == type.itemName) {
  245. price += item.price;
  246. break;
  247. }
  248. }
  249. }
  250. return price;
  251. }
  252. },
  253. created() {
  254. this.getItemList();
  255. if (this.customerId == '1') {
  256. this.getCustomerList();
  257. }
  258. this.getCarList();
  259. this.getDriverList();
  260. this.getGoodsList();
  261. if (this.form.id) {
  262. this.$common.showLoading('加载中...')
  263. setTimeout(() => {
  264. this.getBusinessById();
  265. }, 800)
  266. }
  267. },
  268. methods: {
  269. closeFn(data) {
  270. console.log(data);
  271. },
  272. getBusinessById() {
  273. this.$api.getBusinessById({
  274. id: this.form.id
  275. }).then(resp => {
  276. let data = resp.data;
  277. this.form = data;
  278. this.customer.index = this.customer.customerList.map(obj => obj.name).indexOf(data
  279. .customerName);
  280. this.goods.index = this.goods.goodsList.map(o => o.name).indexOf(data.goodsName);
  281. let items = data.items;
  282. let names = items.map(obj => obj.itemTypeName);
  283. let itemTypeList = this.itemList.filter(obj => names.indexOf(obj.name) !== -1);
  284. for (let i in itemTypeList) {
  285. let type = itemTypeList[i];
  286. for (let j in items) {
  287. let item = items[j];
  288. if (item.itemTypeId == type.id) {
  289. type.itemName = item.itemName;
  290. type.num = item.num
  291. break;
  292. }
  293. }
  294. }
  295. this.addHsFn(false)
  296. setTimeout(() => {
  297. this.car.carInput = false;
  298. }, 50)
  299. })
  300. },
  301. addHsFn(show) {
  302. this.hs.visible = show;
  303. this.$api.getBusinessPeople({
  304. businessId: this.form.id
  305. }).then(resp => {
  306. let list = resp.data;
  307. let index = 0;
  308. let r = [];
  309. for (let i in list) {
  310. r.push({
  311. name: list[i].name,
  312. phone: list[i].phone,
  313. index: index,
  314. id: list[i].id
  315. })
  316. index++;
  317. }
  318. this.hs.list = r;
  319. })
  320. },
  321. showHsModal() {
  322. Object.assign(this.modal, {
  323. visible: true,
  324. form: {
  325. name: '',
  326. phone: '',
  327. index: -1
  328. }
  329. });
  330. },
  331. addHsPeopleFn() {
  332. if (!this.modal.form.name) {
  333. this.$common.toast('请输入名称');
  334. return;
  335. }
  336. if (!this.modal.form.phone) {
  337. this.$common.toast('请输入联系号码');
  338. return;
  339. }
  340. let dbIndex = this.modal.form.index;
  341. if (dbIndex >= 0) {
  342. this.hs.list[dbIndex].name = this.modal.form.name;
  343. this.hs.list[dbIndex].phone = this.modal.form.phone;
  344. } else {
  345. this.modal.form.index = this.hs.list.length;
  346. this.hs.list.push(this.modal.form);
  347. }
  348. this.modal.visible = false;
  349. this.handler();
  350. },
  351. editFn(data) {
  352. Object.assign(this.modal, {
  353. visible: true,
  354. form: data
  355. })
  356. },
  357. deleteFn(data) {
  358. this.hs.list.splice(data.index, 1);
  359. if (data.id) {
  360. this.$api.deleteHsPeople({
  361. id: data.id
  362. });
  363. }
  364. },
  365. getGoodsList() {
  366. this.$api.getGoodsList().then(resp => {
  367. this.goods.goodsList = resp.data;
  368. })
  369. },
  370. getDriverList() {
  371. this.$api.getDriverList().then(resp => {
  372. this.driverList = resp.data;
  373. })
  374. },
  375. idCardInput() {
  376. let val = this.form.driverIdCard;
  377. let list = this.driverList.filter(obj => obj.idCard.indexOf(val) !== -1);
  378. if (list.length > 0 && val) {
  379. this.driver.show = true;
  380. this.driver.filterList = list;
  381. } else {
  382. this.driver.show = false;
  383. }
  384. },
  385. selectDriverFn(item) {
  386. this.form.driverIdCard = item.idCard;
  387. this.form.driverName = item.name;
  388. this.form.driverPhone = item.phone
  389. let that = this;
  390. setTimeout(() => {
  391. that.driver.show = false;
  392. }, 150)
  393. },
  394. getCarList() {
  395. this.$api.getCarList().then(resp => {
  396. this.carList = resp.data;
  397. })
  398. },
  399. carInputFn() {
  400. let val = this.form.cardNo;
  401. let list = this.carList.filter(obj => obj.cardNo.indexOf(val) !== -1);
  402. if (list.length > 0 && val) {
  403. this.car.carInput = true;
  404. this.car.filterList = list;
  405. } else {
  406. this.car.carInput = false;
  407. }
  408. this.handler();
  409. },
  410. selectCarNo(item) {
  411. this.form.cardNo = item.cardNo;
  412. this.form.cardSize = item.cardSize;
  413. this.form.netWeight = item.lastNetWeight;
  414. let names = this.goods.goodsList.map(obj => obj.name);
  415. let index = names.indexOf(item.lastGoodsName);
  416. this.goods.index = index == -1 ? 0 : index;
  417. this.country.index = this.country.list.indexOf(item.countryName)
  418. let that = this;
  419. this.handler();
  420. setTimeout(() => {
  421. this.car.carInput = false;
  422. }, 150)
  423. },
  424. getCustomerList() {
  425. this.$api.getCustomerList().then(resp => {
  426. this.customer.customerList = resp.data;
  427. })
  428. },
  429. getItemList() {
  430. this.$api.getItemList().then(resp => {
  431. this.itemList = resp.data;
  432. })
  433. },
  434. selectItemFn(item) {
  435. this.item = item;
  436. this.show = true;
  437. },
  438. itemSelectFn(data) {
  439. this.show = false;
  440. this.item.itemName = data;
  441. this.handler();
  442. },
  443. handler() {
  444. let goodsIndex = this.goods.index;
  445. let countryIndex = this.country.index;
  446. this.form.goodsName = this.goods.goodsList[goodsIndex].name;
  447. this.form.countryName = this.country.list[countryIndex];
  448. this.form.goodsIndex = goodsIndex;
  449. this.form.countryIndex = countryIndex;
  450. this.form.peopleJson = JSON.stringify(this.hs.list);
  451. let customerId = this.customerId;
  452. if (customerId == '1') {
  453. let customerIndex = this.customer.index;
  454. this.form.customerId = this.customer.customerList[customerIndex].id;
  455. this.form.customerIndex = customerIndex;
  456. }
  457. let that = this;
  458. uni.setStorage({
  459. key: 'business_' + customerId,
  460. data: that.form
  461. })
  462. },
  463. checkStore() {
  464. let customerId = this.customerId;
  465. let data = uni.getStorageSync('business_' + customerId)
  466. if (data) {
  467. let that = this;
  468. uni.showModal({
  469. title: '提示',
  470. content: '您上次录入数据未提交,是否继续?',
  471. cancelText: '重新录入',
  472. confirmText: '继续',
  473. success(res) {
  474. if (res.confirm) {
  475. that.rebackStore(data);
  476. } else {
  477. uni.removeStorageSync('business_' + customerId)
  478. }
  479. }
  480. })
  481. }
  482. },
  483. rebackStore(data) {
  484. this.form = data;
  485. this.goods.index = data.goodsIndex ? data.goodsIndex : 0;
  486. this.customer.index = data.customerIndex ? data.customerIndex : 0;
  487. this.country.index = data.countryIndex ? data.countryIndex : 0;
  488. this.hs.list = data.peopleJson ? JSON.parse(data.peopleJson) : []
  489. setTimeout(() => {
  490. this.car.carInput = false;
  491. this.driver.show = false;
  492. }, 150)
  493. },
  494. check() {
  495. this.handler();
  496. if (!this.form.cardNo) {
  497. this.$common.toast('请录入境外车牌号')
  498. return false;
  499. }
  500. if (!this.form.cardSize) {
  501. this.$common.toast('请录入车辆规格')
  502. return false;
  503. }
  504. let inDayTime=this.form.expectInDay;
  505. if(!inDayTime||inDayTime.length<12){
  506. this.$common.toast('入场时间不正确')
  507. return false;
  508. }
  509. if (!this.form.chinaCarNo) {
  510. this.$common.toast('请录入中国车牌')
  511. return false;
  512. }
  513. if (!this.form.driverName) {
  514. this.$common.toast('请录入中国司机')
  515. return false;
  516. }
  517. if (!this.form.driverPhone) {
  518. this.$common.toast('请录入司机联系号码')
  519. return false;
  520. }
  521. let typeList = this.itemList.filter(obj => obj.itemName);
  522. if (typeList.length == 0) {
  523. this.$common.toast('至少选择一项业务项')
  524. return false;
  525. }
  526. if (typeList.filter(obj => obj.name.indexOf('核酸') !== -1).length > 0 && this.hs.list.length == 0) {
  527. this.$common.toast('录入核酸检测人员')
  528. return false;
  529. }
  530. let list = [];
  531. for (let i in typeList) {
  532. let type = typeList[i];
  533. type.num = 1;
  534. for (let j in type.items) {
  535. let item = type.items[j];
  536. if (type.itemName == item.itemName) {
  537. type.itemId = item.id;
  538. break;
  539. }
  540. }
  541. list.push({
  542. itemId: type.itemId,
  543. num: type.num
  544. })
  545. }
  546. this.form.itemJson = JSON.stringify(list);
  547. this.form.items = null;
  548. if (this.customerId == '1') {
  549. this.form.customerId = this.customer.customerList[this.customer.index].id;
  550. } else {
  551. this.form.customerId = this.customerId;
  552. }
  553. return true;
  554. },
  555. saveFn() {
  556. if (this.check()) {
  557. let obj = this.$common.removeNull(this.form);
  558. this.$api.saveBusiness(obj).then(resp => {
  559. if (resp.code == 200) {
  560. uni.removeStorageSync('business_' + this.customerId);
  561. this.$common.toast('修改成功');
  562. this.hs.list = [];
  563. setTimeout(() => {
  564. this.$common.to('/pages/business-order/business-order')
  565. }, 1000)
  566. }
  567. })
  568. }
  569. },
  570. bindPickerChange(e) {
  571. var nowId = e.target.id; //当前picker的ID id需要自己设置 在picker中
  572. var value = e.detail.value; //当前picker选中的值
  573. switch (nowId) { //根据ID判断是哪个picker
  574. case "qy": //picker的ID
  575. this.customer.index = value;
  576. break;
  577. case "hw": //picker的ID
  578. this.goods.index = value;
  579. break;
  580. case "gj": //picker的ID
  581. this.country.index = value;
  582. break;
  583. }
  584. this.handler();
  585. },
  586. }
  587. }
  588. </script>
  589. <style lang="scss">
  590. page {
  591. background-color: #fff;
  592. }
  593. .hs-item {
  594. text-align: center;
  595. }
  596. .item-line {
  597. color: #a2a2a2;
  598. padding: 5px 0 10px 29px;
  599. border-bottom: 1px solid #E5E5E5;
  600. }
  601. .hj {
  602. padding: 50rpx;
  603. font-size: 40rpx;
  604. color: red;
  605. font-weight: bold;
  606. }
  607. .save-btn {
  608. background-color: #ff4200;
  609. height: 88rpx;
  610. display: flex;
  611. justify-content: center;
  612. align-items: center;
  613. margin: 60rpx;
  614. color: #fff;
  615. font-size: 30rpx;
  616. font-weight: bold;
  617. border-radius: 10rpx;
  618. }
  619. @import '@/common/common.scss'
  620. </style>