index.vue 30 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129
  1. <template>
  2. <div class="app-container">
  3. <el-form
  4. :model="queryParams"
  5. ref="queryForm"
  6. v-show="showSearch"
  7. label-width="100px"
  8. size="mini"
  9. >
  10. <el-row>
  11. <el-col :span="6">
  12. <el-form-item label-width="100px" label="提单号" prop="mblno">
  13. <el-input
  14. v-model="queryParams.mblno"
  15. placeholder="请输入提单号"
  16. clearable
  17. size="small"
  18. @keyup.enter.native="handleQuery()"
  19. style="max-width: 187px"
  20. />
  21. </el-form-item>
  22. </el-col>
  23. <el-col :span="6">
  24. <el-form-item label="客户名称" prop="corpId">
  25. <el-select
  26. v-model="queryParams.corpId"
  27. placeholder="请输入客户名称"
  28. clearable
  29. size="small"
  30. filterable
  31. >
  32. <el-option
  33. v-for="(dict, index) in fMblnoOptions"
  34. :key="index.fId"
  35. :label="dict.fName"
  36. :value="dict.fId"
  37. />
  38. </el-select> </el-form-item
  39. ></el-col>
  40. <el-col :span="6">
  41. <el-form-item label-width="100px" label="业务类型" prop="billType">
  42. <el-select
  43. v-model="queryParams.billType"
  44. placeholder="请选择业务类型"
  45. clearable
  46. size="small"
  47. >
  48. <el-option
  49. v-for="(dict, index) in billTypeList"
  50. :key="index.dictValue"
  51. :label="dict.dictLabel"
  52. :value="dict.dictValue"
  53. />
  54. </el-select>
  55. </el-form-item>
  56. </el-col>
  57. <el-col :span="6">
  58. <el-form-item label-width="100px" label="运输方式" prop="transType">
  59. <el-select
  60. v-model="queryParams.transType"
  61. placeholder="请选择运输方式"
  62. clearable
  63. size="small"
  64. >
  65. <el-option
  66. v-for="(dict, index) in transTypeList"
  67. :key="index.dictValue"
  68. :label="dict.dictLabel"
  69. :value="dict.dictValue"
  70. />
  71. </el-select>
  72. </el-form-item>
  73. </el-col>
  74. </el-row>
  75. <el-collapse-transition>
  76. <div v-show="show">
  77. <el-row>
  78. <el-col :span="6">
  79. <el-form-item
  80. label-width="100px"
  81. label="运输性质"
  82. prop="transProp"
  83. >
  84. <el-select
  85. v-model="queryParams.transProp"
  86. placeholder="请选择运输性质"
  87. clearable
  88. size="small"
  89. >
  90. <el-option
  91. v-for="(dict, index) in transPropList"
  92. :key="index.dictValue"
  93. :label="dict.dictLabel"
  94. :value="dict.dictValue"
  95. />
  96. </el-select>
  97. </el-form-item>
  98. </el-col>
  99. <el-col :span="6">
  100. <el-form-item label-width="100px" label="货品名称" prop="goodsId">
  101. <el-select
  102. v-model="queryParams.goodsId"
  103. placeholder="请输入货品名称"
  104. clearable
  105. size="small"
  106. filterable
  107. >
  108. <el-option
  109. v-for="(dict, index) in goodsOptions"
  110. :key="index.fId"
  111. :label="dict.fName"
  112. :value="dict.fId"
  113. />
  114. </el-select>
  115. </el-form-item>
  116. </el-col>
  117. <el-col :span="6">
  118. <el-form-item
  119. label-width="100px"
  120. label="提箱地点"
  121. prop="loadAddr"
  122. >
  123. <el-input
  124. v-model="queryParams.loadAddr"
  125. placeholder="请输入提箱地点"
  126. clearable
  127. size="small"
  128. @keyup.enter.native="handleQuery()"
  129. style="max-width: 187px"
  130. />
  131. </el-form-item>
  132. </el-col>
  133. <el-col :span="6">
  134. <el-form-item
  135. label-width="100px"
  136. label="装卸货地点"
  137. prop="mdLoadAddr"
  138. >
  139. <el-input
  140. v-model="queryParams.mdLoadAddr"
  141. placeholder="请输入装卸货地点"
  142. clearable
  143. size="small"
  144. @keyup.enter.native="handleQuery()"
  145. style="max-width: 187px"
  146. /> </el-form-item
  147. ></el-col>
  148. </el-row>
  149. <el-row>
  150. <el-col :span="6"
  151. ><el-form-item
  152. label-width="100px"
  153. label="卸箱地点"
  154. prop="unLoadAddr"
  155. >
  156. <el-input
  157. v-model="queryParams.unLoadAddr"
  158. placeholder="请输入卸箱地点"
  159. clearable
  160. size="small"
  161. @keyup.enter.native="handleQuery()"
  162. style="max-width: 187px"
  163. /> </el-form-item
  164. ></el-col>
  165. <el-col :span="6">
  166. <el-form-item
  167. label-width="100px"
  168. label="提箱时间"
  169. prop="cLoadDate"
  170. >
  171. <el-date-picker
  172. v-model="queryParams.cLoadDate"
  173. type="daterange"
  174. align="right"
  175. unlink-panels
  176. range-separator="至"
  177. start-placeholder="开始日期"
  178. end-placeholder="结束日期"
  179. :picker-options="pickerOptions"
  180. value-format="yyyy-MM-dd HH:mm-ss"
  181. :default-time="['00:00:00', '23:59:59']"
  182. >
  183. </el-date-picker>
  184. </el-form-item>
  185. </el-col>
  186. </el-row>
  187. </div>
  188. </el-collapse-transition>
  189. </el-form>
  190. <el-row :gutter="10" class="mb8">
  191. <el-col :span="1.5">
  192. <!-- <el-button size="mini" @click="handleQuery(null)">全 部</el-button>-->
  193. <el-badge
  194. :value="buttonValue.quantity"
  195. type="warning"
  196. style="margin-right: 10px"
  197. >
  198. <el-button size="mini" @click="handleQuery()">全 部</el-button>
  199. </el-badge>
  200. </el-col>
  201. <el-col :span="1.5">
  202. <el-badge
  203. :value="buttonValue.planDate"
  204. type="warning"
  205. style="margin-right: 10px"
  206. >
  207. <el-button size="mini" @click="handleQuery('planDate')"
  208. >未接单</el-button
  209. >
  210. </el-badge></el-col
  211. >
  212. <el-col :span="1.5">
  213. <el-badge
  214. :value="buttonValue.acceptDate"
  215. type="warning"
  216. style="margin-right: 10px"
  217. >
  218. <el-button size="mini" @click="handleQuery('acceptDate')"
  219. >未提箱</el-button
  220. >
  221. </el-badge></el-col
  222. >
  223. <el-col :span="1.5"
  224. ><el-badge
  225. :value="buttonValue.loadDate"
  226. type="warning"
  227. style="margin-right: 10px"
  228. ><el-button size="mini" @click="handleQuery('loadDate')"
  229. >未装卸货</el-button
  230. ></el-badge
  231. ></el-col
  232. >
  233. <el-col :span="1.5"
  234. ><el-badge
  235. :value="buttonValue.mdLoadDate"
  236. type="warning"
  237. style="margin-right: 10px"
  238. >
  239. <el-button size="mini" @click="handleQuery('mdLoadDate')"
  240. >未还卸柜</el-button
  241. ></el-badge
  242. >
  243. </el-col>
  244. <el-col :span="1.5"
  245. ><el-badge
  246. :value="buttonValue.unLoadDate"
  247. type="warning"
  248. style="margin-right: 10px"
  249. ><el-button size="mini" @click="handleQuery('unLoadDate')"
  250. >未回单</el-button
  251. ></el-badge
  252. ></el-col
  253. >
  254. <el-col :span="1.5"
  255. ><el-badge
  256. type="warning"
  257. style="margin-right: 10px"
  258. ><el-button size="mini" @click="handleQuery('receiptDate')"
  259. >已完成</el-button
  260. ></el-badge
  261. ></el-col
  262. >
  263. <div class="tabSetting">
  264. <div style="margin-right: 20px">
  265. <el-button
  266. type="cyan"
  267. icon="el-icon-search"
  268. size="mini"
  269. @click="handleQuery()"
  270. >搜索</el-button
  271. >
  272. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
  273. >重置</el-button
  274. >
  275. <el-button
  276. v-show="show"
  277. @click="show = !show"
  278. icon="el-icon-arrow-up"
  279. size="mini"
  280. >展开</el-button
  281. >
  282. <el-button
  283. v-show="!show"
  284. @click="show = !show"
  285. icon="el-icon-arrow-down"
  286. size="mini"
  287. >展开</el-button
  288. >
  289. </div>
  290. <right-toolbar
  291. :showSearch.sync="showSearch"
  292. @queryTable="getList"
  293. ></right-toolbar>
  294. <div style="margin: 0 12px">
  295. <el-button
  296. icon="el-icon-setting"
  297. size="mini"
  298. circle
  299. @click="showSetting = !showSetting"
  300. ></el-button>
  301. </div>
  302. </div>
  303. </el-row>
  304. <el-dialog title="自定义列显示" :visible.sync="showSetting" width="700px">
  305. <div>配置排序列数据(拖动调整顺序)</div>
  306. <div style="margin-left: 17px">
  307. <el-checkbox
  308. v-model="allCheck"
  309. label="全选"
  310. @change="allChecked"
  311. ></el-checkbox>
  312. </div>
  313. <div style="padding: 4px; display: flex; justify-content: center">
  314. <draggable
  315. v-model="setRowList"
  316. group="site"
  317. animation="300"
  318. @start="onStart"
  319. @end="onEnd"
  320. handle=".indraggable"
  321. >
  322. <transition-group>
  323. <div
  324. v-for="item in setRowList"
  325. :key="item.surface"
  326. class="listStyle"
  327. >
  328. <div style="width: 500px" class="indraggable">
  329. <div class="progress" :style="{ width: item.width + 'px' }">
  330. <el-checkbox
  331. :label="item.name"
  332. v-model="item.checked"
  333. :true-label="0"
  334. :false-label="1"
  335. >{{ item.name }}
  336. </el-checkbox>
  337. </div>
  338. </div>
  339. <el-input-number
  340. v-model.number="item.width"
  341. controls-position="right"
  342. :min="1"
  343. :max="500"
  344. size="mini"
  345. ></el-input-number>
  346. </div>
  347. </transition-group>
  348. </draggable>
  349. </div>
  350. <span slot="footer" class="dialog-footer">
  351. <el-button @click="showSetting = false">取 消</el-button>
  352. <el-button @click="delRow" type="danger">重 置</el-button>
  353. <el-button type="primary" @click="save()">确 定</el-button>
  354. </span>
  355. </el-dialog>
  356. <el-table
  357. v-loading="loading"
  358. :data="ftmsorderbillscarsList"
  359. @selection-change="handleSelectionChange"
  360. >
  361. <el-table-column type="selection" width="55" align="center" />
  362. <el-table-column
  363. label="提单号"
  364. width="180"
  365. align="center"
  366. :show-overflow-tooltip="true"
  367. sortable
  368. fixed="left"
  369. >
  370. <template slot-scope="scope">
  371. <el-link :underline="false" type="primary"
  372. ><div @click="handleUpdate(scope.row)">
  373. {{ scope.row.mblno }}
  374. </div></el-link
  375. >
  376. </template>
  377. </el-table-column>
  378. <el-table-column
  379. v-for="(item, index) in getRowList"
  380. :key="index"
  381. :label="item.name"
  382. :width="item.width"
  383. :prop="item.label"
  384. align="center"
  385. :show-overflow-tooltip="true"
  386. sortable
  387. :fixed="item.fixed"
  388. />
  389. <el-table-column
  390. label="操作"
  391. align="center"
  392. class-name="small-padding fixed-width"
  393. fixed="right"
  394. width="150px"
  395. >
  396. <template slot-scope="scope">
  397. <el-button
  398. size="mini"
  399. type="text"
  400. icon="el-icon-edit"
  401. @click="handleUpdate(scope.row)"
  402. >查看</el-button
  403. >
  404. </template>
  405. </el-table-column>
  406. </el-table>
  407. <pagination
  408. v-show="total > 0"
  409. :total="total"
  410. :page.sync="queryParams.pageNum"
  411. :limit.sync="queryParams.pageSize"
  412. @pagination="getList"
  413. />
  414. <!-- 新增编辑弹框子组件 -->
  415. <add-or-update
  416. :addOrUpdateVisible="addOrUpdateVisible"
  417. :title="title"
  418. :form="form"
  419. :DList="DList"
  420. :CList="CList"
  421. :relevantAttachments="relevantAttachments"
  422. :disabled="disabled"
  423. :feesList="feesList"
  424. :allfMblnoOptions="allfMblnoOptions"
  425. @changeShow="showAddOrUpdate"
  426. @fixDisabled="fixDisabled"
  427. ref="addOrUpdateRef"
  428. ></add-or-update>
  429. </div>
  430. </template>
  431. <script>
  432. import AddOrUpdate from "./AddOrUpdate.vue";
  433. import {
  434. delFtmsorderbills,
  435. exportFtmsorderbills,
  436. } from "@/api/fleet/ftmsorderbills";
  437. import {
  438. listFtmsorderbillscars,
  439. exportFtmsorderbillscars,
  440. selectDriverFtmsorderbillscars,
  441. } from "@/api/fleet/ftmsorderbillscars";
  442. import { listGoods } from "@/api/basicdata/goods";
  443. import { listCorps ,selectCorpList} from "@/api/basicdata/corps";
  444. import { addSet, select, resetModule } from "@/api/system/set";
  445. import Cookies from "js-cookie";
  446. import draggable from "vuedraggable";
  447. export default {
  448. name: "plans",
  449. data() {
  450. return {
  451. //时间区间
  452. pickerOptions: {
  453. shortcuts: [
  454. {
  455. text: "最近一周",
  456. onClick(picker) {
  457. const end = new Date();
  458. const start = new Date();
  459. start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
  460. picker.$emit("pick", [start, end]);
  461. },
  462. },
  463. {
  464. text: "最近一个月",
  465. onClick(picker) {
  466. const end = new Date();
  467. const start = new Date();
  468. start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
  469. picker.$emit("pick", [start, end]);
  470. },
  471. },
  472. {
  473. text: "最近三个月",
  474. onClick(picker) {
  475. const end = new Date();
  476. const start = new Date();
  477. start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
  478. picker.$emit("pick", [start, end]);
  479. },
  480. },
  481. ],
  482. },
  483. feesList:[],
  484. // 控制新增编辑弹窗的显示与隐藏
  485. addOrUpdateVisible: false,
  486. // 非单个禁用
  487. single: true,
  488. // 非多个禁用
  489. multiple: true,
  490. // 显示搜索条件
  491. showSearch: true,
  492. // 订单主表格数据
  493. ftmsorderbillscarsList: [],
  494. relevantAttachments: [],
  495. // 总条数
  496. total: 0,
  497. // 查询参数
  498. queryParams: {
  499. pageNum: 1,
  500. pageSize: 10,
  501. corpId: null,
  502. carStatus: null,
  503. billType: null,
  504. transType: null,
  505. transProp: null,
  506. goodsId: null,
  507. mblno: null,
  508. loadAddr: null,
  509. mdLoadAddr: null,
  510. unLoadAddr: null,
  511. cLoadDate: null,
  512. },
  513. showSetting: false,
  514. drag: false,
  515. setRowList: [],
  516. getRowList: [],
  517. tableDate: [
  518. {
  519. surface: "1",
  520. label: "mdLoadDate",
  521. name: "装卸日期",
  522. checked: 0,
  523. width: 100,
  524. },
  525. {
  526. surface: "2",
  527. label: "billType",
  528. name: "贸易方式",
  529. checked: 0,
  530. width: 100,
  531. },
  532. {
  533. surface: "3",
  534. label: "transType",
  535. name: "运输方式",
  536. checked: 0,
  537. width: 100,
  538. },
  539. {
  540. surface: "4",
  541. label: "corpId",
  542. name: "托运人",
  543. checked: 0,
  544. width: 100,
  545. },
  546. {
  547. surface: "5",
  548. label: "ysl",
  549. name: "船名",
  550. checked: 0,
  551. width: 100,
  552. },
  553. {
  554. surface: "6",
  555. label: "voy",
  556. name: "航次",
  557. checked: 0,
  558. width: 100,
  559. },
  560. {
  561. surface: "8",
  562. label: "cntrQty",
  563. name: "柜量",
  564. checked: 0,
  565. width: 100,
  566. },
  567. {
  568. surface: "9",
  569. label: "cntrId",
  570. name: "柜型",
  571. checked: 0,
  572. width: 100,
  573. },
  574. {
  575. surface: "10",
  576. label: "goodsId",
  577. name: "品名",
  578. checked: 0,
  579. width: 100,
  580. },
  581. {
  582. surface: "11",
  583. label: "cntrWeight",
  584. name: "重量",
  585. checked: 0,
  586. width: 100,
  587. },
  588. {
  589. surface: "12",
  590. label: "polId",
  591. name: "起运港",
  592. checked: 0,
  593. width: 100,
  594. },
  595. {
  596. surface: "13",
  597. label: "podId",
  598. name: "目的港",
  599. checked: 0,
  600. width: 100,
  601. },
  602. {
  603. surface: "14",
  604. label: "loadAddr",
  605. name: "提箱场站",
  606. checked: 0,
  607. width: 100,
  608. },
  609. {
  610. surface: "15",
  611. label: "mdLoadAddr",
  612. name: "装货地",
  613. checked: 0,
  614. width: 100,
  615. },
  616. {
  617. surface: "16",
  618. label: "unLoadAddr",
  619. name: "卸货地",
  620. checked: 0,
  621. width: 100,
  622. },
  623. {
  624. surface: "17",
  625. label: "carregNo",
  626. name: "车号",
  627. checked: 0,
  628. width: 100,
  629. },
  630. {
  631. surface: "18",
  632. label: "driverName",
  633. name: "司机",
  634. checked: 0,
  635. width: 100,
  636. },
  637. {
  638. surface: "19",
  639. label: "orderNo",
  640. name: "运单号",
  641. checked: 0,
  642. width: 100,
  643. },
  644. {
  645. surface: "20",
  646. label: "driverTel",
  647. name: "司机电话",
  648. checked: 0,
  649. width: 100,
  650. },
  651. {
  652. surface: "21",
  653. label: "orderName",
  654. name: "状态",
  655. checked: 0,
  656. width: 100,
  657. },
  658. {
  659. surface: "22",
  660. label: "acceptDate",
  661. name: "接单日期",
  662. checked: 0,
  663. width: 100,
  664. },
  665. {
  666. surface: "23",
  667. label: "loadDate",
  668. name: "提箱日期",
  669. checked: 0,
  670. width: 100,
  671. },
  672. {
  673. surface: "24",
  674. label: "unLoadDate",
  675. name: "还柜日期",
  676. checked: 0,
  677. width: 100,
  678. },
  679. {
  680. surface: "25",
  681. label: "oilAmt",
  682. name: "油气费",
  683. checked: 0,
  684. width: 100,
  685. },
  686. {
  687. surface: "26",
  688. label: "driverbonus",
  689. name: "单趟提成",
  690. checked: 0,
  691. width: 100,
  692. },
  693. {
  694. surface: "27",
  695. label: "costOth",
  696. name: "其他费用",
  697. checked: 0,
  698. width: 100,
  699. },
  700. {
  701. surface: "28",
  702. label: "costRemarks",
  703. name: "备注",
  704. checked: 0,
  705. width: 100,
  706. },
  707. {
  708. surface: "29",
  709. label: "costomAmt05",
  710. name: "港杂费",
  711. checked: 0,
  712. width: 100,
  713. },
  714. {
  715. surface: "30",
  716. label: "costomAmt06",
  717. name: "提箱费",
  718. checked: 0,
  719. width: 100,
  720. },
  721. {
  722. surface: "31",
  723. label: "costomAmt03",
  724. name: "修洗费",
  725. checked: 0,
  726. width: 100,
  727. },
  728. {
  729. surface: "32",
  730. label: "costomAmt04",
  731. name: "吊装费",
  732. checked: 0,
  733. width: 100,
  734. },
  735. {
  736. surface: "33",
  737. label: "costomAmt01",
  738. name: "出口其他费用",
  739. checked: 0,
  740. width: 100,
  741. },
  742. {
  743. surface: "34",
  744. label: "costomStr01",
  745. name: "出口费用备注",
  746. checked: 0,
  747. width: 100,
  748. },
  749. {
  750. surface: "35",
  751. label: "costomAmt02",
  752. name: "进口其他费用",
  753. checked: 0,
  754. width: 100,
  755. },
  756. {
  757. surface: "36",
  758. label: "costomStr02",
  759. name: "进口费用备注",
  760. checked: 0,
  761. width: 100,
  762. },
  763. ],
  764. allCheck: false,
  765. title: "",
  766. form: {},
  767. DList: [],
  768. CList: [],
  769. disabled: false,
  770. goodsOptions: [],
  771. fMblnoOptions: [],
  772. transPropList: [],
  773. transTypeList: [],
  774. billTypeList: [],
  775. show: false,
  776. buttonValue: {},
  777. allfMblnoOptions:[]
  778. };
  779. },
  780. // 使用子组件
  781. components: {
  782. AddOrUpdate,
  783. draggable,
  784. },
  785. created() {
  786. this.setRowList = this.tableDate;
  787. this.getRowList = this.tableDate;
  788. this.getList();
  789. this.getDicts("data_billType").then((response) => {
  790. this.billTypeList = response.data;
  791. });
  792. this.getDicts("data_transType").then((response) => {
  793. this.transTypeList = response.data;
  794. });
  795. this.getDicts("data_transProp").then((response) => {
  796. this.transPropList = response.data;
  797. });
  798. listGoods().then((response) => {
  799. this.goodsOptions = response.rows;
  800. });
  801. listCorps().then((response) => {
  802. this.fMblnoOptions = response.rows;
  803. });
  804. this.getRow();
  805. if (this.$route.query.id) {
  806. this.reset();
  807. const data = { id: this.$route.query.id, billStatus: 1060 };
  808. selectDriverFtmsorderbillscars(data).then((response) => {
  809. if (response.data.cars.billType) {
  810. response.data.cars.billType = response.data.cars.billType.toString();
  811. }
  812. this.title = "查看详情页";
  813. this.form = response.data.cars;
  814. this.relevantAttachments = response.data.attachs;
  815. this.addOrUpdateVisible = !this.addOrUpdateVisible;
  816. this.feesList=[]
  817. });
  818. }
  819. },
  820. methods: {
  821. //列设置全选
  822. allChecked() {
  823. if (this.allCheck == true) {
  824. this.setRowList.map((e) => {
  825. return (e.checked = 0);
  826. });
  827. } else {
  828. this.setRowList.map((e) => {
  829. return (e.checked = 1);
  830. });
  831. }
  832. },
  833. //查询列数据
  834. getRow() {
  835. let that = this;
  836. this.data = {
  837. tableName: "状态跟踪",
  838. userId: Cookies.get("userName"),
  839. };
  840. select(this.data).then((res) => {
  841. if (res.data.length != 0) {
  842. this.getRowList = res.data.filter((e) => e.checked == 0);
  843. this.setRowList = res.data;
  844. this.setRowList = this.setRowList.reduce((res, item) => {
  845. res.push({
  846. surface: item.surface,
  847. label: item.label,
  848. name: item.name,
  849. checked: item.checked,
  850. width: item.width,
  851. fixed: item.fixed,
  852. });
  853. return res;
  854. }, []);
  855. }
  856. });
  857. },
  858. delRow() {
  859. this.data = {
  860. tableName: "状态跟踪",
  861. userId: Cookies.get("userName"),
  862. };
  863. resetModule(this.data).then((res) => {
  864. if (res.code == 200) {
  865. this.showSetting = false;
  866. this.setRowList = this.tableDate;
  867. this.getRowList = this.tableDate;
  868. }
  869. });
  870. },
  871. //保存列设置
  872. save() {
  873. this.showSetting = false;
  874. this.data = {
  875. tableName: "状态跟踪",
  876. userId: Cookies.get("userName"),
  877. sysTableSetList: this.setRowList,
  878. };
  879. addSet(this.data).then((res) => {
  880. if (res.code == 200) {
  881. this.showSetting = false;
  882. this.getRowList = this.setRowList.filter((e) => e.checked == 0);
  883. }
  884. });
  885. },
  886. //开始拖拽事件
  887. onStart() {
  888. this.drag = true;
  889. },
  890. //拖拽结束事件
  891. onEnd() {
  892. this.drag = false;
  893. },
  894. /** 查询订单主列表 */
  895. getList() {
  896. this.loading = true;
  897. listFtmsorderbillscars(this.queryParams).then((response) => {
  898. response.dataTable.rows.map((e) => {
  899. if (e.orderStatus == 10) {
  900. e.orderStatus = "车队安排";
  901. }
  902. if (e.orderStatus == 20) {
  903. e.orderStatus = "司机受理";
  904. }
  905. if (e.orderStatus == 30) {
  906. e.orderStatus = "司机出车";
  907. }
  908. if (e.orderStatus == 40) {
  909. e.orderStatus = "提箱";
  910. }
  911. if (e.orderStatus == 50) {
  912. e.orderStatus = "装卸货";
  913. }
  914. if (e.orderStatus == 60) {
  915. e.orderStatus = "还卸柜";
  916. }
  917. if (e.orderStatus == 70) {
  918. e.orderStatus = "费用确认";
  919. }
  920. if (e.orderStatus == 80) {
  921. e.orderStatus = "回单";
  922. }
  923. if (e.loadDate) {
  924. this.$set(e, "loadDate", e.loadDate.substring(0, 10));
  925. }
  926. if (e.acceptDate) {
  927. this.$set(e, "acceptDate", e.acceptDate.substring(0, 10));
  928. }
  929. if (e.mdLoadDate) {
  930. this.$set(e, "mdLoadDate", e.mdLoadDate.substring(0, 10));
  931. }
  932. if (e.unLoadDate) {
  933. this.$set(e, "unLoadDate", e.unLoadDate.substring(0, 10));
  934. }
  935. if (e.waybillDate) {
  936. e.waybillDate = e.waybillDate.substring(0, 10);
  937. }
  938. });
  939. this.ftmsorderbillscarsList = response.dataTable.rows;
  940. this.buttonValue = response.buttonValue;
  941. this.total = response.dataTable.total;
  942. this.loading = false;
  943. });
  944. },
  945. /** 新增按钮操作 */
  946. handleAdd() {
  947. this.reset();
  948. this.addOrUpdateVisible = !this.addOrUpdateVisible;
  949. this.title = "添加订单主";
  950. },
  951. // 表单重置
  952. reset() {
  953. this.form = {
  954. id: null,
  955. billNo: null,
  956. actId: null,
  957. corpId: null,
  958. transUserName: null,
  959. planUserName: null,
  960. billType: null,
  961. transType: null,
  962. transProp: null,
  963. ifContracted: null,
  964. contractNo: null,
  965. refNo: null,
  966. accstlType: null,
  967. accdays: null,
  968. goodsId: null,
  969. goodsPrice: null,
  970. goodsLossType: null,
  971. goodsLossStd: null,
  972. mblno: null,
  973. ysl: null,
  974. voy: null,
  975. pol: null,
  976. pod: null,
  977. qtyPlan: null,
  978. qtyDisPatch: null,
  979. weightPlan: null,
  980. cntrDesc: null,
  981. carNoList: null,
  982. loadAddr: null,
  983. loadAttn: null,
  984. loadAttntel: null,
  985. loadDate: null,
  986. mdLoadAddr: null,
  987. mdLoadAttn: null,
  988. mdLoadAttnTel: null,
  989. mdLoadDate: null,
  990. unLoadAddr: null,
  991. unLoadAttn: null,
  992. unLoadAttnTel: null,
  993. unLoadDate: null,
  994. routeId: null,
  995. routeDesc: null,
  996. ifWaybill: null,
  997. ifNeedinvDr: null,
  998. postDate: null,
  999. billStatus: 0,
  1000. delFlag: null,
  1001. createBy: null,
  1002. createTime: null,
  1003. updateBy: null,
  1004. updateTime: null,
  1005. remarks: null,
  1006. };
  1007. this.disabled = false;
  1008. this.resetForm("form");
  1009. this.relevantAttachments = [];
  1010. this.allfMblnoOptions=[]
  1011. this.feesList=[]
  1012. },
  1013. // 多选框选中数据
  1014. handleSelectionChange(selection) {
  1015. this.ids = selection.map((item) => item.id);
  1016. this.single = selection.length !== 1;
  1017. this.multiple = !selection.length;
  1018. },
  1019. /** 修改按钮操作 */
  1020. handleUpdate(row) {
  1021. this.reset();
  1022. const data = { id: row.id, billStatus: 1060 };
  1023. selectDriverFtmsorderbillscars(data).then((response) => {
  1024. selectCorpList(row.id).then((response) => {
  1025. this.allfMblnoOptions = response;
  1026. });
  1027. if (response.data.cars.billType) {
  1028. response.data.cars.billType = response.data.cars.billType.toString();
  1029. }
  1030. response.data.feesList.map(e=>{
  1031. if(e.fFeeunitid){
  1032. e.fFeeunitid=e.fFeeunitid.toString();
  1033. }
  1034. })
  1035. this.title = "查看详情页";
  1036. this.form = response.data.cars;
  1037. this.relevantAttachments = response.data.attachs;
  1038. this.feesList=response.data.feesList;
  1039. this.addOrUpdateVisible = !this.addOrUpdateVisible;
  1040. });
  1041. },
  1042. /** 删除按钮操作 */
  1043. handleDelete(row) {
  1044. const ids = row.id || this.ids;
  1045. this.$confirm('是否确认删除订单主编号为"' + ids + '"的数据项?', "警告", {
  1046. confirmButtonText: "确定",
  1047. cancelButtonText: "取消",
  1048. type: "warning",
  1049. })
  1050. .then(function () {
  1051. return delFtmsorderbills(ids);
  1052. })
  1053. .then(() => {
  1054. this.getList();
  1055. this.msgSuccess("删除成功");
  1056. });
  1057. },
  1058. /** 导出按钮操作 */
  1059. handleExport() {
  1060. const queryParams = this.queryParams;
  1061. this.$confirm("是否确认导出所有订单主数据项?", "警告", {
  1062. confirmButtonText: "确定",
  1063. cancelButtonText: "取消",
  1064. type: "warning",
  1065. })
  1066. .then(function () {
  1067. return exportFtmsorderbillscars(queryParams);
  1068. })
  1069. .then((response) => {
  1070. this.download(response.msg);
  1071. });
  1072. },
  1073. /** 搜索按钮操作 */
  1074. handleQuery(Status) {
  1075. this.queryParams.pageNum = 1;
  1076. if (Status) {
  1077. this.queryParams.carStatus = Status;
  1078. } else {
  1079. this.queryParams.carStatus = null;
  1080. }
  1081. this.getList();
  1082. },
  1083. /** 重置按钮操作 */
  1084. resetQuery() {
  1085. this.resetForm("queryForm");
  1086. this.handleQuery();
  1087. },
  1088. // 监听 子组件弹窗关闭后触发,有子组件调用
  1089. showAddOrUpdate(data) {
  1090. if (data === "false") {
  1091. this.addOrUpdateVisible = false;
  1092. } else {
  1093. this.addOrUpdateVisible = true;
  1094. }
  1095. },
  1096. fixDisabled(data) {
  1097. if (data === "false") {
  1098. this.disabled = false;
  1099. }
  1100. },
  1101. },
  1102. };
  1103. </script>
  1104. <style lang="scss" scoped>
  1105. .tabSetting {
  1106. display: flex;
  1107. justify-content: flex-end;
  1108. }
  1109. .listStyle {
  1110. display: flex;
  1111. border-top: 1px solid #dcdfe6;
  1112. border-left: 1px solid #dcdfe6;
  1113. border-right: 1px solid #dcdfe6;
  1114. }
  1115. .listStyle:last-child {
  1116. border-bottom: 1px solid #dcdfe6;
  1117. }
  1118. .progress {
  1119. display: flex;
  1120. align-items: center;
  1121. padding: 2px;
  1122. background-color: rgba(0, 0, 0, 0.05);
  1123. height: 100%;
  1124. }
  1125. </style>