index.vue 31 KB

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