index.vue 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626
  1. <template>
  2. <view class="container">
  3. <view class="example">
  4. <!-- 基础表单校验 -->
  5. <uni-forms ref="valiForm" label-align="right" :rules="rules" :modelValue="valiFormData">
  6. <uni-forms-item label="单号" :required="valiFormData.search_order_choice !== 2" name="orderNum">
  7. <uni-easyinput v-model="valiFormData.orderNum" placeholder="请输入单号" suffixIcon="scan" :focus="focusType" @iconClick="scan" />
  8. </uni-forms-item>
  9. <uni-forms-item v-if="valiFormData.search_order_choice === 2" label="批次号" name="batch_number">
  10. <uni-data-select v-model="valiFormData.batch_number" :localdata="batchOptions" placeholder="请选择批次号"></uni-data-select>
  11. </uni-forms-item>
  12. <uni-forms-item label="仓位编码" name="space_code">
  13. <uni-data-select v-model="valiFormData.space_code" :localdata="spaces" placeholder="请选择仓位编码"></uni-data-select>
  14. </uni-forms-item>
  15. <uni-forms-item v-if="valiFormData.search_order_choice !== 2" label="重量" required name="weight">
  16. <uni-easyinput
  17. v-model="valiFormData.weight"
  18. placeholder="请输入重量"
  19. oninput="value=value.replace(/[^\d.]/g,'').replace(/^\./g, '').replace(/\.{2,}/g, '').replace('.', '$#$').replace(/\./g, '').replace('$#$', '.').match(/^\d*(\.?\d{0,2})/g)[0] || null"
  20. >
  21. <template #right>
  22. <view class="weight-right">KG</view>
  23. </template>
  24. </uni-easyinput>
  25. </uni-forms-item>
  26. <uni-forms-item>
  27. <view @click="searchPkgChange" class="checkbox-cum" :style="{ color: valiFormData.search_pkg ? '#007AFF' : 'gray' }">
  28. <checkbox :checked="valiFormData.search_pkg" @click="searchPkgChange" />
  29. 搜索寄存包裹
  30. </view>
  31. <view class="sub-choice">
  32. <checkbox :disabled="!valiFormData.search_pkg" :checked="valiFormData.typing" />
  33. <text
  34. @click="
  35. () => {
  36. if (valiFormData.search_pkg) {
  37. valiFormData.typing = !valiFormData.typing;
  38. }
  39. }
  40. "
  41. :style="{ color: valiFormData.search_pkg && valiFormData.typing ? '#007AFF' : 'gray' }"
  42. >
  43. 包裹寄存、代购、运单都找不到时手工添加包裹
  44. </text>
  45. </view>
  46. <view @click="searchOrderChoiceChange" class="checkbox-cum" :style="{ color: valiFormData.search_order ? '#007AFF' : 'gray' }">
  47. <checkbox :checked="valiFormData.search_order" @click="searchOrderChoiceChange" />
  48. 搜索运单
  49. </view>
  50. <view>
  51. <uni-data-checkbox :disabled="!valiFormData.search_order" v-model="valiFormData.search_order_choice" :localdata="searchOrderChoice" />
  52. </view>
  53. </uni-forms-item>
  54. </uni-forms>
  55. <view class="button-group">
  56. <button type="info" @click="reset">重置</button>
  57. <button type="primary" @click="onsubmit" :loading="loading">
  58. <uni-icons v-if="!loading" type="checkmarkempty" size="18" color="white"></uni-icons>
  59. 提交
  60. </button>
  61. </view>
  62. </view>
  63. <view class="history">
  64. <view class="item" v-for="(item, i) in instockHistory.slice(0, 5)" :key="i">
  65. <text class="code" :style="{ color: item.status ? 'green' : '#666' }">
  66. {{ item.orderNum }}
  67. <text v-if="item.batch_text">批次号: {{ item.batch_text }}</text>
  68. <text v-if="item.space">仓位编码: {{ item.space }}</text>
  69. {{ item.type }}
  70. </text>
  71. <uni-icons v-if="item.status" type="checkmarkempty" class="status" size="16" color="green"></uni-icons>
  72. <text class="status fail" v-else>F</text>
  73. <text style="margin-left: 10rpx; font-weight: 300">
  74. {{ '\r\n' + item.createTime }}
  75. </text>
  76. </view>
  77. </view>
  78. <uni-popup ref="message" type="message">
  79. <uni-popup-message :type="messageType" :message="messageText" :duration="2000"></uni-popup-message>
  80. </uni-popup>
  81. <uni-popup ref="alertDialog" type="dialog">
  82. <uni-popup-dialog
  83. type="info"
  84. cancelText="否"
  85. confirmText="是"
  86. title="提示"
  87. content="是否按默认申报(默认申报为:衣服,10件,单价1)"
  88. @confirm="dialogConfirm"
  89. @close="dialogClose"
  90. ></uni-popup-dialog>
  91. </uni-popup>
  92. <PrinterListScan></PrinterListScan>
  93. </view>
  94. </template>
  95. <script>
  96. import permision from '@/common/permission.js';
  97. import { ref, reactive, nextTick, provide } from 'vue';
  98. import { instockScanURL, outStockScanURL, weighScanURL, checkWaybillGoodsURL, getWarehouseSpaceURL, getBindParamsURL } from '@/utils/api.js';
  99. export default {
  100. data() {
  101. const token = ref(null);
  102. const user = ref(null);
  103. const loading = ref(false);
  104. return {
  105. token,
  106. user,
  107. messageType: '',
  108. messageText: '',
  109. batchOptions: [],
  110. spaces: [],
  111. printerList: {},
  112. instockHistory: [],
  113. focusType: true,
  114. loading,
  115. // 校验表单数据
  116. valiFormData: {
  117. orderNum: '',
  118. batch_number: '',
  119. space_code: '',
  120. weight: '',
  121. search_pkg: true,
  122. typing: true,
  123. search_order: true,
  124. search_order_choice: 1
  125. },
  126. searchOrderChoice: [
  127. {
  128. text: '更新为已入库,状态为【已入库】',
  129. value: 1
  130. },
  131. {
  132. text: '更新为已出库,状态为【已出库】',
  133. value: 2
  134. },
  135. {
  136. text: '称重计费',
  137. value: 3
  138. }
  139. ]
  140. };
  141. },
  142. provide() {
  143. return {
  144. printerList: this.printerList
  145. };
  146. },
  147. computed: {
  148. rules: function () {
  149. return {
  150. orderNum: {
  151. rules: [
  152. {
  153. required: this.valiFormData.search_order_choice !== 2,
  154. errorMessage: '单号不能为空'
  155. }
  156. ]
  157. },
  158. weight: {
  159. rules: [
  160. {
  161. required: true,
  162. errorMessage: '重量不能为空'
  163. },
  164. {
  165. format: 'number',
  166. errorMessage: '重量只能输入数字'
  167. }
  168. ]
  169. }
  170. };
  171. },
  172. spaceRes: function () {
  173. const res = this.spaces.find((item) => item.value === this.valiFormData.space_code);
  174. console.log(res);
  175. return res?.text;
  176. }
  177. },
  178. onShow() {
  179. this.focusType = true;
  180. this.loading = false;
  181. this.token = uni.getStorageSync('token');
  182. this.user = uni.getStorageSync('user');
  183. this.getWarehouseSpace();
  184. this.getBindParams();
  185. },
  186. onHide() {
  187. this.focusType = false;
  188. this.loading = false;
  189. },
  190. onReady() {},
  191. onNavigationBarButtonTap(event) {
  192. if (event.index === 0) {
  193. uni.navigateTo({
  194. url: '/pages/instock/instockLog'
  195. });
  196. }
  197. },
  198. methods: {
  199. getWarehouseSpace() {
  200. uni.request({
  201. url: getWarehouseSpaceURL,
  202. method: 'POST',
  203. header: {
  204. batoken: this.token
  205. },
  206. data: {
  207. code: ''
  208. },
  209. success: (res) => {
  210. if (res.data.code === 1) {
  211. this.spaces = res.data.data.spaces.map((item) => {
  212. return {
  213. text: item.name,
  214. value: item.code
  215. };
  216. });
  217. }
  218. }
  219. });
  220. },
  221. getBindParams() {
  222. uni.request({
  223. url: getBindParamsURL,
  224. method: 'GET',
  225. header: {
  226. batoken: this.token
  227. },
  228. success: (res) => {
  229. if (res.data.code === 1) {
  230. this.batchOptions = res.data.data.batch_number.map((item) => {
  231. return { text: item.name, value: item.id };
  232. });
  233. }
  234. },
  235. fail(e) {
  236. console.log('fail--', e);
  237. }
  238. });
  239. },
  240. batchText(batch_number) {
  241. return this.batchOptions.find((item) => item.value === batch_number).text;
  242. },
  243. searchPkgChange() {
  244. this.valiFormData.search_pkg = !this.valiFormData.search_pkg;
  245. this.valiFormData.typing = this.valiFormData.search_pkg;
  246. },
  247. searchOrderChoiceChange() {
  248. this.valiFormData.search_order = !this.valiFormData.search_order;
  249. this.valiFormData.search_order_choice = this.valiFormData.search_order ? 3 : '';
  250. },
  251. reset() {
  252. this.loading = false;
  253. this.focusType = false;
  254. this.valiFormData = {
  255. ...this.valiFormData,
  256. orderNum: '',
  257. // space_code: '',
  258. batch_number: '',
  259. weight: '',
  260. search_pkg: true,
  261. typing: true,
  262. search_order: true
  263. };
  264. nextTick(() => {
  265. this.focusType = true;
  266. });
  267. },
  268. async scan() {
  269. // #ifdef APP-PLUS
  270. let status = await this.checkPermission();
  271. if (status !== 1) {
  272. return;
  273. }
  274. // #endif
  275. uni.scanCode({
  276. success: (res) => {
  277. this.result = res.result;
  278. this.valiFormData.orderNum = res.result;
  279. // this.onsubmit();
  280. },
  281. fail: (err) => {
  282. // 需要注意的是小程序扫码不需要申请相机权限
  283. }
  284. });
  285. },
  286. // #ifdef APP-PLUS
  287. async checkPermission(code) {
  288. let status = permision.isIOS ? await permision.requestIOS('camera') : await permision.requestAndroid('android.permission.CAMERA');
  289. if (status === null || status === 1) {
  290. status = 1;
  291. } else {
  292. uni.showModal({
  293. content: 'Camera permission required',
  294. confirmText: 'Setting',
  295. success: function (res) {
  296. if (res.confirm) {
  297. permision.gotoAppSetting();
  298. }
  299. }
  300. });
  301. }
  302. return status;
  303. },
  304. // #endif
  305. async warehouseScan() {
  306. this.st && clearTimeout(this.st);
  307. if (this.valiFormData.search_order_choice === 1) {
  308. await this.checkWaybillGoods();
  309. } else if (this.valiFormData.search_order_choice === 2) {
  310. await this.scanOutstock();
  311. } else if (this.valiFormData.search_order_choice === 3) {
  312. await this.weighScan();
  313. }
  314. },
  315. async checkWaybillGoods() {
  316. this.loading = true;
  317. uni.request({
  318. url: checkWaybillGoodsURL,
  319. method: 'POST',
  320. header: {
  321. batoken: this.token
  322. },
  323. data: {
  324. order_no: this.valiFormData.orderNum
  325. },
  326. success: (res) => {
  327. this.loading = false;
  328. if (res.data.code === 1 && res.data.data.is_goods_empty) {
  329. this.$refs.alertDialog.open();
  330. } else {
  331. this.instockScan(0);
  332. }
  333. }
  334. });
  335. },
  336. instockScan(is_save_goods) {
  337. uni.request({
  338. url: instockScanURL,
  339. method: 'POST',
  340. header: {
  341. batoken: this.token
  342. },
  343. data: {
  344. order_no: this.valiFormData.orderNum,
  345. weight: this.valiFormData.weight,
  346. space_code: this.valiFormData.space_code,
  347. is_save_goods: is_save_goods
  348. },
  349. success: (res) => {
  350. this.loading = false;
  351. if (res.data.code == 1) {
  352. this.messageType = 'success';
  353. this.messageText = res.data.msg;
  354. this.$refs.message.open();
  355. if (res.data.data.labels && res.data.data.labels.length > 0) {
  356. console.log('有打印面单');
  357. // res.data.data.labels.map((url: string) => {
  358. // let path = fullUrl(url);
  359. // window.open(path, '_blank');
  360. // });
  361. }
  362. const historyItem = {
  363. orderNum: this.valiFormData.orderNum,
  364. createTime: new Date(),
  365. space: this.spaceRes,
  366. type: '入库',
  367. status: true
  368. };
  369. this.instockHistory.unshift(historyItem);
  370. uni.setStorageSync('instockHistory', this.instockHistory);
  371. this.getHistory();
  372. } else {
  373. this.messageType = 'error';
  374. this.messageText = res.data.msg;
  375. this.$refs.message.open();
  376. const historyItem = {
  377. orderNum: this.valiFormData.orderNum,
  378. createTime: new Date(),
  379. space: this.spaceRes,
  380. type: '入库',
  381. status: false
  382. };
  383. this.instockHistory.unshift(historyItem);
  384. uni.setStorageSync('instockHistory', this.instockHistory);
  385. this.getHistory();
  386. }
  387. this.st = setTimeout(() => {
  388. this.reset();
  389. this.st && clearTimeout(this.st);
  390. }, 1000);
  391. }
  392. });
  393. },
  394. scanOutstock() {
  395. console.log(this.valiFormData.orderNum, this.valiFormData.batch_number);
  396. if (this.valiFormData.orderNum.length === 0 && this.valiFormData.batch_number.length === 0) {
  397. this.messageType = 'error';
  398. this.messageText = '单号或批次号至少填一个';
  399. this.$refs.message.open();
  400. return;
  401. }
  402. this.loading = true;
  403. uni.request({
  404. url: outStockScanURL,
  405. method: 'POST',
  406. header: {
  407. batoken: this.token
  408. },
  409. data: {
  410. order_no: this.valiFormData.orderNum,
  411. batch_number: this.valiFormData.batch_number
  412. },
  413. success: (res) => {
  414. this.loading = false;
  415. if (res.data.code == 1) {
  416. this.messageType = 'success';
  417. this.messageText = res.data.msg;
  418. this.$refs.message.open();
  419. if (res.data.data.labels && res.data.data.labels.length > 0) {
  420. console.log('有打印面单');
  421. // res.data.data.labels.map((url: string) => {
  422. // let path = fullUrl(url);
  423. // window.open(path, '_blank');
  424. // });
  425. }
  426. const historyItem = {
  427. orderNum: this.valiFormData.orderNum,
  428. batch_text: this.batchText(this.valiFormData.batch_number),
  429. createTime: new Date(),
  430. type: '出库',
  431. status: true
  432. };
  433. this.instockHistory.unshift(historyItem);
  434. this.instockHistory.length > 10 && (this.instockHistory.length = 10);
  435. uni.setStorageSync('instockHistory', this.instockHistory);
  436. this.getHistory();
  437. } else {
  438. this.messageType = 'error';
  439. this.messageText = res.data.msg;
  440. this.$refs.message.open();
  441. const historyItem = {
  442. orderNum: this.valiFormData.orderNum,
  443. batch_text: this.batchText(this.valiFormData.batch_number),
  444. createTime: new Date(),
  445. type: '出库',
  446. status: false
  447. };
  448. this.instockHistory.unshift(historyItem);
  449. this.instockHistory.length > 10 && (this.instockHistory.length = 10);
  450. uni.setStorageSync('instockHistory', this.instockHistory);
  451. this.getHistory();
  452. }
  453. this.st = setTimeout(() => {
  454. this.reset();
  455. this.st && clearTimeout(this.st);
  456. }, 1000);
  457. }
  458. });
  459. },
  460. weighScan() {
  461. this.loading = true;
  462. uni.request({
  463. url: weighScanURL,
  464. method: 'POST',
  465. header: {
  466. batoken: this.token
  467. },
  468. data: {
  469. order_no: this.valiFormData.orderNum,
  470. weight: this.valiFormData.weight
  471. },
  472. success: (res) => {
  473. this.loading = false;
  474. if (res.data.code == 1) {
  475. this.messageType = 'success';
  476. this.messageText = res.data.msg;
  477. this.$refs.message.open();
  478. const historyItem = {
  479. orderNum: this.valiFormData.orderNum,
  480. createTime: new Date(),
  481. type: '称重',
  482. status: true
  483. };
  484. this.instockHistory.unshift(historyItem);
  485. this.instockHistory.length > 10 && (this.instockHistory.length = 10);
  486. uni.setStorageSync('instockHistory', this.instockHistory);
  487. this.getHistory();
  488. } else {
  489. this.messageType = 'error';
  490. this.messageText = res.data.msg;
  491. this.$refs.message.open();
  492. const historyItem = {
  493. orderNum: this.valiFormData.orderNum,
  494. createTime: new Date(),
  495. type: '称重',
  496. status: false
  497. };
  498. this.instockHistory.unshift(historyItem);
  499. this.instockHistory.length > 10 && (this.instockHistory.length = 10);
  500. uni.setStorageSync('instockHistory', this.instockHistory);
  501. this.getHistory();
  502. }
  503. this.st = setTimeout(() => {
  504. this.reset();
  505. this.st && clearTimeout(this.st);
  506. }, 1000);
  507. }
  508. });
  509. },
  510. isNotGoods() {
  511. this.instockScan(0);
  512. },
  513. dialogConfirm() {
  514. console.log('点击确认');
  515. this.instockScan(1);
  516. },
  517. dialogClose() {
  518. this.instockScan(0);
  519. },
  520. onsubmit() {
  521. this.$refs.valiForm
  522. .validate()
  523. .then((res) => {
  524. this.warehouseScan();
  525. })
  526. .catch((err) => {
  527. console.log('err', err);
  528. });
  529. },
  530. getHistory() {
  531. // this.instockHistory = uni.getStorageSync('history')
  532. }
  533. }
  534. };
  535. </script>
  536. <style lang="scss">
  537. .example {
  538. padding: 15px;
  539. background-color: #fff;
  540. }
  541. .checkbox-cum {
  542. margin-bottom: 20rpx;
  543. font-size: 14rpx;
  544. }
  545. .sub-choice {
  546. margin-bottom: 20rpx;
  547. margin-left: 20rpx;
  548. font-size: 14rpx;
  549. }
  550. .button-group {
  551. margin-top: 15px;
  552. display: flex;
  553. flex-direction: row;
  554. justify-content: space-around;
  555. button {
  556. display: flex;
  557. align-items: center;
  558. justify-content: center;
  559. height: 35px;
  560. width: 50%;
  561. margin-left: 10px;
  562. font-size: 16rpx;
  563. }
  564. .uni-icons {
  565. margin-right: 10px;
  566. }
  567. }
  568. .weight-right {
  569. padding-right: 10rpx;
  570. font-size: 14rpx;
  571. }
  572. .history {
  573. display: flex;
  574. width: 100%;
  575. flex-direction: column;
  576. justify-items: start;
  577. .title {
  578. padding: 20rpx;
  579. font-size: 24rpx;
  580. font-weight: 600;
  581. }
  582. .code {
  583. font-weight: 600;
  584. }
  585. .item {
  586. padding: 20rpx;
  587. font-size: 20rpx;
  588. color: #666;
  589. .status {
  590. padding-left: 20rpx;
  591. }
  592. .fail {
  593. font-weight: 600;
  594. color: #f00;
  595. }
  596. }
  597. }
  598. </style>