index.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143
  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: "billKind",
  521. name: "单据类型",
  522. checked: 0,
  523. width: 100,
  524. },
  525. {
  526. surface: "2",
  527. label: "mdLoadDate",
  528. name: "装卸日期",
  529. checked: 0,
  530. width: 100,
  531. },
  532. {
  533. surface: "3",
  534. label: "billType",
  535. name: "贸易方式",
  536. checked: 0,
  537. width: 100,
  538. },
  539. {
  540. surface: "4",
  541. label: "transType",
  542. name: "运输方式",
  543. checked: 0,
  544. width: 100,
  545. },
  546. {
  547. surface: "5",
  548. label: "corpId",
  549. name: "托运人",
  550. checked: 0,
  551. width: 100,
  552. },
  553. {
  554. surface: "6",
  555. label: "ysl",
  556. name: "船名",
  557. checked: 0,
  558. width: 100,
  559. },
  560. {
  561. surface: "7",
  562. label: "voy",
  563. name: "航次",
  564. checked: 0,
  565. width: 100,
  566. },
  567. {
  568. surface: "8",
  569. label: "cntrQty",
  570. name: "柜量",
  571. checked: 0,
  572. width: 100,
  573. },
  574. {
  575. surface: "9",
  576. label: "cntrId",
  577. name: "柜型",
  578. checked: 0,
  579. width: 100,
  580. },
  581. {
  582. surface: "10",
  583. label: "goodsId",
  584. name: "品名",
  585. checked: 0,
  586. width: 100,
  587. },
  588. {
  589. surface: "11",
  590. label: "cntrWeight",
  591. name: "重量",
  592. checked: 0,
  593. width: 100,
  594. },
  595. {
  596. surface: "12",
  597. label: "polId",
  598. name: "起运港",
  599. checked: 0,
  600. width: 100,
  601. },
  602. {
  603. surface: "13",
  604. label: "podId",
  605. name: "目的港",
  606. checked: 0,
  607. width: 100,
  608. },
  609. {
  610. surface: "14",
  611. label: "loadAddr",
  612. name: "提箱场站",
  613. checked: 0,
  614. width: 100,
  615. },
  616. {
  617. surface: "15",
  618. label: "mdLoadAddr",
  619. name: "装货地",
  620. checked: 0,
  621. width: 100,
  622. },
  623. {
  624. surface: "16",
  625. label: "unLoadAddr",
  626. name: "卸货地",
  627. checked: 0,
  628. width: 100,
  629. },
  630. {
  631. surface: "17",
  632. label: "carregNo",
  633. name: "车号",
  634. checked: 0,
  635. width: 100,
  636. },
  637. {
  638. surface: "18",
  639. label: "driverName",
  640. name: "司机",
  641. checked: 0,
  642. width: 100,
  643. },
  644. {
  645. surface: "19",
  646. label: "orderNo",
  647. name: "运单号",
  648. checked: 0,
  649. width: 100,
  650. },
  651. {
  652. surface: "20",
  653. label: "driverTel",
  654. name: "司机电话",
  655. checked: 0,
  656. width: 100,
  657. },
  658. {
  659. surface: "21",
  660. label: "orderName",
  661. name: "状态",
  662. checked: 0,
  663. width: 100,
  664. },
  665. {
  666. surface: "22",
  667. label: "acceptDate",
  668. name: "接单日期",
  669. checked: 0,
  670. width: 100,
  671. },
  672. {
  673. surface: "23",
  674. label: "loadDate",
  675. name: "提箱日期",
  676. checked: 0,
  677. width: 100,
  678. },
  679. {
  680. surface: "24",
  681. label: "unLoadDate",
  682. name: "还柜日期",
  683. checked: 0,
  684. width: 100,
  685. },
  686. {
  687. surface: "25",
  688. label: "oilAmt",
  689. name: "油气费",
  690. checked: 0,
  691. width: 100,
  692. },
  693. {
  694. surface: "26",
  695. label: "driverbonus",
  696. name: "单趟提成",
  697. checked: 0,
  698. width: 100,
  699. },
  700. {
  701. surface: "27",
  702. label: "costOth",
  703. name: "其他费用",
  704. checked: 0,
  705. width: 100,
  706. },
  707. {
  708. surface: "28",
  709. label: "costRemarks",
  710. name: "备注",
  711. checked: 0,
  712. width: 100,
  713. },
  714. {
  715. surface: "29",
  716. label: "costomAmt05",
  717. name: "港杂费",
  718. checked: 0,
  719. width: 100,
  720. },
  721. {
  722. surface: "30",
  723. label: "costomAmt06",
  724. name: "提箱费",
  725. checked: 0,
  726. width: 100,
  727. },
  728. {
  729. surface: "31",
  730. label: "costomAmt03",
  731. name: "修洗费",
  732. checked: 0,
  733. width: 100,
  734. },
  735. {
  736. surface: "32",
  737. label: "costomAmt04",
  738. name: "吊装费",
  739. checked: 0,
  740. width: 100,
  741. },
  742. {
  743. surface: "33",
  744. label: "costomAmt01",
  745. name: "出口其他费用",
  746. checked: 0,
  747. width: 100,
  748. },
  749. {
  750. surface: "34",
  751. label: "costomStr01",
  752. name: "出口费用备注",
  753. checked: 0,
  754. width: 100,
  755. },
  756. {
  757. surface: "35",
  758. label: "costomAmt02",
  759. name: "进口其他费用",
  760. checked: 0,
  761. width: 100,
  762. },
  763. {
  764. surface: "36",
  765. label: "costomStr02",
  766. name: "进口费用备注",
  767. checked: 0,
  768. width: 100,
  769. },
  770. {
  771. surface: "37",
  772. label: "mBillNo",
  773. name: "主单号",
  774. checked: 0,
  775. width: 100,
  776. },
  777. ],
  778. allCheck: false,
  779. title: "",
  780. form: {},
  781. DList: [],
  782. CList: [],
  783. disabled: false,
  784. goodsOptions: [],
  785. fMblnoOptions: [],
  786. transPropList: [],
  787. transTypeList: [],
  788. billTypeList: [],
  789. show: false,
  790. buttonValue: {},
  791. allfMblnoOptions:[]
  792. };
  793. },
  794. // 使用子组件
  795. components: {
  796. AddOrUpdate,
  797. draggable,
  798. },
  799. created() {
  800. this.setRowList = this.tableDate;
  801. this.getRowList = this.tableDate;
  802. this.getList();
  803. this.getDicts("data_billType").then((response) => {
  804. this.billTypeList = response.data;
  805. });
  806. this.getDicts("data_transType").then((response) => {
  807. this.transTypeList = response.data;
  808. });
  809. this.getDicts("data_transProp").then((response) => {
  810. this.transPropList = response.data;
  811. });
  812. listGoods().then((response) => {
  813. this.goodsOptions = response.rows;
  814. });
  815. listCorps().then((response) => {
  816. this.fMblnoOptions = response.rows;
  817. });
  818. this.getRow();
  819. if (this.$route.query.id) {
  820. this.reset();
  821. const data = { id: this.$route.query.id, billStatus: 1060 };
  822. selectDriverFtmsorderbillscars(data).then((response) => {
  823. if (response.data.cars.billType) {
  824. response.data.cars.billType = response.data.cars.billType.toString();
  825. }
  826. this.title = "查看详情页";
  827. this.form = response.data.cars;
  828. this.relevantAttachments = response.data.attachs;
  829. this.addOrUpdateVisible = !this.addOrUpdateVisible;
  830. this.feesList=[]
  831. });
  832. }
  833. },
  834. methods: {
  835. //列设置全选
  836. allChecked() {
  837. if (this.allCheck == true) {
  838. this.setRowList.map((e) => {
  839. return (e.checked = 0);
  840. });
  841. } else {
  842. this.setRowList.map((e) => {
  843. return (e.checked = 1);
  844. });
  845. }
  846. },
  847. //查询列数据
  848. getRow() {
  849. let that = this;
  850. this.data = {
  851. tableName: "状态跟踪",
  852. userId: Cookies.get("userName"),
  853. };
  854. select(this.data).then((res) => {
  855. if (res.data.length != 0) {
  856. this.getRowList = res.data.filter((e) => e.checked == 0);
  857. this.setRowList = res.data;
  858. this.setRowList = this.setRowList.reduce((res, item) => {
  859. res.push({
  860. surface: item.surface,
  861. label: item.label,
  862. name: item.name,
  863. checked: item.checked,
  864. width: item.width,
  865. fixed: item.fixed,
  866. });
  867. return res;
  868. }, []);
  869. }
  870. });
  871. },
  872. delRow() {
  873. this.data = {
  874. tableName: "状态跟踪",
  875. userId: Cookies.get("userName"),
  876. };
  877. resetModule(this.data).then((res) => {
  878. if (res.code == 200) {
  879. this.showSetting = false;
  880. this.setRowList = this.tableDate;
  881. this.getRowList = this.tableDate;
  882. }
  883. });
  884. },
  885. //保存列设置
  886. save() {
  887. this.showSetting = false;
  888. this.data = {
  889. tableName: "状态跟踪",
  890. userId: Cookies.get("userName"),
  891. sysTableSetList: this.setRowList,
  892. };
  893. addSet(this.data).then((res) => {
  894. if (res.code == 200) {
  895. this.showSetting = false;
  896. this.getRowList = this.setRowList.filter((e) => e.checked == 0);
  897. }
  898. });
  899. },
  900. //开始拖拽事件
  901. onStart() {
  902. this.drag = true;
  903. },
  904. //拖拽结束事件
  905. onEnd() {
  906. this.drag = false;
  907. },
  908. /** 查询订单主列表 */
  909. getList() {
  910. this.loading = true;
  911. listFtmsorderbillscars(this.queryParams).then((response) => {
  912. response.dataTable.rows.map((e) => {
  913. if (e.orderStatus == 10) {
  914. e.orderStatus = "车队安排";
  915. }
  916. if (e.orderStatus == 20) {
  917. e.orderStatus = "司机受理";
  918. }
  919. if (e.orderStatus == 30) {
  920. e.orderStatus = "司机出车";
  921. }
  922. if (e.orderStatus == 40) {
  923. e.orderStatus = "提箱";
  924. }
  925. if (e.orderStatus == 50) {
  926. e.orderStatus = "装卸货";
  927. }
  928. if (e.orderStatus == 60) {
  929. e.orderStatus = "还卸柜";
  930. }
  931. if (e.orderStatus == 70) {
  932. e.orderStatus = "费用确认";
  933. }
  934. if (e.orderStatus == 80) {
  935. e.orderStatus = "回单";
  936. }
  937. if (e.loadDate) {
  938. this.$set(e, "loadDate", e.loadDate.substring(0, 10));
  939. }
  940. if (e.acceptDate) {
  941. this.$set(e, "acceptDate", e.acceptDate.substring(0, 10));
  942. }
  943. if (e.mdLoadDate) {
  944. this.$set(e, "mdLoadDate", e.mdLoadDate.substring(0, 10));
  945. }
  946. if (e.unLoadDate) {
  947. this.$set(e, "unLoadDate", e.unLoadDate.substring(0, 10));
  948. }
  949. if (e.waybillDate) {
  950. e.waybillDate = e.waybillDate.substring(0, 10);
  951. }
  952. });
  953. this.ftmsorderbillscarsList = response.dataTable.rows;
  954. this.buttonValue = response.buttonValue;
  955. this.total = response.dataTable.total;
  956. this.loading = false;
  957. });
  958. },
  959. /** 新增按钮操作 */
  960. handleAdd() {
  961. this.reset();
  962. this.addOrUpdateVisible = !this.addOrUpdateVisible;
  963. this.title = "添加订单主";
  964. },
  965. // 表单重置
  966. reset() {
  967. this.form = {
  968. id: null,
  969. billNo: null,
  970. actId: null,
  971. corpId: null,
  972. transUserName: null,
  973. planUserName: null,
  974. billType: null,
  975. transType: null,
  976. transProp: null,
  977. ifContracted: null,
  978. contractNo: null,
  979. refNo: null,
  980. accstlType: null,
  981. accdays: null,
  982. goodsId: null,
  983. goodsPrice: null,
  984. goodsLossType: null,
  985. goodsLossStd: null,
  986. mblno: null,
  987. ysl: null,
  988. voy: null,
  989. pol: null,
  990. pod: null,
  991. qtyPlan: null,
  992. qtyDisPatch: null,
  993. weightPlan: null,
  994. cntrDesc: null,
  995. carNoList: null,
  996. loadAddr: null,
  997. loadAttn: null,
  998. loadAttntel: null,
  999. loadDate: null,
  1000. mdLoadAddr: null,
  1001. mdLoadAttn: null,
  1002. mdLoadAttnTel: null,
  1003. mdLoadDate: null,
  1004. unLoadAddr: null,
  1005. unLoadAttn: null,
  1006. unLoadAttnTel: null,
  1007. unLoadDate: null,
  1008. routeId: null,
  1009. routeDesc: null,
  1010. ifWaybill: null,
  1011. ifNeedinvDr: null,
  1012. postDate: null,
  1013. billStatus: 0,
  1014. delFlag: null,
  1015. createBy: null,
  1016. createTime: null,
  1017. updateBy: null,
  1018. updateTime: null,
  1019. remarks: null,
  1020. };
  1021. this.disabled = false;
  1022. this.resetForm("form");
  1023. this.relevantAttachments = [];
  1024. this.allfMblnoOptions=[]
  1025. this.feesList=[]
  1026. },
  1027. // 多选框选中数据
  1028. handleSelectionChange(selection) {
  1029. this.ids = selection.map((item) => item.id);
  1030. this.single = selection.length !== 1;
  1031. this.multiple = !selection.length;
  1032. },
  1033. /** 修改按钮操作 */
  1034. handleUpdate(row) {
  1035. this.reset();
  1036. const data = { id: row.id, billStatus: 1060 };
  1037. selectDriverFtmsorderbillscars(data).then((response) => {
  1038. selectCorpList(row.id).then((response) => {
  1039. this.allfMblnoOptions = response;
  1040. });
  1041. if (response.data.cars.billType) {
  1042. response.data.cars.billType = response.data.cars.billType.toString();
  1043. }
  1044. response.data.feesList.map(e=>{
  1045. if(e.fFeeunitid){
  1046. e.fFeeunitid=e.fFeeunitid.toString();
  1047. }
  1048. })
  1049. this.title = "查看详情页";
  1050. this.form = response.data.cars;
  1051. this.relevantAttachments = response.data.attachs;
  1052. this.feesList=response.data.feesList;
  1053. this.addOrUpdateVisible = !this.addOrUpdateVisible;
  1054. });
  1055. },
  1056. /** 删除按钮操作 */
  1057. handleDelete(row) {
  1058. const ids = row.id || this.ids;
  1059. this.$confirm('是否确认删除订单主编号为"' + ids + '"的数据项?', "警告", {
  1060. confirmButtonText: "确定",
  1061. cancelButtonText: "取消",
  1062. type: "warning",
  1063. })
  1064. .then(function () {
  1065. return delFtmsorderbills(ids);
  1066. })
  1067. .then(() => {
  1068. this.getList();
  1069. this.msgSuccess("删除成功");
  1070. });
  1071. },
  1072. /** 导出按钮操作 */
  1073. handleExport() {
  1074. const queryParams = this.queryParams;
  1075. this.$confirm("是否确认导出所有订单主数据项?", "警告", {
  1076. confirmButtonText: "确定",
  1077. cancelButtonText: "取消",
  1078. type: "warning",
  1079. })
  1080. .then(function () {
  1081. return exportFtmsorderbillscars(queryParams);
  1082. })
  1083. .then((response) => {
  1084. this.download(response.msg);
  1085. });
  1086. },
  1087. /** 搜索按钮操作 */
  1088. handleQuery(Status) {
  1089. this.queryParams.pageNum = 1;
  1090. if (Status) {
  1091. this.queryParams.carStatus = Status;
  1092. } else {
  1093. this.queryParams.carStatus = null;
  1094. }
  1095. this.getList();
  1096. },
  1097. /** 重置按钮操作 */
  1098. resetQuery() {
  1099. this.resetForm("queryForm");
  1100. this.handleQuery();
  1101. },
  1102. // 监听 子组件弹窗关闭后触发,有子组件调用
  1103. showAddOrUpdate(data) {
  1104. if (data === "false") {
  1105. this.addOrUpdateVisible = false;
  1106. } else {
  1107. this.addOrUpdateVisible = true;
  1108. }
  1109. },
  1110. fixDisabled(data) {
  1111. if (data === "false") {
  1112. this.disabled = false;
  1113. }
  1114. },
  1115. },
  1116. };
  1117. </script>
  1118. <style lang="scss" scoped>
  1119. .tabSetting {
  1120. display: flex;
  1121. justify-content: flex-end;
  1122. }
  1123. .listStyle {
  1124. display: flex;
  1125. border-top: 1px solid #dcdfe6;
  1126. border-left: 1px solid #dcdfe6;
  1127. border-right: 1px solid #dcdfe6;
  1128. }
  1129. .listStyle:last-child {
  1130. border-bottom: 1px solid #dcdfe6;
  1131. }
  1132. .progress {
  1133. display: flex;
  1134. align-items: center;
  1135. padding: 2px;
  1136. background-color: rgba(0, 0, 0, 0.05);
  1137. height: 100%;
  1138. }
  1139. </style>