contract_detail.vue 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480
  1. <template>
  2. <view class="container">
  3. <view class="information">
  4. <!-- <block v-if="TabCur==2"> -->
  5. <view class="c-row">
  6. <view class="title1">发车信息</view>
  7. </view>
  8. <view class="c-row b-b">
  9. <view class="title">派车编号</view>
  10. <view class="con-list">
  11. <input disabled name="input" v-model="goods.tranCarNo"></input>
  12. </view>
  13. </view>
  14. <view class="c-row b-b">
  15. <view class="title">车牌号</view>
  16. <input maxlength='7' placeholder="请输入车牌号" name="input" v-model="goods.carNo"></input>
  17. </view>
  18. <view class="c-row b-b">
  19. <view class="title">司机手机号</view>
  20. <view class="con-list">
  21. <input maxlength='11' placeholder="请输入司机身份认证的手机号" name="input" v-model="goods.driverPhone"></input>
  22. </view>
  23. </view>
  24. <view class="c-row b-b">
  25. <view class="title">毛重(吨)</view>
  26. <view class="con-list">
  27. <input placeholder="请输入毛重" type="mobile" name="input" @input="grossWeightchange" v-model="goods.grossWeight"></input>
  28. </view>
  29. </view>
  30. <view class="c-row b-b">
  31. <view class="title">皮重(吨)</view>
  32. <view class="con-list">
  33. <input placeholder="请输入皮重" type="mobile" name="input" @input="tarechange" v-model="goods.tare"></input>
  34. </view>
  35. </view>
  36. <view class="c-row b-b">
  37. <view class="title">净重(吨)</view>
  38. <view class="con-list">
  39. <view class="con-list">
  40. <input placeholder="自动计算" type="mobile" name="input" v-model="goods.loadNetWeight"></input>
  41. </view>
  42. </view>
  43. </view>
  44. <view class="c-row ">
  45. <view class="title">发货日期</view>
  46. <view class="con-list">
  47. <view @click="show = true">{{goods.sendDateStart!=''?goods.sendDateStart:time}}</view>
  48. <u-picker :params='params' :default-time='time' @confirm="DateChange" v-model="show" mode="time"></u-picker>
  49. </view>
  50. </view>
  51. </view>
  52. <view class="information">
  53. <view class="c-row">
  54. <view class="action">
  55. 上传磅单照片
  56. </view>
  57. </view>
  58. <view class="c-row">
  59. <view class="grid col-4 grid-square flex-sub">
  60. <view class="bg-img" v-if="goods.loadPoundImg != ''" @tap="ViewImage" :data-url="goods.loadPoundImg">
  61. <image :src="goods.loadPoundImg" mode="aspectFit"></image>
  62. <view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="0">
  63. <text class='cuIcon-close'></text>
  64. </view>
  65. </view>
  66. <view class="solids" @tap="ChooseImagePerson" v-if="goods.loadPoundImg == ''">
  67. <text class='cuIcon-cameraadd'></text>
  68. </view>
  69. </view>
  70. </view>
  71. </view>
  72. <button class="btn btns" @click="getList">提交</button>
  73. <!-- </block> -->
  74. </view>
  75. </template>
  76. <script>
  77. import uploadImage from '@/components/ossutil/uploadFile.js';
  78. import {
  79. mapState
  80. } from 'vuex';
  81. export default {
  82. name: "trust",
  83. data() {
  84. return {
  85. goods: {
  86. tranCarNo:'',
  87. carNo:'',
  88. grossWeight:'',
  89. tare:'',
  90. loadNetWeight:'',
  91. loadPoundImg:'',
  92. contractNo:'',
  93. goodsName:'',
  94. sendDateStart:''
  95. },
  96. params:{
  97. year: true,
  98. month: true,
  99. day: true,
  100. },
  101. carNo:'',
  102. PageCur: "trust",
  103. TabCur: 0,
  104. priceTypeIndex:-1,
  105. priceType: ['库内价', '到库价', '到港价'],
  106. unitPrice:0,
  107. price:'',
  108. seller:'',
  109. sellerPhone:'',
  110. minSale:'',
  111. exsitCount:0,
  112. origin:'',
  113. stock:'',
  114. show:false,
  115. goodsName:'',
  116. verifyCode:'',
  117. sendText0:'获取验证码',
  118. sendText1:'获取验证码',
  119. sendText2:'获取验证码',
  120. sendText3:'获取验证码',
  121. sendDisabled0: false,
  122. sendDisabled1: false,
  123. sendDisabled2: false,
  124. sendDisabled3: false,
  125. buyer:'',
  126. buyerPhone:'',
  127. level:'',
  128. sender:'',
  129. senderPhone:'',
  130. receiver:'',
  131. receiverPhone:'',
  132. total:0,
  133. startPlace:'',
  134. endPlace:'',
  135. driver:'',
  136. driverPhone:'',
  137. carNo:'',
  138. personNoImg:'',
  139. personNoImg1:'',
  140. driverNoImg:'',
  141. driverNoImg1:'',
  142. carNoImg:'',
  143. carNoImg1:'',
  144. goodsName:'',
  145. showTran:true
  146. };
  147. },
  148. computed: {
  149. ...mapState(['hasLogin','userInfo']),
  150. time() {
  151. var date=new Date()
  152. var year=date.getFullYear()
  153. var month=date.getMonth()
  154. var date1=date.getDate()
  155. if(month+1<10){
  156. month="0"+(month+1)
  157. }
  158. if(date1+1<10){
  159. date1="0"+date1
  160. }
  161. return year+'-'+month+"-"+date1
  162. },
  163. startDate() {
  164. //限制开始时间;
  165. //也可以直接限定为当天日期 var date= new Date(); return date
  166. return new Date(new Date(new Date().toLocaleDateString()).getTime()-(1*60*60*1000))
  167. },
  168. endDate() {
  169. return new Date()
  170. }
  171. },
  172. onShow() {
  173. },
  174. onLoad(option) {
  175. this.goodsName=option.goodsName
  176. this.contractNo = option.contractNo
  177. this.goods.goodsName=option.goodsName
  178. this.goods.contractNo = option.contractNo
  179. this.goods.tranCarNo=option.tranCarNo
  180. },
  181. methods: {
  182. DateChange(e) {
  183. this.goods.sendDateStart=e.year+'-'+e.month+'-'+e.day
  184. // this.goods.sendDateStart = e.detail.value
  185. },
  186. commit1(item){
  187. uni.navigateTo({
  188. url: `/pageB/contract/look?id=${item.id}&netWeight=${item.netWeight}&carNo=${item.carNo}&sendDateStart=${item.sendDateStart}`
  189. })
  190. },
  191. grossWeightchange(e) {
  192. if (this.goods.grossWeight && this.goods.tare) {
  193. this.goods.loadNetWeight = Number(
  194. this.goods.grossWeight - this.goods.tare
  195. )
  196. }
  197. },
  198. tarechange(e) {
  199. if (this.goods.grossWeight && this.goods.tare) {
  200. this.goods.loadNetWeight = Number(
  201. this.goods.grossWeight - this.goods.tare
  202. )
  203. }
  204. },
  205. getList(){
  206. // tranCarNo:'',
  207. // carNo:'',
  208. // grossWeight:'',
  209. // tare:'',
  210. // loadNetWeight:'',
  211. // loadPoundImg:'',
  212. // contractNo:'',
  213. // goodsName:'',
  214. if(this.goods.carNo.length==0){
  215. this.$api.msg('车牌号不能为空')
  216. return
  217. }
  218. if(this.goods.carNo.length!=7){
  219. this.$api.msg('车牌号输入错误')
  220. return
  221. }
  222. if(this.goods.driverPhone.length==0){
  223. this.$api.msg('手机号不能为空')
  224. return
  225. }
  226. if(this.goods.driverPhone.length!=11){
  227. this.$api.msg('司机手机号输入错误')
  228. return
  229. }
  230. if(this.goods.grossWeight==''){
  231. this.$api.msg('毛重不能为空')
  232. return
  233. }
  234. if(this.goods.tare==''){
  235. this.$api.msg('皮重不能为空')
  236. return
  237. }
  238. if(this.goods.grossWeight>100){
  239. this.$api.msg('毛重输入错误')
  240. return
  241. }
  242. if(this.goods.tare>50){
  243. this.$api.msg('皮重输入错误')
  244. return
  245. }
  246. var that=this
  247. uni.showModal({
  248. content: '确定提交发车信息?',
  249. success: function (res) {
  250. if (res.confirm) {
  251. that.$api.doRequest('post','/tranCarInfo/api/addTranTask',that.goods).then(res => {
  252. if(res.data.code==200){
  253. console.log(that.goods)
  254. uni.showModal({
  255. content: '提交成功!',
  256. success: function (res) {
  257. if (res.confirm) {
  258. var result = that.goods.tranCarNo.substr(that.goods.tranCarNo.indexOf("C") + 1,that.goods.tranCarNo.length);
  259. var num=Number(result)+1
  260. if(num<=9){
  261. num='C00'+num
  262. }else if(num<100&&num>9){
  263. num='C0'+num
  264. }else if(num<1000&&num>99){
  265. num='C'+num
  266. }
  267. that.goods={
  268. tranCarNo:num,
  269. carNo:'',
  270. grossWeight:'',
  271. tare:'',
  272. loadNetWeight:'',
  273. loadPoundImg:'',
  274. contractNo:that.contractNo,
  275. goodsName:that.goodsName,
  276. sendDateStart:''
  277. }
  278. }else if (res.cancel) {
  279. uni.navigateBack();
  280. }
  281. }
  282. });
  283. }else if(res.data.code==11015){
  284. uni.showToast({
  285. title: '该司机未认证身份,请司机认证后再操作',
  286. icon:'none',
  287. duration: 2000
  288. })
  289. }
  290. })
  291. .catch(res => {
  292. uni.showToast({
  293. title: res.errmsg,
  294. icon:'none',
  295. duration: 2000
  296. })
  297. });
  298. } else if (res.cancel) {
  299. }
  300. }
  301. });
  302. },
  303. ChooseImagePerson() {
  304. uni.chooseImage({
  305. count: 1, //默认9
  306. sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
  307. sourceType: ['album','camera'], //从相册选择
  308. success: (res) => {
  309. //上传图片
  310. //图片路径可自行修改
  311. uploadImage(res.tempFilePaths[0], 'loadPoundImg/',
  312. result => {
  313. this.goods.loadPoundImg = result
  314. uni.hideLoading();
  315. }
  316. )
  317. }
  318. });
  319. },
  320. ChooseImageDriver() {
  321. uni.chooseImage({
  322. count: 1, //默认9
  323. sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
  324. sourceType: ['album','camera'], //从相册选择
  325. success: (res) => {
  326. //上传图片
  327. //图片路径可自行修改
  328. uploadImage(res.tempFilePaths[0], 'driverNoImg/',
  329. result => {
  330. if (this.driverNoImg.length != 0) {
  331. this.driverNoImg1 = result
  332. } else {
  333. this.driverNoImg = result
  334. }
  335. uni.hideLoading();
  336. }
  337. )
  338. }
  339. });
  340. },
  341. ChooseImageCar() {
  342. uni.chooseImage({
  343. count: 1, //默认9
  344. sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
  345. sourceType: ['album','camera'], //从相册选择
  346. success: (res) => {
  347. //上传图片
  348. //图片路径可自行修改
  349. uploadImage(res.tempFilePaths[0], 'carNoImg/',
  350. result => {
  351. if (this.carNoImg.length != 0) {
  352. this.carNoImg1 = result
  353. } else {
  354. this.carNoImg = result
  355. }
  356. uni.hideLoading();
  357. }
  358. )
  359. }
  360. });
  361. },
  362. ViewImage(e) {
  363. var img = [];
  364. img = e.currentTarget.dataset.url.split(' ')
  365. uni.previewImage({
  366. current:0,
  367. urls: img
  368. });
  369. },
  370. DelImg(e) {
  371. uni.showModal({
  372. title: '提示',
  373. content: '确定要删除该照片吗?',
  374. cancelText: '取消',
  375. confirmText: '确定',
  376. success: res => {
  377. if (res.confirm) {
  378. if(e.currentTarget.dataset.index == 0){
  379. this.personNoImg = "";
  380. }
  381. else if(e.currentTarget.dataset.index == 1){
  382. this.personNoImg1 = "";
  383. }
  384. else if(e.currentTarget.dataset.index == 2){
  385. this.driverNoImg = "";
  386. }
  387. else if(e.currentTarget.dataset.index == 3){
  388. this.driverNoImg1 = "";
  389. }
  390. else if(e.currentTarget.dataset.index == 4){
  391. this.carNoImg = "";
  392. }
  393. else if(e.currentTarget.dataset.index == 5){
  394. this.carNoImg1 = "";
  395. }
  396. }
  397. }
  398. })
  399. },
  400. },
  401. }
  402. </script>
  403. <style scoped>
  404. .container{
  405. padding: 10px 10px;
  406. background-color: #F5F6FA;
  407. }
  408. .title1{
  409. font-size: 18px;
  410. font-weight: 600;
  411. }
  412. .cu-form-group input {
  413. text-align: right;
  414. }
  415. .text-white text{
  416. background: linear-gradient(45deg, #3DC146, #B2D612);
  417. padding:5px 10px;
  418. border-radius: 38rpx;
  419. }
  420. .cu-form-group textarea {
  421. text-align: right;
  422. }
  423. .commit{
  424. background: linear-gradient(45deg, #DF331C, #DA611A);
  425. color:#fff;
  426. }
  427. .c-row {
  428. display: -webkit-box;
  429. display: -webkit-flex;
  430. display: flex;
  431. -webkit-box-align: center;
  432. -webkit-align-items: center;
  433. align-items: center;
  434. padding: 20rpx 30rpx;
  435. position: relative;
  436. }
  437. .con-list {
  438. -webkit-box-flex: 1;
  439. -webkit-flex: 1;
  440. flex: 1;
  441. display: -webkit-box;
  442. display: -webkit-flex;
  443. display: flex;
  444. -webkit-box-orient: vertical;
  445. -webkit-box-direction: normal;
  446. -webkit-flex-direction: column;
  447. flex-direction: column;
  448. color: #303133;
  449. line-height: 40rpx;
  450. text-align: right;
  451. padding-right: 20rpx;
  452. font-size: 14px;
  453. }
  454. .information{
  455. background-color: #FFFFFF;
  456. border-radius: 20px;
  457. margin-top: 10px;
  458. }
  459. .btn{
  460. margin-top: 10px;
  461. border-radius: 25px;
  462. background-color: #22C572;
  463. border: none;
  464. color: #FFFFFF;
  465. }
  466. </style>