index.vue 31 KB

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