|
@@ -0,0 +1,541 @@
|
|
|
+<template>
|
|
|
+ <view class="picking-task-page">
|
|
|
+ <u-navbar
|
|
|
+ height="40px"
|
|
|
+ title="复核任务"
|
|
|
+ bgColor="#F0F6FB"
|
|
|
+ autoBack
|
|
|
+ placeholder
|
|
|
+ >
|
|
|
+ <view class="u-nav-slot depot-label" slot="right">
|
|
|
+ <view class="name">{{ curDepotName }}</view>
|
|
|
+ </view>
|
|
|
+ </u-navbar>
|
|
|
+ <view class="container_main">
|
|
|
+ <u-sticky :offsetTop="offsetTop" bgColor="#F0F6FB">
|
|
|
+ <view class="search-box">
|
|
|
+ <u-search
|
|
|
+ placeholder="请输入单据编号"
|
|
|
+ bgColor="#fff"
|
|
|
+ shape="square"
|
|
|
+ v-model="query.number"
|
|
|
+ :showAction="false"
|
|
|
+ @search="searchClick"
|
|
|
+ @clear="searchClick"
|
|
|
+ ></u-search>
|
|
|
+ <view class="flex_box" @click="scanCode">
|
|
|
+ <view class="scan-text">扫描单据二维码</view>
|
|
|
+ <view class="scan-icon">
|
|
|
+ <image src="@/static/image/scan-icon.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="type-box flex_box">
|
|
|
+ <view class="type-item" @click="tabClick(1)">
|
|
|
+ <view class="type-val">{{ type1 }}</view>
|
|
|
+ <u-icon name="arrow-down-fill" color="#999999" size="12"></u-icon>
|
|
|
+ </view>
|
|
|
+ <view class="type-item" @click="tabClick(2)">
|
|
|
+ <view class="type-val">{{ type2 }}</view>
|
|
|
+ <u-icon name="arrow-down-fill" color="#999999" size="12"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-sticky>
|
|
|
+ <view class="task-cont">
|
|
|
+ <block v-for="(item, i) in list" :key="`${item.id}-${item.status}`">
|
|
|
+ <task-card
|
|
|
+ :columns="taskColumns"
|
|
|
+ :formData="item"
|
|
|
+ @handleClickField="handleClickField"
|
|
|
+ >
|
|
|
+ <!-- 状态 -->
|
|
|
+ <view slot="rightTop">
|
|
|
+ <u-tag
|
|
|
+ v-if="item.status == 6"
|
|
|
+ text="待复核"
|
|
|
+ plain
|
|
|
+ borderColor="rgba(255, 59, 29, 0.2)"
|
|
|
+ color="rgba(255, 59, 29, 1)"
|
|
|
+ bgColor="rgba(255, 59, 29, 0.2)"
|
|
|
+ ></u-tag>
|
|
|
+ <u-tag
|
|
|
+ v-if="item.status == 2"
|
|
|
+ text="复核通过"
|
|
|
+ plain
|
|
|
+ borderColor="rgba(0, 185, 123, 0.2)"
|
|
|
+ color="rgba(0, 185, 123, 1)"
|
|
|
+ bgColor="rgba(0, 185, 123, 0.2)"
|
|
|
+ ></u-tag>
|
|
|
+ <u-tag
|
|
|
+ v-if="item.status == 7"
|
|
|
+ text="复核驳回"
|
|
|
+ plain
|
|
|
+ borderColor="rgba(225, 51, 15, 1)"
|
|
|
+ color="rgba(255, 255, 255, 1)"
|
|
|
+ bgColor="rgba(225, 51, 15, 1)"
|
|
|
+ ></u-tag>
|
|
|
+ </view>
|
|
|
+ <!-- 操作栏 -->
|
|
|
+ <view slot="action" class="action-box">
|
|
|
+ <view class="action-left-box">
|
|
|
+ <text v-if="item.type == '采购订单'"
|
|
|
+ >入库时间: {{ item.operTime }}</text
|
|
|
+ >
|
|
|
+ <text v-if="item.type == '销售订单'"
|
|
|
+ >出库时间: {{ item.operTime }}</text
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ <view class="task-bottom">
|
|
|
+ <view
|
|
|
+ class="btn btn-1"
|
|
|
+ @click="toAudit(item)"
|
|
|
+ v-if="item.status == 6"
|
|
|
+ >去复核</view
|
|
|
+ >
|
|
|
+ <view class="btn btn-2" @click="toDetail(item)" v-else
|
|
|
+ >详情</view
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </task-card>
|
|
|
+ </block>
|
|
|
+ <u-loadmore v-if="list.length > 0" :status="loadStatus" />
|
|
|
+ <u-empty
|
|
|
+ mode="data"
|
|
|
+ text="暂无内容"
|
|
|
+ marginTop="60"
|
|
|
+ icon="https://xiangli-erp.oss-cn-hangzhou.aliyuncs.com/APP/no-notifcations.png"
|
|
|
+ v-if="list.length == 0"
|
|
|
+ ></u-empty>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 状态 -->
|
|
|
+ <u-picker
|
|
|
+ :show="statusShow"
|
|
|
+ keyName="label"
|
|
|
+ :defaultIndex="defaultIndex2"
|
|
|
+ :columns="statusColumns"
|
|
|
+ @confirm="statusConfirm"
|
|
|
+ @cancel="statusShow = false"
|
|
|
+ ></u-picker>
|
|
|
+ <!-- 月份 -->
|
|
|
+ <u-picker
|
|
|
+ :show="dateShow"
|
|
|
+ :defaultIndex="defaultIndex3"
|
|
|
+ :columns="dateColumns"
|
|
|
+ @confirm="dateConfirm"
|
|
|
+ @cancel="dateShow = false"
|
|
|
+ ></u-picker>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import taskCard from "@/components/task-card/task-card.vue";
|
|
|
+import { mapGetters } from "vuex";
|
|
|
+import { reviewTaskList } from "@/common/request/apis/aduit.js";
|
|
|
+
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ taskCard,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ offsetTop: 0,
|
|
|
+ type1: "全部",
|
|
|
+ type2: "月份",
|
|
|
+ statusShow: false,
|
|
|
+ dateShow: false,
|
|
|
+ statusColumns: [
|
|
|
+ [
|
|
|
+ {
|
|
|
+ label: "全部",
|
|
|
+ id: "",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "待复核",
|
|
|
+ id: 6,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "复核通过",
|
|
|
+ id: 2,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "复核驳回",
|
|
|
+ id: 7,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ ],
|
|
|
+ dateColumns: [
|
|
|
+ [
|
|
|
+ "全年",
|
|
|
+ "一月",
|
|
|
+ "二月",
|
|
|
+ "三月",
|
|
|
+ "四月",
|
|
|
+ "五月",
|
|
|
+ "六月",
|
|
|
+ "七月",
|
|
|
+ "八月",
|
|
|
+ "九月",
|
|
|
+ "十月",
|
|
|
+ "十一月",
|
|
|
+ "十二月",
|
|
|
+ ],
|
|
|
+ ],
|
|
|
+ defaultIndex2: [],
|
|
|
+ defaultIndex3: [],
|
|
|
+
|
|
|
+ taskColumns: [
|
|
|
+ {
|
|
|
+ title: "单据编号",
|
|
|
+ key: "number",
|
|
|
+ titleStyle: {
|
|
|
+ color: "#333",
|
|
|
+ fontSize: "28rpx",
|
|
|
+ fontWeight: 500,
|
|
|
+ },
|
|
|
+ valueStyle: {
|
|
|
+ color: "#333",
|
|
|
+ fontSize: "28rpx",
|
|
|
+ fontWeight: 500,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "供应商名称",
|
|
|
+ key: "supplierName",
|
|
|
+ isShow(key, formData, col) {
|
|
|
+ return formData.type == "采购订单";
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "客户名称",
|
|
|
+ key: "supplierName",
|
|
|
+ isShow(key, formData, col) {
|
|
|
+ return formData.type == "销售订单";
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "单据日期",
|
|
|
+ key: "createTime",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "类别",
|
|
|
+ key: "type",
|
|
|
+ span: 12,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "入库人",
|
|
|
+ key: "operName",
|
|
|
+ span: 12,
|
|
|
+ isShow(key, formData, col) {
|
|
|
+ return formData.type == "采购订单";
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "出库人",
|
|
|
+ key: "operName",
|
|
|
+ span: 12,
|
|
|
+ isShow(key, formData, col) {
|
|
|
+ return formData.type == "销售订单";
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "货物总数",
|
|
|
+ key: "goodsQuantity",
|
|
|
+ span: 12,
|
|
|
+ valueStyle: {
|
|
|
+ color: "#0256ff",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "货物种类",
|
|
|
+ key: "goodsTypeCount",
|
|
|
+ span: 12,
|
|
|
+ valueStyle: {
|
|
|
+ color: "#0256ff",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ list: [],
|
|
|
+ currentPage: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ query: {
|
|
|
+ beginTime: "",
|
|
|
+ endTime: "",
|
|
|
+ number: "",
|
|
|
+ status: "",
|
|
|
+ },
|
|
|
+ loadStatus: "loadmore", //加载前值为loadmore,加载中为loading,没有数据为nomore
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(["depotInfo"]),
|
|
|
+ curDepotId() {
|
|
|
+ return this.depotInfo ? this.depotInfo.id : "";
|
|
|
+ },
|
|
|
+ curDepotName() {
|
|
|
+ return this.depotInfo ? this.depotInfo.depotName : "";
|
|
|
+ },
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ let systemInfo = uni.getSystemInfoSync();
|
|
|
+ let statusBarHeight = systemInfo.statusBarHeight;
|
|
|
+ this.offsetTop = statusBarHeight + 40;
|
|
|
+ this.loadData();
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ uni.$on("scanFinish", (data) => {
|
|
|
+ this.query.number = data;
|
|
|
+ this.loadData(true);
|
|
|
+ });
|
|
|
+ if (uni.getStorageSync("auditTaskRefresh")) {
|
|
|
+ this.loadData(true);
|
|
|
+ uni.removeStorageSync("auditTaskRefresh");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onHide() {
|
|
|
+ uni.$off("scanFinish");
|
|
|
+ },
|
|
|
+ onUnload() {
|
|
|
+ uni.$off("scanFinish");
|
|
|
+ },
|
|
|
+ onPullDownRefresh() {
|
|
|
+ // 下拉刷新
|
|
|
+ this.onRefresh();
|
|
|
+ },
|
|
|
+ onReachBottom() {
|
|
|
+ // 触底加载更多
|
|
|
+ this.onLoadMore();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ scanCode() {
|
|
|
+ this.$scan.scanCode();
|
|
|
+ },
|
|
|
+ async onLoadMore() {
|
|
|
+ if (this.loadStatus !== "loadmore") return;
|
|
|
+ this.loadStatus = "loading";
|
|
|
+ try {
|
|
|
+ await this.loadData();
|
|
|
+ } catch (e) {
|
|
|
+ this.loadStatus = "loadmore";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async onRefresh() {
|
|
|
+ try {
|
|
|
+ await this.loadData(true);
|
|
|
+ } finally {
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async loadData(isRefresh = false) {
|
|
|
+ if (isRefresh) {
|
|
|
+ this.currentPage = 1;
|
|
|
+ this.list = [];
|
|
|
+ }
|
|
|
+
|
|
|
+ try {
|
|
|
+ this.loadStatus = "loading";
|
|
|
+ const currentPage = this.currentPage;
|
|
|
+ const pageSize = this.pageSize;
|
|
|
+ const params = {
|
|
|
+ currentPage,
|
|
|
+ pageSize,
|
|
|
+ ...this.query,
|
|
|
+ depotId: this.curDepotId,
|
|
|
+ };
|
|
|
+ console.log("params=====", params);
|
|
|
+ const res = await reviewTaskList(params);
|
|
|
+ const { rows, total } = res.data;
|
|
|
+ console.log("res====", res);
|
|
|
+ this.list = [...this.list, ...rows];
|
|
|
+ if (currentPage * pageSize < Number(total)) {
|
|
|
+ this.currentPage++;
|
|
|
+ this.loadStatus = "loadmore";
|
|
|
+ } else {
|
|
|
+ this.loadStatus = "nomore";
|
|
|
+ }
|
|
|
+ } catch (error) {}
|
|
|
+ },
|
|
|
+ searchClick() {
|
|
|
+ this.loadData(true);
|
|
|
+ },
|
|
|
+ tabClick(type) {
|
|
|
+ switch (type) {
|
|
|
+ case 1:
|
|
|
+ this.statusShow = true;
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ this.dateShow = true;
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ statusConfirm(val) {
|
|
|
+ this.type1 = val.value[0].label;
|
|
|
+ this.query.status = val.value[0].id;
|
|
|
+ this.statusShow = false;
|
|
|
+ this.loadData(true);
|
|
|
+ },
|
|
|
+ dateConfirm(val) {
|
|
|
+ this.type2 = val.value[0];
|
|
|
+ this.dateShow = false;
|
|
|
+ let month = val.indexs[0];
|
|
|
+ this.getLastDayOfMonth(month);
|
|
|
+ this.loadData(true);
|
|
|
+ },
|
|
|
+ // 获取开始时间、结束时间
|
|
|
+ getLastDayOfMonth(month) {
|
|
|
+ let year = new Date().getFullYear();
|
|
|
+ if (month != 0) {
|
|
|
+ let monthStart = new Date(year, month, 0).getDate();
|
|
|
+ this.query.beginTime = `${year}-${month}-01`;
|
|
|
+ this.query.endTime = `${year}-${month}-${monthStart}`;
|
|
|
+ } else {
|
|
|
+ this.query.beginTime = "";
|
|
|
+ this.query.endTime = "";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleClickField(key, itemData) {
|
|
|
+ console.log("key===", key);
|
|
|
+ console.log("itemData===", itemData);
|
|
|
+ this.toDetail(itemData);
|
|
|
+ },
|
|
|
+ // 审核
|
|
|
+ toAudit(val) {
|
|
|
+ const type = val.type;
|
|
|
+ switch (type) {
|
|
|
+ case "采购订单":
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/purchase/detail?id=${val.id}&auditState=1`,
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case "销售订单":
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/picking-task/detail?id=${val.id}&auditState=1`,
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ toDetail(val) {
|
|
|
+ const type = val.type;
|
|
|
+ switch (type) {
|
|
|
+ case "采购订单":
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/purchase/detail?id=${val.id}`,
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case "销售订单":
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/picking-task/detail?id=${val.id}`,
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.picking-task-page {
|
|
|
+ min-height: 100vh;
|
|
|
+ background: #f0f6fb;
|
|
|
+ .container_main {
|
|
|
+ .search-box {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 32rpx;
|
|
|
+ .scan-text {
|
|
|
+ color: #333;
|
|
|
+ font-family: "PingFang SC";
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ margin-right: 20rpx;
|
|
|
+ margin-left: 30rpx;
|
|
|
+ }
|
|
|
+ .scan-icon {
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 50%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ image {
|
|
|
+ width: 24rpx;
|
|
|
+ height: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .type-box {
|
|
|
+ .type-item {
|
|
|
+ width: 50%;
|
|
|
+ height: 88rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ .type-val {
|
|
|
+ color: #000;
|
|
|
+ font-family: "PingFang SC";
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .task-cont {
|
|
|
+ padding: 0 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.action-box {
|
|
|
+ padding-bottom: 24rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.action-left-box {
|
|
|
+ display: inline-flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #666;
|
|
|
+ font-family: "PingFang SC";
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+}
|
|
|
+.task-bottom {
|
|
|
+ flex: 1;
|
|
|
+ display: inline-flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+ .btn {
|
|
|
+ width: 144rpx;
|
|
|
+ height: 56rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ line-height: 56rpx;
|
|
|
+ text-align: center;
|
|
|
+ margin-left: 12rpx;
|
|
|
+ font-family: "PingFang SC";
|
|
|
+ }
|
|
|
+ .btn-1 {
|
|
|
+ background: #0256ff;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .btn-2 {
|
|
|
+ border: 1px solid #0256ff;
|
|
|
+ background: rgba(2, 86, 255, 0.2);
|
|
|
+ color: #0256ff;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|