index.vue 47 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699
  1. <template>
  2. <view class="content">
  3. <u-sticky>
  4. <view class="head" style="background-color: #3c9cff; color: #fff;">
  5. <!-- <text>订单号: {{formData.orderNo}}</text> -->
  6. <view>
  7. <text>{{ formData.carRegNo == null ? '' : formData.carRegNo }}</text>
  8. </view>
  9. <view>
  10. <text>{{ formData.goodsCName == null ? '' : formData.goodsCName }}</text>
  11. </view>
  12. </view>
  13. <view class="head-no-addr">
  14. <view>
  15. <text>{{formData.loadAddr}}</text>
  16. </view>
  17. <!-- <span class="icon iconfont" style="font-size: 100rpx; color: #fcbd71; height: 80rpx;">&#xe6fb;</span> -->
  18. <view><text>【到】</text></view>
  19. <view>
  20. <text>{{formData.unLoadAddr}}</text>
  21. </view>
  22. </view>
  23. </u-sticky>
  24. <view class="striping"></view>
  25. <!-- <view class="head" @click="telFun">
  26. <text>驾驶员: {{formData.driver1Name == null ? '' : formData.driver1Name}}&nbsp;电话:&nbsp;{{formData.driver1mobile == null ? '' : formData.driver1mobile}}</text>
  27. </view> -->
  28. <u-tabs :list="tabs" @change="change" :activeStyle="{
  29. width: '180rpx',
  30. height: '60rpx',
  31. color: '#fff',
  32. backgroundColor: '#3c9cff',
  33. borderRadius: '80rpx',
  34. lineHeight: '60rpx',
  35. textAlign: 'center'
  36. }" :inactiveStyle="{
  37. width: '180rpx',
  38. height: '60rpx',
  39. color: '#3c9cff',
  40. backgroundColor: '#f0f0f0f0',
  41. borderRadius: '80rpx',
  42. lineHeight: '60rpx',
  43. textAlign: 'center'
  44. }"></u-tabs>
  45. <view v-if="isTabs == '行程费用'">
  46. <view class="box-box">
  47. <view class="box">
  48. <view class="data">
  49. <text class="key">ETC金额</text>
  50. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  51. @input="checkUnLoadetc" v-model="formData.loadetc" />
  52. </view>
  53. <view class="data">
  54. <text class="key">现金过路费</text>
  55. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  56. @input="checkUnLoadtoll" v-model="formData.loadtoll" />
  57. </view>
  58. </view>
  59. <view class="box">
  60. <view class="data">
  61. <text class="key">公司加油(升)</text>
  62. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  63. @input="checkUnOilhomeQty" v-model="formData.oilhomeQty" />
  64. </view>
  65. <view class="data">
  66. <text class="key">加油金额</text>
  67. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  68. @input="checkUnOilhomeAmt" v-model="formData.oilhomeAmt" />
  69. </view>
  70. </view>
  71. <view class="box">
  72. <view class="data-two">
  73. <text class="key">定点加油1</text>
  74. <view class="list">
  75. <uni-data-select :disabled="disabled" :localdata="gasStationList"
  76. v-model="formData.gasstation1" @change="gasstation1Change"></uni-data-select>
  77. </view>
  78. </view>
  79. </view>
  80. <view class="box">
  81. <view class="data">
  82. <text class="key">升&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;数</text>
  83. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  84. @input="checkUnOilappoint1Qty" placeholder-style="font-size:24rpx" placeholder="请输入升数" v-model="formData.oilappoint1Qty" />
  85. </view>
  86. <view class="data">
  87. <text class="key">金&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;额</text>
  88. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  89. @input="checkUnOilappoint1Amt" placeholder-style="font-size:24rpx" placeholder="请输入金额" v-model="formData.oilappoint1Amt" />
  90. </view>
  91. </view>
  92. <view class="box">
  93. <view class="data-two">
  94. <text class="key">定点加油2</text>
  95. <view class="list">
  96. <uni-data-select :disabled="disabled" :localdata="gasStationList"
  97. v-model="formData.gasstation2" @change="gasstation2Change"></uni-data-select>
  98. </view>
  99. </view>
  100. </view>
  101. <view class="box">
  102. <view class="data">
  103. <text class="key">升&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;数</text>
  104. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  105. @input="checkUnOilappoint2Qty" placeholder-style="font-size:24rpx" placeholder="请输入升数" v-model="formData.oilappoint2Qty" />
  106. </view>
  107. <view class="data">
  108. <text class="key">金&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;额</text>
  109. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  110. @input="checkUnOilappoint2Amt" placeholder-style="font-size:24rpx" placeholder="请输入金额" v-model="formData.oilappoint2Amt" />
  111. </view>
  112. </view>
  113. <view class="box">
  114. <view class="data-two">
  115. <text class="key">定点加油3</text>
  116. <view class="list">
  117. <uni-data-select :disabled="disabled" :localdata="gasStationList"
  118. v-model="formData.gasstation3" @change="gasstation3Change"></uni-data-select>
  119. </view>
  120. </view>
  121. </view>
  122. <view class="box">
  123. <view class="data">
  124. <text class="key">升&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;数</text>
  125. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  126. @input="checkUnOilappoint3Qty" placeholder-style="font-size:24rpx" placeholder="请输入升数" v-model="formData.oilappoint3Qty" />
  127. </view>
  128. <view class="data">
  129. <text class="key">金&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;额</text>
  130. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  131. @input="checkUnOilappoint3Amt" placeholder-style="font-size:24rpx" placeholder="请输入金额" v-model="formData.oilappoint3Amt" />
  132. </view>
  133. </view>
  134. <view class="box">
  135. <view class="data">
  136. <text class="key">现金加油(升)</text>
  137. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  138. @input="checkUnOilcash1Qty" v-model="formData.oilcash1Qty" />
  139. </view>
  140. <view class="data">
  141. <text class="key">加油金额</text>
  142. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  143. @input="checkUnOilcash1Amt" v-model="formData.oilcash1Amt" />
  144. </view>
  145. </view>
  146. <view class="box">
  147. <view class="data">
  148. <text class="key">油卡加油(升)</text>
  149. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  150. @input="checkUnOilcardQty" v-model="formData.oilcardQty" />
  151. </view>
  152. <view class="data">
  153. <text class="key">加油金额</text>
  154. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  155. @input="checkUnOilcardAmt" v-model="formData.oilcardAmt" />
  156. </view>
  157. </view>
  158. <view class="box-two">
  159. <text class="key">备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注</text>
  160. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled"
  161. v-model="formData.driverassdesc" />
  162. </view>
  163. <!-- </u-collapse-item> -->
  164. </view>
  165. <view class="box-box" style="margin-top: 40rpx;">
  166. <view style="margin-bottom: 20rpx;">
  167. <text style="color: #3c9cff;">单据拍照存档</text>
  168. </view>
  169. <u-upload :fileList="fileList1" accept="image" :sizeType="['compressed']" capture="camera"
  170. @afterRead="imgUploading" @delete="deletePic" name="1" multiple :disabled="disabled"
  171. :previewFullImage="true"></u-upload>
  172. </view>
  173. </view>
  174. <view v-if="isTabs == '其他费用'">
  175. <view class="table">
  176. <view class="data vertical-layout" v-for="(item, index) in itemsList" :key="index">
  177. <view class="name">
  178. <text style="color: #3c9cff;">{{ item.cname }}</text>
  179. </view>
  180. <view class="sum">
  181. <input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
  182. @input="checkUnAmt(item.amt, index)" @click="inputHeight" cursor-spacing="30"
  183. :always-embed="true" :adjust-position="true" v-model="item.amt" />
  184. </view>
  185. <view class="remarks" style="border-bottom: 2rpx dotted #000;">
  186. <input v-model="item.remarks" placeholder-style="font-size:24rpx" placeholder="请输入备注">
  187. </view>
  188. </view>
  189. </view>
  190. </view>
  191. <view class="cushion">
  192. </view>
  193. <!-- <view class="bottom vertical-layout" style="z-index: 4;" v-if="status376 == 2 || status376 == 0">
  194. <view class="bottom-bottom">
  195. <view class="money">
  196. <text>报销:</text> {{' '}}
  197. <text style="color: #ff9f1c;">¥ {{money}}</text>
  198. </view>
  199. <view class="button">
  200. <view class="button-button">
  201. <u-button iconColor="#3c9cff" shape="circle" type="primary" @click="submitShow = true"
  202. :disabled="disabled" text="提交费用"></u-button>
  203. </view>
  204. </view>
  205. </view>
  206. </view> -->
  207. <view v-if="formData.ifStarted != 'A'">
  208. <!-- 驾驶员 -->
  209. <view v-if="button" class="bottom" style="z-index: 4;">
  210. <view class="row">
  211. <view class="button">
  212. <u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="saveDisabled"
  213. @click="submitShow = true" text="保存数据"></u-button>
  214. </view>
  215. <view class="button">
  216. <u-button iconColor="#fe8c00;" color="#fe8c00" shape="circle" type="primary" :disabled="upDisabled"
  217. @click="upButtonClick('TJ')" text="提交报账单"></u-button>
  218. </view>
  219. </view>
  220. </view>
  221. <!-- 队长 -->
  222. <view v-if="!button" class="bottom" style="z-index: 4;">
  223. <view class="row">
  224. <view class="button">
  225. <u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="sDisabled"
  226. @click="auditTClick" text="通过"></u-button>
  227. </view>
  228. <view class="button">
  229. <u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="sDisabled"
  230. @click="auditFClick" text="驳回"></u-button>
  231. </view>
  232. </view>
  233. </view>
  234. </view>
  235. <!-- 遮盖罩 -->
  236. <u-loading-page :loading="loading" style="z-index: 20000;"></u-loading-page>
  237. <!-- 消息提示 -->
  238. <u-toast ref="uToast"></u-toast>
  239. <u-modal :show="submitShow" title="提示" showCancelButton @confirm="submit" @cancel="submitShow = false">
  240. <view class="slot-content">
  241. <rich-text nodes="确定要保存数据吗?"></rich-text>
  242. </view>
  243. </u-modal>
  244. <u-modal :show="upAuditShow" confirmColor="#fe8c00" title="提示" showCancelButton @confirm="upReview" @cancel="upAuditShow = false">
  245. <view class="slot-content">
  246. <rich-text nodes="点击确认后该业务将锁定,无法添加修改费用报销!确定要提交吗?"></rich-text>
  247. </view>
  248. </u-modal>
  249. <u-modal :show="deleteShow" title="提示" showCancelButton @confirm="deleteImg" @cancel="deleteShow = false">
  250. <view class="slot-content">
  251. <rich-text nodes="确定删除这张图片吗?"></rich-text>
  252. </view>
  253. </u-modal>
  254. <u-modal :show="auditTShow" title="提示" showCancelButton @confirm="check('T')" @cancel="auditTShow = false">
  255. <view class="slot-content" style="display: flex; flex-direction: column; align-items: center;">
  256. <rich-text nodes="确定要审核通过吗?"></rich-text>
  257. <input style="margin-top: 20rpx;"
  258. selection-start="0"
  259. selection-end="9999"
  260. placeholder="请输入通过意见"
  261. placeholder-style="font-size: 28rpx"
  262. v-model="formData.audit2Desc"
  263. />
  264. </view>
  265. </u-modal>
  266. <u-modal :show="auditFShow" title="提示" showCancelButton @confirm="check('F')" @cancel="auditFShow = false">
  267. <view class="slot-content" style="display: flex; flex-direction: column; align-items: center;">
  268. <rich-text nodes="确定要驳回审核吗?"></rich-text>
  269. <input style="margin-top: 20rpx;"
  270. selection-start="0"
  271. selection-end="9999"
  272. placeholder="请输入驳回意见"
  273. placeholder-style="font-size: 28rpx"
  274. v-model="formData.audit2Desc"
  275. />
  276. </view>
  277. </u-modal>
  278. </view>
  279. </template>
  280. <script>
  281. import {
  282. getGasStations,
  283. getItems,
  284. insertLoadFeeItems,
  285. getLoadFeeItems,
  286. isMileage
  287. } from "@/api/reimbursement"
  288. import {
  289. getOrderBillsPlansByid,
  290. putOrderBillsPlansByid,
  291. insertTmsAttachMngs,
  292. pictureUploading,
  293. deleteTmsAttachMngs,
  294. submitAudit,
  295. audit
  296. } from "@/api/particulars"
  297. export default {
  298. data() {
  299. return {
  300. orderNo: '',
  301. // 遮盖罩
  302. loading: true,
  303. formData: {
  304. // itemsVoList: [],
  305. // oilappoint1Qty: 1,
  306. // oilappoint2Qty: 1
  307. },
  308. // 报销费用list
  309. gasStationList: [],
  310. // 其他费用list
  311. itemsList: [],
  312. // 其他费用被选中
  313. selectedIndexs: [],
  314. radioValueOne: '', // 当前 radio 的值
  315. numOne: 0, //用于区分是否是重复选中
  316. radioValueTwo: '', // 当前 radio 的值
  317. numTwo: 0, //用于区分是否是重复选中
  318. // 输入框禁用
  319. disabled: false,
  320. // 保存数据按钮
  321. saveDisabled: false,
  322. // 提交数据按钮
  323. upDisabled: false,
  324. // 审核按钮禁用
  325. sDisabled: true,
  326. // 底部按钮
  327. button: true,
  328. status376: 0,
  329. selectionLength: 0,
  330. fileList1: [],
  331. // 删除弹框
  332. deleteShow: false,
  333. // 提交费用弹窗
  334. submitShow: false,
  335. // 提交审核弹框
  336. upAuditShow: false,
  337. // 审核通过弹框
  338. auditTShow: false,
  339. // 审核驳回弹框
  340. auditFShow: false,
  341. event: {},
  342. vHeight: 0,
  343. tabs: [{
  344. name: '行程费用'
  345. }, {
  346. name: '其他费用'
  347. }],
  348. isTabs: '行程费用',
  349. // 报销金额
  350. money: 0
  351. }
  352. },
  353. onUnload() {
  354. this.formData = {};
  355. this.loading = true;
  356. },
  357. onLoad: function(option) {
  358. this.status376 = option.status;
  359. this.orderNo = option.orderNo;
  360. if (this.status376 == 6) {
  361. this.disabled = true;
  362. }
  363. this.getData();
  364. },
  365. methods: {
  366. change(item) {
  367. this.isTabs = item.name;
  368. },
  369. auditTClick() {
  370. this.formData.audit2Desc = "审核通过"
  371. this.auditTShow = true
  372. },
  373. auditFClick() {
  374. this.formData.audit2Desc = null
  375. this.auditFShow = true
  376. },
  377. getData() {
  378. // 报销费用下拉选
  379. getGasStations().then(res => {
  380. // this.gasStationList = res.data
  381. for (var item in res.data) {
  382. var data = {
  383. text: res.data[item].cname,
  384. value: res.data[item].cname
  385. };
  386. this.gasStationList.push(data);
  387. }
  388. getItems().then(res => {
  389. this.itemsList = res.data
  390. getLoadFeeItems(this.orderNo).then(res => {
  391. res.data.loadetc == 0 ? res.data.loadetc = null : res.data.loadetc
  392. res.data.loadtoll == 0 ? res.data.loadtoll = null : res.data.loadtoll
  393. res.data.oilhomeQty == 0 ? res.data.oilhomeQty = null : res.data.oilhomeQty
  394. res.data.oilhomeAmt == 0 ? res.data.oilhomeAmt = null : res.data.oilhomeAmt
  395. res.data.oilappoint1Qty == 0 ? res.data.oilappoint1Qty = null : res.data.oilappoint1Qty
  396. res.data.oilappoint1Amt == 0 ? res.data.oilappoint1Amt = null : res.data.oilappoint1Amt
  397. res.data.oilappoint2Qty == 0 ? res.data.oilappoint2Qty = null : res.data.oilappoint2Qty
  398. res.data.oilappoint2Amt == 0 ? res.data.oilappoint2Amt = null : res.data.oilappoint2Amt
  399. res.data.oilappoint3Qty == 0 ? res.data.oilappoint3Qty = null : res.data.oilappoint3Qty
  400. res.data.oilappoint3Amt == 0 ? res.data.oilappoint3Amt = null : res.data.oilappoint3Amt
  401. res.data.oilcash1Qty == 0 ? res.data.oilcash1Qty = null : res.data.oilcash1Qty
  402. res.data.oilcash1Amt == 0 ? res.data.oilcash1Amt = null : res.data.oilcash1Amt
  403. res.data.oilcardQty == 0 ? res.data.oilcardQty = null : res.data.oilcardQty
  404. res.data.oilcardAmt == 0 ? res.data.oilcardAmt = null : res.data.oilcardAmt
  405. for (let item of this.itemsList) {
  406. if (item == 0) {
  407. item.amt = null
  408. }
  409. }
  410. // 角色
  411. for (let role of res.data.roleList) {
  412. if (role == 'DZ') {
  413. console.log(123);
  414. this.button = false;
  415. this.disabled = true;
  416. }
  417. if (role == 'JSY') {
  418. this.disabled = false;
  419. }
  420. }
  421. // 审核中
  422. if (
  423. res.data.ifStarted == "S") {
  424. this.disabled = true;
  425. this.saveDisabled = true;
  426. this.upDisabled = true;
  427. this.sDisabled = false;
  428. }
  429. // 审核完成
  430. if (
  431. res.data.ifStarted == "A") {
  432. this.disabled = true;
  433. this.saveDisabled = true;
  434. this.upDisabled = true;
  435. }
  436. // 未提交
  437. // if (res.data.ifLoaded != "T" ||
  438. // res.data.ifUnLoaded != "T") {
  439. // this.disabled = false;
  440. // this.saveDisabled = false;
  441. // this.upDisabled = true;
  442. // }
  443. this.formData = res.data;
  444. var costBreakdownList = res.data.loadFeeItemsList;
  445. this.itemsList = costBreakdownList;
  446. for (const key in this.itemsList) {
  447. if (this.itemsList[key].amt == 0) {
  448. this.itemsList[key].amt = null;
  449. }
  450. }
  451. this.fileList1 = res.data.fileList1;
  452. this.loading = false;
  453. // isMileage(this.orderNo).then(res => {
  454. // if (res.msg == 410) {
  455. // // this.disabled = true;
  456. // // this.upDisabled = true;
  457. // // this.$refs.uToast.show({
  458. // // type: 'warning',
  459. // // icon: false,
  460. // // message: "当前报单有待提交里程!",
  461. // // iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  462. // // })
  463. // }
  464. // })
  465. // this.calculatMoney();
  466. })
  467. })
  468. })
  469. },
  470. // 事件审核按钮
  471. upButtonClick(type) {
  472. if(this.formData.loadQty == null) {
  473. this.$refs.uToast.show({
  474. type: 'warning',
  475. icon: false,
  476. message: "没有装车吨位!",
  477. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  478. })
  479. } else if(this.formData.loadDate == null) {
  480. this.$refs.uToast.show({
  481. type: 'warning',
  482. icon: false,
  483. message: "没有装车时间!",
  484. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  485. })
  486. } else if(this.formData.unLoadQty == null) {
  487. this.$refs.uToast.show({
  488. type: 'warning',
  489. icon: false,
  490. message: "没有卸车吨位!",
  491. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  492. })
  493. } else if(this.formData.unLoadDate == null) {
  494. this.$refs.uToast.show({
  495. type: 'warning',
  496. icon: false,
  497. message: "没有卸车时间!",
  498. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  499. })
  500. } else if (this.formData.ifOrder2ed == 'F') {
  501. this.upAuditShow = false;
  502. this.$refs.uToast.show({
  503. type: 'warning',
  504. icon: false,
  505. message: "装卸信息提交后才能报账!",
  506. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  507. })
  508. } else {
  509. if (type == 'BX') {
  510. this.submitShow = true
  511. } else if (type == 'TJ') {
  512. this.upAuditShow = true
  513. }
  514. }
  515. },
  516. // 保存内容
  517. submit() {
  518. if (this.status376 == 6) {
  519. this.$refs.uToast.show({
  520. type: 'warning',
  521. icon: false,
  522. message: "不允许保存!",
  523. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  524. })
  525. } else if (this.status376 == 2 || this.status376 == 0) {
  526. let isMo = false;
  527. for (const key in this.itemsList) {
  528. if (this.itemsList[key].amt == null) {
  529. this.itemsList[key].amt = 0;
  530. }
  531. }
  532. if (this.formData.loadetc == null) {
  533. this.formData.loadetc = 0;
  534. }
  535. if (this.formData.loadtoll == null) {
  536. this.formData.loadtoll = 0;
  537. }
  538. if (this.formData.oilhomeQty == null) {
  539. this.formData.oilhomeQty = 0;
  540. }
  541. if (this.formData.oilhomeAmt == null) {
  542. this.formData.oilhomeAmt = 0;
  543. }
  544. if (this.formData.oilappoint1Qty == null) {
  545. this.formData.oilappoint1Qty = 0;
  546. }
  547. if (this.formData.oilappoint1Amt == null) {
  548. this.formData.oilappoint1Amt = 0;
  549. }
  550. if (this.formData.oilappoint2Qty == null) {
  551. this.formData.oilappoint2Qty = 0;
  552. }
  553. if (this.formData.oilappoint2Amt == null) {
  554. this.formData.oilappoint2Amt = 0;
  555. }
  556. if (this.formData.oilappoint3Qty == null) {
  557. this.formData.oilappoint3Qty = 0;
  558. }
  559. if (this.formData.oilappoint3Amt == null) {
  560. this.formData.oilappoint3Amt = 0;
  561. }
  562. if (this.formData.oilcash1Qty == null) {
  563. this.formData.oilcash1Qty = 0;
  564. }
  565. if (this.formData.oilcash1Amt == null) {
  566. this.formData.oilcash1Amt = 0;
  567. }
  568. if (this.formData.oilcardQty == null) {
  569. this.formData.oilcardQty = 0;
  570. }
  571. if (this.formData.oilcardAmt == null) {
  572. this.formData.oilcardAmt = 0;
  573. }
  574. if (this.formData.gasstation1 == null) {
  575. this.formData.gasstation1 = 0;
  576. }
  577. if (this.formData.gasstation2 == null) {
  578. this.formData.gasstation2 = 0;
  579. }
  580. if (this.formData.gasstation3 == null) {
  581. this.formData.gasstation3 = 0;
  582. }
  583. this.loading = true;
  584. // var list = [];
  585. // for (var item in this.itemsList) {
  586. // var amt = this.itemsList[item].amt;
  587. // if (amt != null) {
  588. // var items = this.itemsList[item];
  589. // list.push(items);
  590. // }
  591. // }
  592. // for (let item of this.itemsList) {
  593. // if (item == 0) {
  594. // item.amt = null
  595. // }
  596. // }
  597. // this.formData.itemsVoList = list;
  598. this.formData.itemsVoList = this.itemsList;
  599. insertLoadFeeItems(this.formData).then(res => {
  600. this.submitShow = false;
  601. if (res.code == 200) {
  602. // 报销费用下拉选
  603. getGasStations().then(res => {
  604. // this.gasStationList = res.data
  605. for (var item in res.data) {
  606. var data = {
  607. text: res.data[item].cname,
  608. value: res.data[item].cname
  609. };
  610. this.gasStationList.push(data);
  611. }
  612. getItems().then(res => {
  613. this.itemsList = res.data
  614. getLoadFeeItems(this.orderNo).then(res => {
  615. res.data.loadetc == 0 ? res.data.loadetc = null : res.data.loadetc
  616. res.data.loadtoll == 0 ? res.data.loadtoll = null : res.data.loadtoll
  617. res.data.oilhomeQty == 0 ? res.data.oilhomeQty = null : res.data.oilhomeQty
  618. res.data.oilhomeAmt == 0 ? res.data.oilhomeAmt = null : res.data.oilhomeAmt
  619. res.data.oilappoint1Qty == 0 ? res.data.oilappoint1Qty = null : res.data.oilappoint1Qty
  620. res.data.oilappoint1Amt == 0 ? res.data.oilappoint1Amt = null : res.data.oilappoint1Amt
  621. res.data.oilappoint2Qty == 0 ? res.data.oilappoint2Qty = null : res.data.oilappoint2Qty
  622. res.data.oilappoint2Amt == 0 ? res.data.oilappoint2Amt = null : res.data.oilappoint2Amt
  623. res.data.oilappoint3Qty == 0 ? res.data.oilappoint3Qty = null : res.data.oilappoint3Qty
  624. res.data.oilappoint3Amt == 0 ? res.data.oilappoint3Amt = null : res.data.oilappoint3Amt
  625. res.data.oilcash1Qty == 0 ? res.data.oilcash1Qty = null : res.data.oilcash1Qty
  626. res.data.oilcash1Amt == 0 ? res.data.oilcash1Amt = null : res.data.oilcash1Amt
  627. res.data.oilcardQty == 0 ? res.data.oilcardQty = null : res.data.oilcardQty
  628. res.data.oilcardAmt == 0 ? res.data.oilcardAmt = null : res.data.oilcardAmt
  629. for (let item of this.itemsList) {
  630. if (item == 0) {
  631. item.amt = null
  632. }
  633. }
  634. // 角色
  635. for (let role of res.data.roleList) {
  636. if (role == 'DZ') {
  637. this.button = false;
  638. }
  639. }
  640. // 审核中
  641. if (
  642. res.data.ifStarted == "S") {
  643. this.disabled = true;
  644. this.saveDisabled = true;
  645. this.upDisabled = true;
  646. this.sDisabled = false;
  647. }
  648. // 审核完成
  649. if (
  650. res.data.ifStarted == "A") {
  651. this.disabled = true;
  652. this.saveDisabled = true;
  653. this.upDisabled = true;
  654. }
  655. // 未提交
  656. // if (res.data.ifLoaded != "T" ||
  657. // res.data.ifUnLoaded != "T") {
  658. // this.disabled = false;
  659. // this.saveDisabled = false;
  660. // this.upDisabled = true;
  661. // }
  662. this.formData = res.data;
  663. var costBreakdownList = res.data.loadFeeItemsList;
  664. this.itemsList = costBreakdownList;
  665. for (const key in this.itemsList) {
  666. if (this.itemsList[key].amt == 0) {
  667. this.itemsList[key].amt = null;
  668. }
  669. }
  670. this.fileList1 = res.data.fileList1;
  671. this.$refs.uToast.show({
  672. type: 'success',
  673. message: "保存成功!",
  674. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
  675. })
  676. this.loading = false;
  677. })
  678. })
  679. })
  680. // this.getData();
  681. // 保存成功弹窗提示
  682. // this.$refs.uToast.show({
  683. // type: 'success',
  684. // message: "保存成功!",
  685. // iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
  686. // })
  687. } else {
  688. // 保存失败消息
  689. this.$refs.uToast.show({
  690. icon: false,
  691. message: "保存失败请重试!",
  692. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
  693. })
  694. }
  695. })
  696. }
  697. },
  698. // 提交审核
  699. upReview() {
  700. // if (this.status376 == 6) {
  701. // this.upAuditShow = false;
  702. // this.$refs.uToast.show({
  703. // type: 'warning',
  704. // icon: false,
  705. // message: "不允许保存!",
  706. // iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  707. // })
  708. // } else if (this.status376 == 2 || this.status376 == 0) {
  709. if (this.formData.ifOrder2ed != 'O') {
  710. this.upAuditShow = false;
  711. this.$refs.uToast.show({
  712. type: 'warning',
  713. icon: false,
  714. message: "请先提交报账单!",
  715. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  716. })
  717. } else if (this.formData.ifOrder2ed == 'O') {
  718. let isMo = false;
  719. for (const key in this.itemsList) {
  720. if (this.itemsList[key].amt == null) {
  721. this.itemsList[key].amt = 0;
  722. }
  723. }
  724. if (this.formData.loadetc == null) {
  725. this.formData.loadetc = 0;
  726. }
  727. if (this.formData.loadtoll == null) {
  728. this.formData.loadtoll = 0;
  729. }
  730. if (this.formData.oilhomeQty == null) {
  731. this.formData.oilhomeQty = 0;
  732. }
  733. if (this.formData.oilhomeAmt == null) {
  734. this.formData.oilhomeAmt = 0;
  735. }
  736. if (this.formData.oilappoint1Qty == null) {
  737. this.formData.oilappoint1Qty = 0;
  738. }
  739. if (this.formData.oilappoint1Amt == null) {
  740. this.formData.oilappoint1Amt = 0;
  741. }
  742. if (this.formData.oilappoint2Qty == null) {
  743. this.formData.oilappoint2Qty = 0;
  744. }
  745. if (this.formData.oilappoint2Amt == null) {
  746. this.formData.oilappoint2Amt = 0;
  747. }
  748. if (this.formData.oilappoint3Qty == null) {
  749. this.formData.oilappoint3Qty = 0;
  750. }
  751. if (this.formData.oilappoint3Amt == null) {
  752. this.formData.oilappoint3Amt = 0;
  753. }
  754. if (this.formData.oilcash1Qty == null) {
  755. this.formData.oilcash1Qty = 0;
  756. }
  757. if (this.formData.oilcash1Amt == null) {
  758. this.formData.oilcash1Amt = 0;
  759. }
  760. if (this.formData.oilcardQty == null) {
  761. this.formData.oilcardQty = 0;
  762. }
  763. if (this.formData.oilcardAmt == null) {
  764. this.formData.oilcardAmt = 0;
  765. }
  766. if (this.formData.gasstation1 == null) {
  767. this.formData.gasstation1 = 0;
  768. }
  769. if (this.formData.gasstation2 == null) {
  770. this.formData.gasstation2 = 0;
  771. }
  772. if (this.formData.gasstation3 == null) {
  773. this.formData.gasstation3 = 0;
  774. }
  775. this.loading = true;
  776. // var list = [];
  777. // for (var item in this.itemsList) {
  778. // var amt = this.itemsList[item].amt;
  779. // if (amt != null) {
  780. // var items = this.itemsList[item];
  781. // list.push(items);
  782. // }
  783. // }
  784. this.formData.itemsVoList = this.itemsList;
  785. submitAudit(this.formData).then(res => {
  786. this.submitShow = false
  787. this.upAuditShow = false;
  788. if (res.msg == 'ok') {
  789. getGasStations().then(res => {
  790. for (var item in res.data) {
  791. var data = {
  792. text: res.data[item].cname,
  793. value: res.data[item].cname
  794. };
  795. this.gasStationList.push(data);
  796. }
  797. getItems().then(res => {
  798. this.itemsList = res.data
  799. getLoadFeeItems(this.orderNo).then(res => {
  800. res.data.loadetc == 0 ? res.data.loadetc = null : res.data.loadetc
  801. res.data.loadtoll == 0 ? res.data.loadtoll = null : res.data.loadtoll
  802. res.data.oilhomeQty == 0 ? res.data.oilhomeQty = null : res.data.oilhomeQty
  803. res.data.oilhomeAmt == 0 ? res.data.oilhomeAmt = null : res.data.oilhomeAmt
  804. res.data.oilappoint1Qty == 0 ? res.data.oilappoint1Qty = null : res.data.oilappoint1Qty
  805. res.data.oilappoint1Amt == 0 ? res.data.oilappoint1Amt = null : res.data.oilappoint1Amt
  806. res.data.oilappoint2Qty == 0 ? res.data.oilappoint2Qty = null : res.data.oilappoint2Qty
  807. res.data.oilappoint2Amt == 0 ? res.data.oilappoint2Amt = null : res.data.oilappoint2Amt
  808. res.data.oilappoint3Qty == 0 ? res.data.oilappoint3Qty = null : res.data.oilappoint3Qty
  809. res.data.oilappoint3Amt == 0 ? res.data.oilappoint3Amt = null : res.data.oilappoint3Amt
  810. res.data.oilcash1Qty == 0 ? res.data.oilcash1Qty = null : res.data.oilcash1Qty
  811. res.data.oilcash1Amt == 0 ? res.data.oilcash1Amt = null : res.data.oilcash1Amt
  812. res.data.oilcardQty == 0 ? res.data.oilcardQty = null : res.data.oilcardQty
  813. res.data.oilcardAmt == 0 ? res.data.oilcardAmt = null : res.data.oilcardAmt
  814. for (let item of this.itemsList) {
  815. if (item == 0) {
  816. item.amt = null
  817. }
  818. }
  819. // 角色
  820. for (let role of res.data.roleList) {
  821. if (role == 'DZ') {
  822. this.button = false;
  823. }
  824. }
  825. // 审核中
  826. if (
  827. res.data.ifStarted == "S") {
  828. this.disabled = true;
  829. this.saveDisabled = true;
  830. this.upDisabled = true;
  831. this.sDisabled = false;
  832. }
  833. // 审核完成
  834. if (
  835. res.data.ifStarted == "A") {
  836. this.disabled = true;
  837. this.saveDisabled = true;
  838. this.upDisabled = true;
  839. }
  840. // 未提交
  841. // if (res.data.ifLoaded != "T" ||
  842. // res.data.ifUnLoaded != "T") {
  843. // this.disabled = false;
  844. // this.saveDisabled = false;
  845. // this.upDisabled = true;
  846. // }
  847. this.formData = res.data;
  848. var costBreakdownList = res.data.loadFeeItemsList;
  849. this.itemsList = costBreakdownList;
  850. for (const key in this.itemsList) {
  851. if (this.itemsList[key].amt == 0) {
  852. this.itemsList[key].amt = null;
  853. }
  854. }
  855. this.fileList1 = res.data.fileList1;
  856. this.$refs.uToast.show({
  857. type: 'success',
  858. message: "提交审核成功!",
  859. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
  860. })
  861. this.loading = false;
  862. })
  863. })
  864. })
  865. // this.getData();
  866. // // 保存成功弹窗提示
  867. // this.$refs.uToast.show({
  868. // type: 'success',
  869. // message: "提交审核成功!",
  870. // iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
  871. // })
  872. } else {
  873. // 保存失败消息
  874. this.$refs.uToast.show({
  875. icon: false,
  876. message: "提交审核失败请重试!",
  877. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
  878. })
  879. }
  880. })
  881. }
  882. },
  883. // 审核
  884. check(type) {
  885. this.loading = true;
  886. var data = {
  887. orderNo: this.orderNo,
  888. entityId: this.formData.entityId,
  889. audit2Desc: this.formData.audit2Desc,
  890. lineNo: this.formData.lineNo,
  891. auditType: type
  892. }
  893. audit(data).then(res => {
  894. if (res.msg == 'ok') {
  895. this.getData();
  896. this.sDisabled = false;
  897. if (type == 'T') {
  898. this.auditTShow = false;
  899. } else if (type == 'F') {
  900. this.auditFShow = false;
  901. }
  902. // 保存成功弹窗提示
  903. this.$refs.uToast.show({
  904. type: 'success',
  905. message: "审核成功!",
  906. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
  907. })
  908. this.loading = false;
  909. } else {
  910. // 保存失败消息
  911. this.$refs.uToast.show({
  912. icon: false,
  913. message: "审核失败请重试!",
  914. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
  915. })
  916. this.loading = false;
  917. }
  918. })
  919. },
  920. // 删除图片
  921. deletePic(event) {
  922. if (this.disabled) {
  923. this.$refs.uToast.show({
  924. type: 'warning',
  925. icon: false,
  926. message: "不允许修改!",
  927. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
  928. })
  929. } else {
  930. this.event = event;
  931. this.deleteShow = true;
  932. }
  933. },
  934. deleteImg() {
  935. var event = this.event;
  936. var url = event.file.url;
  937. var index = url.lastIndexOf("\/");
  938. var attachId = url.substring(index + 1, url.length);
  939. deleteTmsAttachMngs(attachId).then(res => {
  940. if (res.code == 200) {
  941. this[`fileList${event.name}`].splice(event.index, 1)
  942. // 删除成功消息
  943. this.$refs.uToast.show({
  944. type: 'success',
  945. message: "删除成功!",
  946. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
  947. })
  948. } else {
  949. // 删除失败消息
  950. this.$refs.uToast.show({
  951. icon: false,
  952. message: "删除失败请重试!",
  953. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
  954. })
  955. }
  956. this.event = {};
  957. this.deleteShow = false;
  958. })
  959. },
  960. // 新增图片
  961. imgUploading(event) {
  962. // 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
  963. let lists = [].concat(event.file)
  964. let fileListLen = this[`fileList${event.name}`].length
  965. lists.map((item) => {
  966. this[`fileList${event.name}`].push({
  967. ...item,
  968. status: 'uploading',
  969. message: '上传中'
  970. })
  971. })
  972. for (let i = 0; i < lists.length; i++) {
  973. let date = this.dateToString("yyyyMMdd");
  974. let dateHHmmss = this.dateToString("yyyy-MM-dd HH:mm:ss");
  975. this.formData.date = date;
  976. insertTmsAttachMngs(this.formData).then(res => {
  977. if (res.code == 200) {
  978. let data = {
  979. name: 'avatarfile',
  980. filePath: lists[i].url
  981. }
  982. // 获取经纬度
  983. let longitude = '';
  984. let latitude = '';
  985. // uni.getLocation({
  986. // type: 'wgs84',
  987. // success: function(res) {
  988. // console.log('当前位置的经度:' + res.longitude);
  989. // console.log('当前位置的纬度:' + res.latitude);
  990. // }
  991. // });
  992. let dataForm = {
  993. attachId: res.data,
  994. longitude: longitude,
  995. latitude: latitude,
  996. updateDate: dateHHmmss
  997. }
  998. console.log(dataForm);
  999. // 上传图片
  1000. pictureUploading(data, dataForm).then(res => {
  1001. let item = this[`fileList${event.name}`][fileListLen]
  1002. this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(
  1003. item, {
  1004. status: 'success',
  1005. message: '',
  1006. url: res.data
  1007. }))
  1008. fileListLen++
  1009. })
  1010. }
  1011. })
  1012. }
  1013. },
  1014. dateToString(fmt) {
  1015. var date = new Date();
  1016. var o = {
  1017. "M+": date.getMonth() + 1, //月份
  1018. "d+": date.getDate(), //日
  1019. "H+": date.getHours(), //小时
  1020. "m+": date.getMinutes(), //分
  1021. "s+": date.getSeconds(), //秒
  1022. "q+": Math.floor((date.getMonth() + 3) / 3), //季度
  1023. "S": date.getMilliseconds() //毫秒
  1024. };
  1025. if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
  1026. for (var k in o)
  1027. if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[
  1028. k]) : (("00" + o[k]).substr(("" + o[k]).length)));
  1029. return fmt;
  1030. },
  1031. // 定点加油1清空
  1032. gasstation1Change() {
  1033. this.formData.oilappoint1Qty = 0;
  1034. this.formData.oilappoint1Amt = 0;
  1035. },
  1036. // 定点加油2清空
  1037. gasstation2Change() {
  1038. this.formData.oilappoint2Qty = 0;
  1039. this.formData.oilappoint2Amt = 0;
  1040. },
  1041. // 定点加油3清空
  1042. gasstation3Change() {
  1043. this.formData.oilappoint3Qty = 0;
  1044. this.formData.oilappoint3Amt = 0;
  1045. },
  1046. // 点击拨打电话
  1047. telFun() {
  1048. if (this.formData.driver1mobile != null && this.formData.driver1mobile != '') {
  1049. uni.makePhoneCall({
  1050. phoneNumber: this.formData.driver1mobile, //电话号码
  1051. success: function(e) {
  1052. // console.log(e);
  1053. },
  1054. fail: function(e) {
  1055. // console.log(e);
  1056. }
  1057. })
  1058. }
  1059. },
  1060. // 其他费用表格勾选事件
  1061. selectionChange(e) {
  1062. this.selectedIndexs = e.detail.index;
  1063. },
  1064. // 计算报销金额
  1065. // calculatMoney() {
  1066. // let loadetc = this.formData.loadetc == null ? 0 : this.formData.loadetc;
  1067. // let loadtoll = this.formData.loadtoll == null ? 0 : this.formData.loadtoll;
  1068. // let oilhomeAmt = this.formData.oilhomeAmt == null ? 0 : this.formData.oilhomeAmt;
  1069. // let oilappoint1Amt = this.formData.oilappoint1Amt == null ? 0 : this.formData.oilappoint1Amt;
  1070. // let oilappoint2Amt = this.formData.oilappoint2Amt == null ? 0 : this.formData.oilappoint2Amt;
  1071. // let oilappoint3Amt = this.formData.oilappoint3Amt == null ? 0 : this.formData.oilappoint3Amt;
  1072. // let oilcash1Amt = this.formData.oilcash1Amt == null ? 0 : this.formData.oilcash1Amt;
  1073. // let oilcardAmt = this.formData.oilcardAmt == null ? 0 : this.formData.oilcardAmt;
  1074. // let itemsMoney = 0;
  1075. // for (const key in this.itemsList) {
  1076. // let a = this.itemsList[key].amt == null ? 0 : this.itemsList[key].amt;
  1077. // itemsMoney += Number(a);
  1078. // }
  1079. // loadetc = Number(loadetc)
  1080. // loadtoll = Number(loadtoll)
  1081. // oilhomeAmt = Number(oilhomeAmt)
  1082. // oilappoint1Amt = Number(oilappoint1Amt)
  1083. // oilappoint2Amt = Number(oilappoint2Amt)
  1084. // oilappoint3Amt = Number(oilappoint3Amt)
  1085. // oilcash1Amt = Number(oilcash1Amt)
  1086. // oilcardAmt = Number(oilcardAmt)
  1087. // itemsMoney = Number(itemsMoney)
  1088. // this.money = loadetc + loadtoll + oilhomeAmt + oilappoint1Amt + oilappoint2Amt + oilcash1Amt + oilcardAmt +
  1089. // oilappoint3Amt + itemsMoney;
  1090. // },
  1091. checkUnLoadetc(e) {
  1092. //正则表达试
  1093. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
  1094. //重新赋值给input
  1095. this.$nextTick(() => {
  1096. this.formData.loadetc = e.target.value
  1097. })
  1098. this.calculatMoney();
  1099. },
  1100. checkUnLoadtoll(e) {
  1101. //正则表达试
  1102. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
  1103. //重新赋值给input
  1104. this.$nextTick(() => {
  1105. this.formData.loadtoll = e.target.value
  1106. })
  1107. this.calculatMoney();
  1108. },
  1109. checkUnOilhomeQty(e) {
  1110. //正则表达试
  1111. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
  1112. //重新赋值给input
  1113. this.$nextTick(() => {
  1114. this.formData.oilhomeQty = e.target.value
  1115. })
  1116. this.calculatMoney();
  1117. },
  1118. checkUnOilhomeAmt(e) {
  1119. //正则表达试
  1120. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
  1121. //重新赋值给input
  1122. this.$nextTick(() => {
  1123. this.formData.oilhomeAmt = e.target.value
  1124. })
  1125. this.calculatMoney();
  1126. },
  1127. checkUnOilappoint1Qty(e) {
  1128. //正则表达试
  1129. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
  1130. //重新赋值给input
  1131. this.$nextTick(() => {
  1132. this.formData.oilappoint1Qty = e.target.value
  1133. })
  1134. this.calculatMoney();
  1135. },
  1136. checkUnOilappoint1Amt(e) {
  1137. //正则表达试
  1138. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
  1139. //重新赋值给input
  1140. this.$nextTick(() => {
  1141. this.formData.oilappoint1Amt = e.target.value
  1142. })
  1143. this.calculatMoney();
  1144. },
  1145. checkUnOilappoint2Qty(e) {
  1146. //正则表达试
  1147. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
  1148. //重新赋值给input
  1149. this.$nextTick(() => {
  1150. this.formData.oilappoint2Qty = e.target.value
  1151. })
  1152. this.calculatMoney();
  1153. },
  1154. checkUnOilappoint2Amt(e) {
  1155. //正则表达试
  1156. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
  1157. //重新赋值给input
  1158. this.$nextTick(() => {
  1159. this.formData.oilappoint2Amt = e.target.value
  1160. })
  1161. this.calculatMoney();
  1162. },
  1163. checkUnOilappoint3Qty(e) {
  1164. //正则表达试
  1165. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
  1166. //重新赋值给input
  1167. this.$nextTick(() => {
  1168. this.formData.oilappoint3Qty = e.target.value
  1169. })
  1170. this.calculatMoney();
  1171. },
  1172. checkUnOilappoint3Amt(e) {
  1173. //正则表达试
  1174. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
  1175. //重新赋值给input
  1176. this.$nextTick(() => {
  1177. this.formData.oilappoint3Amt = e.target.value
  1178. })
  1179. this.calculatMoney();
  1180. },
  1181. checkUnOilcash1Qty(e) {
  1182. //正则表达试
  1183. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
  1184. //重新赋值给input
  1185. this.$nextTick(() => {
  1186. this.formData.oilcash1Qty = e.target.value
  1187. })
  1188. this.calculatMoney();
  1189. },
  1190. checkUnOilcash1Amt(e) {
  1191. //正则表达试
  1192. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
  1193. //重新赋值给input
  1194. this.$nextTick(() => {
  1195. this.formData.oilcash1Amt = e.target.value
  1196. })
  1197. this.calculatMoney();
  1198. },
  1199. checkUnOilcardQty(e) {
  1200. //正则表达试
  1201. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
  1202. //重新赋值给input
  1203. this.$nextTick(() => {
  1204. this.formData.oilcardQty = e.target.value
  1205. })
  1206. this.calculatMoney();
  1207. },
  1208. checkUnOilcardAmt(e) {
  1209. //正则表达试
  1210. e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
  1211. //重新赋值给input
  1212. this.$nextTick(() => {
  1213. this.formData.oilcardAmt = e.target.value
  1214. })
  1215. this.calculatMoney();
  1216. },
  1217. checkUnAmt(amt, index) {
  1218. var amt = (amt.match(/^\d*(\.?\d{0,2})/g)[0]) || null
  1219. //重新赋值给input
  1220. this.$nextTick(() => {
  1221. this.itemsList[index].amt = amt
  1222. })
  1223. this.calculatMoney();
  1224. },
  1225. inputHeight() {
  1226. // if (this.vHeight == 0) {
  1227. this.vHeight = 600;
  1228. // } else {
  1229. // this.vHeight = 0;
  1230. // }
  1231. }
  1232. }
  1233. }
  1234. </script>
  1235. <style lang="scss">
  1236. @import url("/font/iconfont.css");
  1237. // 修改布局方向为纵向布局
  1238. .vertical-layout {
  1239. display: flex;
  1240. }
  1241. .h {
  1242. margin-top: 20rpx;
  1243. height: 100rpx;
  1244. padding-left: 40rpx;
  1245. // font-weight: 900;
  1246. border-top: 2rpx solid #f0f0f0f0;
  1247. border-bottom: 2rpx solid #f0f0f0f0;
  1248. line-height: 100rpx;
  1249. font-size: 30rpx;
  1250. color: #3c9cff;
  1251. // background-color: pink;
  1252. }
  1253. // 分割线
  1254. .striping {
  1255. width: 100%;
  1256. height: 4rpx;
  1257. background-color: #f0f0f0f0;
  1258. }
  1259. .box-box {
  1260. padding-left: 30rpx;
  1261. padding-right: 30rpx;
  1262. }
  1263. .content {
  1264. box-sizing: border-box;
  1265. background-color: white;
  1266. .head {
  1267. color: #3c9cff;
  1268. // width: 100%;
  1269. height: 40rpx;
  1270. padding: 0 30rpx;
  1271. vertical-align: middle;
  1272. // display: table-cell;
  1273. display: flex;
  1274. align-items: flex-end;
  1275. justify-content: space-between;
  1276. box-sizing: border-box;
  1277. font-size: 34rpx;
  1278. font-weight: 700;
  1279. // background-color: red;
  1280. }
  1281. .head-no-addr {
  1282. // width: 960rpx;
  1283. height: 100rpx;
  1284. // padding-left: 30rpx;
  1285. padding: 0 30rpx;
  1286. vertical-align: middle;
  1287. color: #fff;
  1288. font-size: 34rpx;
  1289. font-weight: 700;
  1290. display: flex;
  1291. align-items: center;
  1292. justify-content: space-between;
  1293. box-sizing: border-box;
  1294. background-color: #3c9cff;
  1295. }
  1296. .box-list {
  1297. color: #3b3b3b;
  1298. width: 100%;
  1299. border-bottom: 2rpx solid #f0f0f0f0;
  1300. // padding-left: 50rpx;
  1301. // font-size: 30rpx;
  1302. color: #3b3b3b;
  1303. .icon {
  1304. // width: 100rpx;
  1305. margin-top: 50rpx;
  1306. // font-size: 50rpx;
  1307. // color: #4888ff;
  1308. }
  1309. .list {
  1310. margin-top: 30rpx;
  1311. margin-bottom: 20rpx;
  1312. width: 100%;
  1313. height: 100%;
  1314. // background-color: pink;
  1315. height: auto;
  1316. display: flex;
  1317. flex-wrap: wrap;
  1318. // font-size: 30rpx;
  1319. }
  1320. .quantity-aum {
  1321. margin-bottom: 25rpx;
  1322. .aaa {
  1323. width: 50%;
  1324. .key {
  1325. display: inline-block;
  1326. width: 50%;
  1327. margin-left: 20rpx;
  1328. // margin-right: 80rpx;
  1329. border-bottom: 2rpx dotted #000;
  1330. }
  1331. }
  1332. .bbb {
  1333. width: 50%;
  1334. .value {
  1335. width: 50%;
  1336. margin-left: 20rpx;
  1337. // margin-right: 20rpx;
  1338. border-bottom: 2rpx dotted #000;
  1339. }
  1340. }
  1341. }
  1342. }
  1343. .box {
  1344. color: #3b3b3b;
  1345. // overflow: hidden;
  1346. height: 100rpx;
  1347. // border-bottom: 2rpx solid #f0f0f0f0;
  1348. // font-size: 30rpx;
  1349. display: flex;
  1350. align-items: center;
  1351. .data {
  1352. width: 50%;
  1353. display: flex;
  1354. align-items: center;
  1355. .key {
  1356. width: 55%;
  1357. text-align: right;
  1358. color: #3c9cff;
  1359. }
  1360. .value {
  1361. margin-left: 20rpx;
  1362. width: 45%;
  1363. color: #3b3b3b;
  1364. border-bottom: 2rpx dotted #000;
  1365. }
  1366. }
  1367. .data-two {
  1368. width: 100%;
  1369. display: flex;
  1370. align-items: center;
  1371. .key {
  1372. width: 35%;
  1373. text-align: right;
  1374. color: #3c9cff;
  1375. }
  1376. .list {
  1377. margin-top: 30rpx;
  1378. margin-bottom: 20rpx;
  1379. width: 100%;
  1380. height: 100%;
  1381. // background-color: pink;
  1382. height: auto;
  1383. display: flex;
  1384. flex-wrap: wrap;
  1385. // font-size: 30rpx;
  1386. }
  1387. }
  1388. }
  1389. .box-two {
  1390. color: #3b3b3b;
  1391. overflow: hidden;
  1392. height: 100rpx;
  1393. padding-left: 20rpx;
  1394. // margin-right: 20rpx;
  1395. // font-size: 30rpx;
  1396. display: flex;
  1397. align-items: center;
  1398. .key {
  1399. display: inline-block;
  1400. width: 24%;
  1401. color: #3c9cff;
  1402. }
  1403. .value {
  1404. margin-left: 20rpx;
  1405. width: calc(100% - 24%);
  1406. color: #3b3b3b;
  1407. // margin-right: 20rpx;
  1408. border-bottom: 2rpx dotted #000;
  1409. }
  1410. }
  1411. .table {
  1412. // margin-top: 40rpx;
  1413. margin-left: 20rpx;
  1414. margin-right: 20rpx;
  1415. .data {
  1416. // font-size: 30rpx;
  1417. width: 100%;
  1418. height: 100rpx;
  1419. border-bottom: 2rpx solid #f0f0f0f0;
  1420. align-items: center;
  1421. .name {
  1422. text-align: right;
  1423. width: 25%;
  1424. margin-left: 20rpx;
  1425. color: #000;
  1426. }
  1427. .sum {
  1428. width: 20%;
  1429. margin-left: 20rpx;
  1430. margin-right: 40rpx;
  1431. border-bottom: 2rpx dotted #000;
  1432. }
  1433. .remarks {
  1434. width: 30%;
  1435. }
  1436. }
  1437. }
  1438. .primary {
  1439. background-color: #0b68ffff;
  1440. }
  1441. .attention {
  1442. padding: 30rpx;
  1443. padding-left: 50rpx;
  1444. padding-bottom: 40rpx;
  1445. }
  1446. // 底部提交按钮
  1447. // .bottom {
  1448. // height: 130rpx;
  1449. // display: block;
  1450. // position: fixed;
  1451. // bottom: calc(var(--window-bottom));
  1452. // width: 100%;
  1453. // // background-color: #f0f0f0f0;
  1454. // // background-color: pink;
  1455. // background-color: white;
  1456. // .bottom-bottom {
  1457. // width: 100%;
  1458. // height: 100%;
  1459. // position: relative;
  1460. // display: flex;
  1461. // // .submit {
  1462. // // width: 95%;
  1463. // // background-color: #0b68ffff;
  1464. // // }
  1465. // .money {
  1466. // font-size: 28rpx;
  1467. // height: 130rpx;
  1468. // margin-right: 80rpx;
  1469. // line-height: 130rpx;
  1470. // margin-left: 10%;
  1471. // }
  1472. // .button {
  1473. // width: 300rpx;
  1474. // position: absolute;
  1475. // right: 0;
  1476. // margin-right: 10%;
  1477. // .button-button {
  1478. // padding: 10% 0;
  1479. // background-clip: content-box;
  1480. // }
  1481. // }
  1482. // }
  1483. // }
  1484. .bottom {
  1485. position: fixed;
  1486. bottom: calc(var(--window-bottom));
  1487. width: 100%;
  1488. height: 130rpx;
  1489. background-color: white;
  1490. .row {
  1491. display: flex;
  1492. justify-content: space-evenly;
  1493. height: 130rpx;
  1494. align-items: center;
  1495. .button {
  1496. width: 300rpx;
  1497. // width: 660rpx;
  1498. }
  1499. }
  1500. }
  1501. .input {
  1502. width: 100%;
  1503. // height: 100rpx;
  1504. // background-color: red;
  1505. }
  1506. .cushion {
  1507. width: 100%;
  1508. height: 200rpx;
  1509. background-color: #f0f0f0f0;
  1510. }
  1511. }
  1512. </style>