freight_settlement_approval.vue 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233
  1. <template>
  2. <view class="container">
  3. <view class="topInfo">
  4. <view class="topInfo-item">
  5. <view class="flex info">
  6. <view class="logo">
  7. <image src="../../../static/img/reject.png" mode="" v-if="list[0].approveStatus == '已驳回'"
  8. style="height: 40rpx;"></image><!-- 驳回 -->
  9. <image src="../../../static/img/tongguo.png" mode="" v-if="list[0].approveStatus == '已通过'"
  10. style="height: 40rpx;"></image><!-- 通过 -->
  11. <image src="../../../static/img/daishenhe.png" mode=""
  12. v-if="list[0].approveStatus == '待决策人审核'|| list[0].approveStatus == '待财务审核'"
  13. style="height: 40rpx;"></image><!-- 待审核 -->
  14. </view>
  15. <view class="infoText">{{list[0].approveStatus?list[0].approveStatus:list[0].status}}</view>
  16. </view>
  17. <view class="infoData">{{list[0].updateDate}}</view>
  18. </view>
  19. </view>
  20. <view class="content">
  21. <view class="top">
  22. <view v-if='list[0].contractFlag=="1"'>合同编号</view>
  23. <view v-if='list[0].contractFlag=="0"'>移库编号</view>
  24. <view>{{list[0].contractNo}}</view>
  25. </view>
  26. <view class="person-info">
  27. <view v-if='list[0].contractFlag=="1"' class="top1" style="display: flex;">
  28. <view>客户</view>
  29. <view>{{list[0].customer}}</view>
  30. </view>
  31. <view class="top1">
  32. <view>发货地址</view>
  33. <view class="top_info">{{list[0].send ? list[0].send : "暂无发货地址"}}</view>
  34. </view>
  35. <view class="top1">
  36. <view>收货地址</view>
  37. <view class="top_info">{{list[0].receive ? list[0].receive : "暂无收货地址"}}</view>
  38. </view>
  39. </view>
  40. <view class="car-container">
  41. <view v-for="item in list" class="car-container-item">
  42. <view class="car-num title" v-if="item.tranTypeKey== '1'">{{item.carNo}} ({{item.tranCarNo}})</view>
  43. <view class="car-num title" v-if="item.tranTypeKey== '2'">车厢号{{item.boxNo}}</view>
  44. <view class="car-num title" v-if="item.tranTypeKey== '3'&&item.shipType== '散船'">仓位号{{item.boxNo}}
  45. </view>
  46. <view class="car-num title" v-if="item.tranTypeKey== '3'&&item.shipType== '集装箱'">箱号{{item.boxNo}}
  47. </view>
  48. <view class="car-type-item">
  49. <view class="left">装</view>
  50. <view class="textInfo">{{item.loadingWeight}}吨</view>
  51. </view>
  52. <view class="car-type-item">
  53. <view class="center">卸</view>
  54. <view class="textInfo">{{item.unloadingWeight}}吨</view>
  55. </view>
  56. <view class="car-type-item">
  57. <view class="right">结</view>
  58. <view class="textInfo">{{item.settlementWeight}}吨</view>
  59. </view>
  60. <view class="car-type-item">
  61. <view class="left">运</view>
  62. <view class="textInfo">{{item.transportPrice}}元/吨</view>
  63. </view>
  64. <view class="car-type-item">
  65. <view v-if='item.deductionAmount>0' class="center">扣</view>
  66. <view v-if='item.deductionAmount<0' class="center">加</view>
  67. <view class="textInfo">{{item.deductionAmount}}元</view>
  68. </view>
  69. <view class="car-type-item">
  70. <view class="right">付</view>
  71. <view class="textInfo">{{item.amountIngPayable}}元</view>
  72. </view>
  73. </view>
  74. </view>
  75. </view>
  76. <u-form ref="uForm">
  77. <view class="form_top">流程</view>
  78. <view class="content2">
  79. <view v-for="(item,index) in auditList" :key='index' class="audit">
  80. <view class="row">
  81. <view class="row-left">
  82. <view class="item1">
  83. <view class="item-content">{{item.operatorTitle}}</view>
  84. <view v-if="item.status=='success'" class='status success'>
  85. <u-icon name="checkmark" color="#2979ff" size="24"></u-icon>
  86. </view>
  87. <view v-if="item.status=='error'" class='status error'>
  88. <u-icon name="close" color="rgb(245, 108, 108)" size="24"></u-icon>
  89. </view>
  90. <view v-if="item.status=='question'" class='status question'>
  91. <u-icon name="question" color="#f9ae3d" size="24"></u-icon>
  92. </view>
  93. </view>
  94. </view>
  95. <view class="row-right">
  96. <view class="right-item">
  97. <view class="item2">
  98. <view class="name">{{item.desc}}
  99. </view>
  100. <!-- <view class='time'>{{item.updateDate}}</view> -->
  101. <view v-if="item.status=='success'" class="status success">
  102. {{item.commonStaffs1?item.staffscontent:item.operatorName}}<text
  103. v-if='!item.commonStaffs1&&index!=0'>已审核</text></view>
  104. <view v-if="item.status=='error'" class="status error">
  105. {{item.commonStaffs1?item.staffscontent:item.operatorName}}<text
  106. v-if='!item.commonStaffs1'>{{item.workflowHistoricTasks ? "已驳回":''}}</text>
  107. </view>
  108. <view v-if="item.status=='question'" class="status question">
  109. {{item.commonStaffs1?item.staffscontent:''}}<text
  110. v-if='!item.commonStaffs1'>未审核</text></view>
  111. <!-- <view class="status success">吕波(已审核)</view> -->
  112. </view>
  113. <view v-if='index==0||item.workflowHistoricTasks&&item.workflowHistoricTasks.length>0'
  114. class='time'>
  115. {{item.updateDate}}
  116. </view>
  117. </view>
  118. <view v-if='item.auditMind' class="right-content">
  119. {{item.auditMind}}
  120. </view>
  121. </view>
  122. <view v-if='item.commonStaffs1' class="right">
  123. <u-icon @click='showcontent(item)' :name="item.showflow?'arrow-up':'arrow-down'" size="28">
  124. </u-icon>
  125. </view>
  126. </view>
  127. <view v-if='item.showflow' style='padding:10px 0 0 50px;'>
  128. <view class='row2'>
  129. <view v-for='item1 in item.commonStaffs1' style='margin:5px;text-align:center;'>
  130. <view class="item-content">
  131. <u-icon v-if='item1.status' name="checkmark" color="#fff" size="14"></u-icon>
  132. <u-icon v-if='!item1.status' name="question" color="#f9ae3d" size="14"></u-icon>
  133. </view>
  134. <view class="name">{{item1.staffName}}</view>
  135. </view>
  136. </view>
  137. </view>
  138. <view class="row-line" v-if="index!= auditList.length - 1"></view>
  139. </view>
  140. </view>
  141. </u-form>
  142. <view v-if='show' class="shade">
  143. <view class="wrap">
  144. <view class="alert-top">
  145. <view class="title">
  146. {{title}}
  147. </view>
  148. <u-icon name="close" class="close" color="#8890B1" @click="close()"></u-icon>
  149. </view>
  150. <view class="u-textarea-style">
  151. <view class="right-bottom">
  152. {{auditMind.length}}/100个字
  153. </view>
  154. <u-input class="" v-model='auditMind' placeholder="请在此输入审核意见" type="textarea" height="414"
  155. maxlength="100" />
  156. </view>
  157. <view @click='close()' class="cancel">取消</view>
  158. <view @click='passSubmit()' class="confirm">确定</view>
  159. </view>
  160. </view>
  161. <u-toast ref="uToast" />
  162. <view style='padding:10px;' class='flex bottom-btn'>
  163. <u-button v-if='isSHowBtn' @click='reject' type="error" class="btn1" hover-class='none'>驳回</u-button>
  164. <u-button v-if='isSHowBtn' @click='pass' type="success" class="btn2">通过</u-button>
  165. </view>
  166. </view>
  167. </template>
  168. <script>
  169. import helper from '@/common/helper.js';
  170. export default {
  171. data() {
  172. return {
  173. isSHowBtn: true,
  174. currentPage: 1,
  175. pageSize: 10,
  176. list: {
  177. approveStatus: "",
  178. },
  179. title: '',
  180. show: false,
  181. height: 200,
  182. auditList:[],
  183. auditMind: '',
  184. autoHeight: true,
  185. border: false,
  186. everyCheck: '',
  187. customerName: "", //客户
  188. shippingAddress: "", //发货地址
  189. receivingAddress: "", //收货地址
  190. }
  191. },
  192. onBackPress(e) {
  193. if (this.everyCheck) {
  194. uni.navigateTo({
  195. url: "/pages/task/my_task"
  196. })
  197. return true;
  198. }
  199. },
  200. onLoad(options) {
  201. this.id = options.id
  202. this.everyCheck = uni.getStorageSync("everyTask")
  203. this.isSHowBtn = options.isShowbtn
  204. this.getList()
  205. },
  206. methods: {
  207. getList() {
  208. this.$api.doRequest('get', '/tranSettlementReport/getTranSettlementReport', {
  209. batchId: this.id
  210. }).then(res => {
  211. if (res.data.code == 200) {
  212. this.list = res.data.data
  213. // console.log(this.list, 124)
  214. // 查流程
  215. this.$api.doRequest('get', '/workflow/query/workflowDefinitions', {
  216. businessCode: 'TRANSPORTATION-SETTLEMENT-REPORT',
  217. tmpCompId: uni.getStorageSync('pcUserInfo').compId
  218. }).then(res1 => {
  219. this.$api.doRequest('get', '/commonUser/getHis', {
  220. workflowId: res1.data.data[0].id,
  221. businessKey: this.id
  222. }).then(response => {
  223. uni.hideLoading()
  224. for (let i = 0; i < response.data.data.length; i++) {
  225. this.$set(response.data.data[i], 'status', 'question')
  226. console.log(response.data.data[i].workflowHistoricTasks, i)
  227. if (response.data.data[i].commonStaffs) {
  228. response.data.data[i].showflow = false
  229. response.data.data[i].operatorTitle = response.data.data[i]
  230. .desc.substring(0, 2)
  231. response.data.data[i].operatorName = response.data.data[i]
  232. .desc
  233. response.data.data[i].staffscontent = '共' + response.data
  234. .data[i].commonStaffs.length + '人,当前审核' + response.data
  235. .data[i].workflowHistoricTasks.length + '人'
  236. if (response.data.data[i].workflowHistoricTasks && response
  237. .data.data[i].workflowHistoricTasks.length > 0) {
  238. if (response.data.data[i].workflowHistoricTasks
  239. .length != response.data.data[i].commonStaffs
  240. .length) {
  241. // response.data.data[i].status='question'
  242. this.$set(response.data.data[i], 'status',
  243. 'question')
  244. } else {
  245. this.$set(response.data.data[i], 'status',
  246. 'success')
  247. // response.data.data[i].status='success'
  248. }
  249. response.data.data[i].workflowlen = response.data.data[
  250. i].workflowHistoricTasks.length
  251. var workflowdata = response.data.data[i]
  252. .workflowHistoricTasks
  253. var staffsdata = response.data.data[i].commonStaffs
  254. for (let q = 0; q < staffsdata.length; q++) {
  255. staffsdata[q].status = false
  256. staffsdata[q].staffTitle = staffsdata[q].staffName
  257. for (let k = 0; k < workflowdata.length; k++) {
  258. if (staffsdata[q].staffId == workflowdata[k]
  259. .operatorId) {
  260. staffsdata[q].status = true
  261. }
  262. }
  263. }
  264. }
  265. response.data.data[i].commonStaffs1 = response.data.data[i]
  266. .commonStaffs
  267. } else {
  268. if (response.data.data[i].workflowHistoricTasks && response
  269. .data.data[i].workflowHistoricTasks.length > 0) {
  270. var len = response.data.data[i].workflowHistoricTasks
  271. .length - 1
  272. if (response.data.data[i].workflowHistoricTasks[len]
  273. .approved) {
  274. this.$set(response.data.data[i], 'status',
  275. 'success')
  276. } else {
  277. this.$set(response.data.data[i], 'status', 'error')
  278. }
  279. response.data.data[i].operatorTitle = response.data
  280. .data[i].workflowHistoricTasks[len].operatorName
  281. .substring(response.data.data[i]
  282. .workflowHistoricTasks[0].operatorName.length -
  283. 2)
  284. response.data.data[i].operatorName = response.data
  285. .data[i].workflowHistoricTasks[len].operatorName
  286. var time = new Date(response.data.data[i]
  287. .workflowHistoricTasks[len].claimTime)
  288. .getTime()
  289. response.data.data[i].updateDate = this.$u.timeFormat(
  290. time, 'mm.dd hh:MM')
  291. response.data.data[i].auditMind = response.data.data[i]
  292. .workflowHistoricTasks[len].auditMind
  293. } else {
  294. this.$set(response.data.data[i], 'status', 'question')
  295. // response.data.data[i].status='question'
  296. if (response.data.data[i].desc == '总经理助理审核') {
  297. response.data.data[i].operatorTitle = '总助'
  298. } else if (response.data.data[i].desc == '杜大光审核') {
  299. response.data.data[i].operatorTitle = '大光'
  300. } else {
  301. response.data.data[i].operatorTitle = response.data
  302. .data[i].desc.substring(0, 2)
  303. }
  304. response.data.data[i].operatorName = response.data
  305. .data[i].desc
  306. var time1 = new Date(response.data.data[i].updateDate)
  307. .getTime()
  308. response.data.data[i].updateDate = this.$u.timeFormat(
  309. time1, 'mm.dd hh:MM')
  310. response.data.data[i].auditMind = ''
  311. }
  312. }
  313. }
  314. console.log(response.data.data)
  315. for(let i = 0 ;i<response.data.data.length;i++){
  316. if(response.data.data[i].status == "error"){
  317. this.auditCheck = "error"
  318. break;
  319. }else if(response.data.data[i].status == "question"){
  320. this.auditCheck = "question"
  321. break;
  322. }else{
  323. this.auditCheck = "success"
  324. }
  325. }
  326. this.auditList = response.data.data
  327. var time2 = new Date(this.list[0].createDate).getTime()
  328. var time3 = this.$u.timeFormat(time2, 'mm.dd hh:MM')
  329. this.auditList.unshift({
  330. operatorTitle: this.list[0].creater.substring(0, 2),
  331. operatorName: this.list[0].creater,
  332. updateDate: time3,
  333. auditMind: '',
  334. desc: '发起申请',
  335. showflow: false,
  336. commonStaffs1: null,
  337. commonStaffs: null,
  338. workflowHistoricTasks: [],
  339. status: 'success'
  340. })
  341. })
  342. })
  343. }
  344. })
  345. // this.$api.doRequest('get', '/tranSettlementReport/getInfo', {
  346. // id: this.id
  347. // }).then(res => {
  348. // this.contractNo = res.data.data.contractNo
  349. // this.carId = res.data.data.carId
  350. // this.customerName = res.data.data.customer
  351. // this.shippingAddress = res.data.data.send
  352. // this.receivingAddress = res.data.data.receive
  353. // if (res.data.code == 200) {
  354. // this.$api.doRequest('get', '/tranSettlementReport/getTranSettlementReport', {
  355. // compId: "2710b21efc1e4393930c5dc800010dc4",
  356. // currentPage: this.currentPage,
  357. // pageSize: this.pageSize,
  358. // contractNo: this.contractNo,
  359. // carId: this.carId,
  360. // }).then(res => {
  361. // if (res.data.code == 200) {
  362. // this.list = res.data.data.records[0]
  363. // console.log(this.list, 124)
  364. // }
  365. // })
  366. // }
  367. // })
  368. },
  369. close() {
  370. this.show = false
  371. },
  372. pass() {
  373. this.show = true
  374. this.title = '审核意见(通过)'
  375. },
  376. reject() {
  377. this.show = true
  378. this.title = '驳回原因(驳回)'
  379. },
  380. // 驳回
  381. rejectSubmit() {
  382. var that = this
  383. if (!this.auditMind) {
  384. this.$api.msg('驳回原因不能为空!')
  385. } else {
  386. this.show = false
  387. uni.showModal({
  388. content: "是否确定驳回?",
  389. showCancel: true,
  390. confirmText: '确定',
  391. success: function(res) {
  392. if (res.confirm) {
  393. that.audit(that.list[0], 0, false, true, that.auditMind)
  394. }
  395. }
  396. })
  397. }
  398. },
  399. //通过
  400. passSubmit() {
  401. var that = this
  402. if (this.title == '驳回原因(驳回)') {
  403. this.rejectSubmit()
  404. } else {
  405. this.show = false
  406. uni.showModal({
  407. content: "是否确定通过?",
  408. showCancel: true,
  409. confirmText: '确定',
  410. success: function(res) {
  411. if (res.confirm) {
  412. that.audit(that.list[0], 0, true, 2, that.auditMind)
  413. }
  414. }
  415. })
  416. }
  417. },
  418. //审核方法
  419. audit(list, index, status, status2, reason) {
  420. uni.showLoading({
  421. title: "审核中"
  422. })
  423. let that = this
  424. if (this.list) {
  425. this.$api.doRequest('post', '/workflow/api/handle', {
  426. taskId: list.taskId,
  427. approved: status,
  428. auditMind: this.auditMind ,
  429. needReapply: status2 != undefined ? true : false,
  430. }).then(res => {
  431. if (status == true) {
  432. this.$api.msg('通过成功')
  433. } else if (status == false) {
  434. this.$api.msg('驳回成功')
  435. }
  436. setTimeout(function() {
  437. if (that.everyCheck) {
  438. helper.setAudit(that.list[0])
  439. } else {
  440. uni.navigateBack()
  441. }
  442. }, 1000);
  443. })
  444. }
  445. },
  446. }
  447. }
  448. </script>
  449. <style scoped lang="scss">
  450. .container {
  451. margin: 10rpx;
  452. padding: 20rpx 20rpx 230rpx 20rpx;
  453. }
  454. .u-form {
  455. margin-bottom: 20rpx;
  456. background: #fff;
  457. border-radius: 10px;
  458. padding: 30rpx 10px;
  459. .u-form-item {
  460. line-height: 30px;
  461. padding: 0px 0;
  462. font-size: 26rpx;
  463. color: #878C9C;
  464. }
  465. }
  466. .content {
  467. .top {
  468. display: flex;
  469. justify-content: space-between;
  470. border-radius: 20rpx;
  471. background: white;
  472. padding: 30rpx 20rpx;
  473. font-size: 36rpx;
  474. margin-top: 20rpx;
  475. }
  476. .top1 {
  477. // display: flex;
  478. justify-content: space-between;
  479. border-radius: 20rpx;
  480. background: white;
  481. padding: 10rpx 20rpx;
  482. font-size: 30rpx;
  483. margin-top: 20rpx;
  484. }
  485. .top_info {
  486. margin: 10rpx 0;
  487. }
  488. .title {
  489. font-size: 28rpx;
  490. font-weight: 600;
  491. color: #333333;
  492. text-align: left;
  493. margin-bottom: 30rpx;
  494. }
  495. .car-container {
  496. // border-bottom: 2rpx solid #EEEEEE;
  497. }
  498. .car-container-item {
  499. background: white;
  500. padding: 10rpx 20rpx;
  501. border-radius: 20rpx;
  502. margin: 20rpx 0;
  503. }
  504. .car-type-item {
  505. display: inline-flex;
  506. // justify-content: center;
  507. width: 33.33%;
  508. margin-bottom: 40rpx;
  509. }
  510. .title {
  511. font-size: 36rpx;
  512. }
  513. }
  514. .bottom-btn {
  515. width: 100%;
  516. position: fixed;
  517. bottom: 0;
  518. display: flex;
  519. z-index: 2;
  520. left: 0;
  521. background-color: #f8f8f8;
  522. flex-direction: column;
  523. .btn1,
  524. .btn2 {
  525. width: 100%;
  526. margin-bottom: 26rpx;
  527. border-radius: 90rpx;
  528. }
  529. .btn1 {
  530. background: white;
  531. color: #00C265;
  532. }
  533. }
  534. .submit {
  535. width: 40%;
  536. background: #22C572;
  537. border-radius: 10rpx;
  538. }
  539. .left {
  540. background: #FEECE6;
  541. color: #FE6430;
  542. }
  543. .center {
  544. background: #EBEEFA;
  545. color: #5C76DF;
  546. }
  547. .right {
  548. background: #E9F8F0;
  549. color: #22C572;
  550. }
  551. .left,
  552. .center,
  553. .right {
  554. width: 50rpx;
  555. height: 50rpx;
  556. text-align: center;
  557. line-height: 50rpx;
  558. border-radius: 10rpx;
  559. }
  560. .textInfo {
  561. margin: 6rpx 0 0 10rpx;
  562. }
  563. .topInfo {
  564. height: 210rpx;
  565. background: linear-gradient(270deg, #22C572 0%, #34DE8A 100%);
  566. padding: 30rpx;
  567. .topInfo-item {
  568. height: 158rpx;
  569. background-color: #FFFFFF;
  570. border-radius: 20rpx;
  571. padding: 40rpx;
  572. .logo {
  573. width: 40rpx;
  574. height: 40rpx;
  575. margin-top: 8rpx;
  576. }
  577. .infoText {
  578. font-size: 36rpx;
  579. font-weight: 600;
  580. margin-left: 20rpx;
  581. }
  582. .infoData {
  583. color: #878C9C;
  584. font-size: 26rpx;
  585. margin-top: 10rpx;
  586. }
  587. }
  588. }
  589. .shade {
  590. position: fixed;
  591. top: 0;
  592. left: 0;
  593. height: 100%;
  594. width: 100%;
  595. background: rgba(0, 0, 0, 0.4);
  596. z-index: 3;
  597. .wrap {
  598. position: absolute;
  599. left: 0;
  600. top: 0;
  601. right: 0;
  602. bottom: 0;
  603. margin: auto;
  604. background: #fff;
  605. width: calc(100% - 198rpx);
  606. height: 700rpx;
  607. border-radius: 20rpx;
  608. .alert-top {
  609. padding: 33rpx;
  610. display: flex;
  611. justify-content: center;
  612. align-items: center;
  613. position: relative;
  614. }
  615. .title {
  616. font-size: 32rpx;
  617. font-weight: 600;
  618. color: #333333;
  619. }
  620. .close {
  621. position: absolute;
  622. right: 33rpx;
  623. }
  624. }
  625. }
  626. .cancel,
  627. .confirm {
  628. position: absolute;
  629. display: inline-block;
  630. width: 50%;
  631. text-align: center;
  632. bottom: 0;
  633. padding: 10px;
  634. border-top: 1px solid #eee;
  635. font-size: 34rpx;
  636. }
  637. .cancel {
  638. left: 0;
  639. border-right: 1px solid #eee;
  640. color: #AFB3BF;
  641. }
  642. .confirm {
  643. right: 0;
  644. color: #22C572;
  645. }
  646. .u-textarea-style {
  647. margin: 20rpx;
  648. background: #F9F9FA;
  649. border-radius: 10px;
  650. border: 1px solid #EEEEEE;
  651. padding: 10rpx 20rpx;
  652. position: relative;
  653. .right-bottom {
  654. position: absolute;
  655. right: 20rpx;
  656. bottom: 20rpx;
  657. color: #AFB3BF;
  658. }
  659. }
  660. /deep/.u-input__textarea {
  661. height: 300rpx !important;
  662. }
  663. .person-info {
  664. background: white;
  665. padding: 20rpx 0;
  666. border-radius: 20rpx;
  667. // margin-bottom: 50rpx;
  668. margin: 20rpx 0;
  669. .tit {
  670. font-size: 36rpx;
  671. }
  672. }
  673. .c-row {
  674. display: -webkit-box;
  675. display: -webkit-flex;
  676. display: flex;
  677. -webkit-box-align: center;
  678. -webkit-align-items: center;
  679. align-items: center;
  680. padding: 20rpx 30rpx;
  681. position: relative;
  682. }
  683. .c-row1 {
  684. // display: -webkit-box;
  685. // display: -webkit-flex;
  686. // display: flex;
  687. -webkit-box-align: center;
  688. -webkit-align-items: center;
  689. align-items: center;
  690. padding: 20rpx 30rpx;
  691. position: relative;
  692. }
  693. .container {
  694. padding: 20rpx 20rpx 250rpx 20rpx;
  695. }
  696. .u-form {
  697. margin-bottom: 20rpx;
  698. background: #fff;
  699. border-radius: 10px;
  700. padding: 30rpx 10px;
  701. .u-form-item {
  702. line-height: 30px;
  703. padding: 0px 0;
  704. font-size: 26rpx;
  705. color: #878C9C;
  706. }
  707. }
  708. .content {
  709. margin-top: 30rpx;
  710. .top {
  711. display: flex;
  712. justify-content: space-between;
  713. }
  714. .content-item {
  715. border-radius: 20rpx;
  716. background: white;
  717. padding: 40rpx 20rpx;
  718. margin-bottom: 30rpx;
  719. }
  720. .title {
  721. font-size: 32rpx;
  722. font-weight: 600;
  723. color: #333333;
  724. text-align: left;
  725. margin: 20rpx 0;
  726. }
  727. .car-container {
  728. border-bottom: 2rpx solid #EEEEEE;
  729. }
  730. .car-type-item {
  731. font-size: 28rpx;
  732. margin: 20rpx 0;
  733. color: #878C9C;
  734. }
  735. .weightInfoCss {
  736. font-size: 28rpx;
  737. color: #333333;
  738. font-weight: 500;
  739. }
  740. .row {
  741. display: flex;
  742. justify-content: space-between;
  743. // .right,
  744. // input {
  745. // font-size: 28rpx;
  746. // // color: #333333;
  747. // }
  748. }
  749. .money {
  750. font-size: 32rpx;
  751. font-weight: 500;
  752. margin-bottom: 30rpx;
  753. }
  754. .moneyInfo {
  755. color: #22C572;
  756. font-size: 32rpx;
  757. }
  758. }
  759. .bottom-btn {
  760. width: 100%;
  761. position: fixed;
  762. bottom: 0;
  763. display: flex;
  764. z-index: 2;
  765. left: 0;
  766. background-color: #f8f8f8;
  767. flex-direction: column;
  768. .btn1,
  769. .btn2 {
  770. width: 100%;
  771. margin-bottom: 26rpx;
  772. border-radius: 90rpx;
  773. }
  774. .btn1 {
  775. background: white;
  776. color: #00C265;
  777. }
  778. }
  779. .topInfo {
  780. height: 210rpx;
  781. background: linear-gradient(270deg, #22C572 0%, #34DE8A 100%);
  782. padding: 30rpx;
  783. .topInfo-item {
  784. height: 150rpx;
  785. background-color: #FFFFFF;
  786. border-radius: 20rpx;
  787. padding: 40rpx;
  788. .logo {
  789. width: 40rpx;
  790. height: 40rpx;
  791. margin-top: 8rpx;
  792. }
  793. .infoText {
  794. font-size: 36rpx;
  795. font-weight: 600;
  796. margin-left: 20rpx;
  797. }
  798. .infoData {
  799. color: #878C9C;
  800. font-size: 26rpx;
  801. margin-top: 10rpx;
  802. }
  803. }
  804. }
  805. .shade {
  806. position: fixed;
  807. top: 0;
  808. left: 0;
  809. height: 100%;
  810. width: 100%;
  811. background: rgba(0, 0, 0, 0.4);
  812. z-index: 3;
  813. .wrap {
  814. position: absolute;
  815. left: 0;
  816. top: 0;
  817. right: 0;
  818. bottom: 0;
  819. margin: auto;
  820. background: #fff;
  821. width: calc(100% - 198rpx);
  822. height: 700rpx;
  823. border-radius: 20rpx;
  824. .alert-top {
  825. padding: 33rpx;
  826. display: flex;
  827. justify-content: center;
  828. align-items: center;
  829. position: relative;
  830. }
  831. .title {
  832. font-size: 32rpx;
  833. font-weight: 600;
  834. color: #333333;
  835. }
  836. .close {
  837. position: absolute;
  838. right: 33rpx;
  839. }
  840. }
  841. }
  842. .cancel,
  843. .confirm {
  844. position: absolute;
  845. display: inline-block;
  846. width: 50%;
  847. text-align: center;
  848. bottom: 0;
  849. padding: 10px;
  850. border-top: 1px solid #eee;
  851. font-size: 34rpx;
  852. }
  853. .cancel {
  854. left: 0;
  855. border-right: 1px solid #eee;
  856. color: #AFB3BF;
  857. }
  858. .confirm {
  859. right: 0;
  860. color: #22C572;
  861. }
  862. .textarea {
  863. margin: 18rpx auto;
  864. width: 100%;
  865. background: #F9F9FA;
  866. border-radius: 10px;
  867. border: 1px solid #EEEEEE;
  868. font-size: 28rpx;
  869. padding: 10px;
  870. }
  871. .textCss {
  872. display: flex;
  873. justify-content: flex-end;
  874. width: 100%;
  875. text-align: right;
  876. color: #333333;
  877. }
  878. .u-textarea-style {
  879. margin: 20rpx;
  880. background: #F9F9FA;
  881. border-radius: 10px;
  882. border: 1px solid #EEEEEE;
  883. padding: 10rpx 20rpx;
  884. position: relative;
  885. height:240px;
  886. /deep/.uni-textarea-textarea{
  887. width: 80%;
  888. }
  889. .right-bottom {
  890. position: absolute;
  891. right: 20rpx;
  892. bottom: 20rpx;
  893. color: #AFB3BF;
  894. }
  895. }
  896. /deep/.u-input__textarea {
  897. height: 300rpx !important;
  898. }
  899. .content2 {
  900. background: white;
  901. margin: 20rpx 0;
  902. border-radius: 20rpx;
  903. padding: 20rpx;
  904. .row {
  905. display: flex;
  906. .row-left {
  907. display: flex;
  908. align-items: center;
  909. .item1 {
  910. position: relative;
  911. .item-content {
  912. background: #617AE0;
  913. width: 44px;
  914. height: 44px;
  915. border-radius: 22px;
  916. line-height: 44px;
  917. text-align: center;
  918. font-size: 15px;
  919. color: #fff;
  920. }
  921. .status {
  922. position: absolute;
  923. border-radius: 50%;
  924. padding: 0px 2px;
  925. right: -3px;
  926. bottom: -3px;
  927. background: #fff;
  928. }
  929. .status.success {
  930. border: 1px solid rgb(60, 156, 255);
  931. }
  932. .status.error {
  933. border: 1px solid rgb(245, 108, 108);
  934. }
  935. .status.question {
  936. border: 1px solid #f9ae3d;
  937. }
  938. }
  939. }
  940. .row-right {
  941. width: 80%;
  942. // color: #B0B1B5;
  943. margin-top: 10px;
  944. .right-content {
  945. background: #F2F3F7;
  946. margin-left: 10px;
  947. margin-top: 10px;
  948. padding: 10px;
  949. border-radius: 5px;
  950. color: #B0B1B5;
  951. }
  952. .right-item {
  953. display: flex;
  954. justify-content: space-between;
  955. .time {
  956. color: #999;
  957. }
  958. .item2 {
  959. margin-left: 20rpx;
  960. margin-top: -7px;
  961. .name {
  962. font-size: 28rpx;
  963. font-weight: 800;
  964. margin-bottom: 4px;
  965. }
  966. .status.success {
  967. color: #6CC48C;
  968. }
  969. .status.error {
  970. color: rgb(245, 108, 108);
  971. }
  972. .status.question {
  973. color: #f9ae3d;
  974. }
  975. }
  976. }
  977. }
  978. }
  979. .row2 {
  980. display: flex;
  981. .item-content {
  982. background: #22C572;
  983. width: 30px;
  984. height: 30px;
  985. border-radius: 50%;
  986. line-height: 30px;
  987. text-align: center;
  988. font-size: 12px;
  989. color: #fff;
  990. padding: 0 2px;
  991. margin: 0 auto;
  992. }
  993. .status {
  994. position: absolute;
  995. top: 0;
  996. right: 0;
  997. }
  998. }
  999. .row-line {
  1000. width: 1px;
  1001. height: 30px;
  1002. background: #F2F2F2;
  1003. margin: 10rpx 50rpx;
  1004. }
  1005. .audit {
  1006. margin-top: 20rpx;
  1007. }
  1008. }
  1009. .form_top {
  1010. border-bottom: 1px solid #C7CAD6;
  1011. padding-bottom: 10px;
  1012. font-size: 30rpx;
  1013. font-weight: 600;
  1014. }
  1015. .form_view{
  1016. margin: 20rpx 0;
  1017. border-radius: 20rpx;
  1018. background: #F9F9FA;
  1019. padding: 30rpx 20rpx;
  1020. }
  1021. .label_css{
  1022. font-size: 26rpx;
  1023. color: #878C9C;
  1024. }
  1025. .input_css{
  1026. font-size: 20rpx;
  1027. }
  1028. /deep/.uni-textarea-wrapper{
  1029. height:200px;
  1030. }
  1031. // .fujian_title{
  1032. // font-size: 34rpx;
  1033. // margin-top: 20px;
  1034. // font-weight: 600;
  1035. // // margin-left: 10px;
  1036. // }
  1037. .headInfo{
  1038. height: 100px;
  1039. background-color: #FFFFFF;
  1040. margin-bottom: 20rpx;
  1041. border-radius: 10px;
  1042. padding: 30rpx 10px;
  1043. display: flex;
  1044. .headInfo_left{
  1045. width: 10%;
  1046. line-height: 60px;
  1047. text-align: center;
  1048. }
  1049. .headInfo_middle{
  1050. width: 70%;
  1051. padding-left: 10px;
  1052. }
  1053. .headInfo_right{
  1054. width: 20%;
  1055. line-height: 60px;
  1056. .char_a{
  1057. color: #22C572;
  1058. }
  1059. .char_b{
  1060. color: #FE6430;
  1061. }
  1062. .char_c{
  1063. color: #FB2323;
  1064. }
  1065. .char_a,.char_b,.char_c{
  1066. font-size: 16px;
  1067. }
  1068. }
  1069. .adopt{
  1070. position: absolute;
  1071. right: 30px;
  1072. top: 60px;
  1073. .adopt_img{
  1074. width: 90px;
  1075. height: 90px;
  1076. }
  1077. }
  1078. .headInfo_title{
  1079. font-size: 19px;
  1080. color: #333333;
  1081. font-weight: 600;
  1082. }
  1083. .headInfo_No{
  1084. color: #878C9C;
  1085. font-size: 13px;
  1086. margin-top: 10px;
  1087. }
  1088. }
  1089. .img_item {
  1090. display: flex;
  1091. width: 100%;
  1092. margin: 10px 0;
  1093. padding: 0 10rpx;
  1094. .imgsign{
  1095. width: 25px;
  1096. height: 25px;
  1097. margin-top: 6px;
  1098. }
  1099. .char_css {
  1100. font-size: 28rpx;
  1101. font-weight: 600;
  1102. display: -webkit-box;
  1103. overflow: hidden;
  1104. /*! autoprefixer: off; */
  1105. -webkit-box-orient: vertical;
  1106. -webkit-line-clamp: 1;
  1107. -webkit-box-orient: vertical;
  1108. text-overflow: ellipsis;
  1109. word-break: break-all;
  1110. }
  1111. .img_size{
  1112. color: #B0B3BF;
  1113. font-size: 12px;
  1114. margin-top: 5px;
  1115. }
  1116. .img_dowload {
  1117. width: 14%;
  1118. color: #22C572;
  1119. text-align: right;
  1120. }
  1121. }
  1122. </style>