xiamen-sb-uniapp/pages/receive/receive.vue

<template>
    <view>
        <my-add-button @handleClick="handleClick" />
        <!-- <view class="border-bottom">
            <u-tabs
                class="p-fixed left0 right0 zIndex"
                :list="list"
                :name="'label'"
                :is-scroll="false"
                :current="current"
                @change="change"
            ></u-tabs>
        </view> -->
        <common-tabs :list="list" :current="current" @change="change" />
        <view>

            <my-page
                :loadData="loadData"
                :swipe-action="true"
                :row-show-params="{statusMap: statusMap,statusValue: $DictCache.VALUE.SPARE_PICK_FORM_STATUS,
                                   statusColor: $DictCache.COLOR.SPARE_PICK_FORM_STATUS}"
                @rowClick="handleDetail"
                :page-size="10"
                ref="myPage"
            >
                <template #pageRow="{ recordModel,rowShowParams }">
                    <view
                        class="mx3 my2 p3 bg-color-white box p-relative"
                        @longpress="showMask(recordModel.id,$event)">
                        <common-mask :item="recordModel" :maskId="maskId" @hide="maskId = 0" @del="handleDel(recordModel)" />
                        <view class="d-flex j-between border-bottom pb-2 a-center">
                            <view class="text-color-b f-size-26">{{ recordModel.updateTime }}</view>
                            <my-badge
                                :text="rowShowParams.statusMap[recordModel.status]"
                                :status="rowShowParams.statusColor[recordModel.status]"
                            />
                        </view>
                        <view class="mt-2 d-flex j-between pr-3">
                            <view class="text-color-3 f-size-32 f-weight-bold">{{
                                recordModel.storeName
                            }}</view>
                            <view class="text-color-y f-size-32 f-weight-bold">{{
                                recordModel.totalPrice
                            }}</view>
                        </view>
                        <view class="mt-2 d-flex j-between">
                            <view class="f-size-26 text-color-6 f-weight-4 mt-2">
                                {{ recordModel.pickNo }}
                            </view>

                        </view>
                        <view class="d-flex j-end edit-box">
                            <view
                                class="text-color-3 f-size-32 edit"
                                v-if="recordModel.status === rowShowParams.statusValue.NOT_EXECUTE">
                                <view @click.stop="confirmHandle(recordModel)">提交</view>
                            </view>
                        </view>

                    </view>
                </template>
            </my-page>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            list: [],
            current: 0,
            statusMap: {},
            maskId: 0
        };
    },
    onPullDownRefresh() {
        this.$refs.myPage.pagePullDownRefresh();
    },
    onReachBottom() {
        this.$refs.myPage.pageReachBottom();
    },
    created() {
        const formStatusList = this.$DictCache.getChildrenList(this.$DictCache.TYPE.SPARE_PICK_FORM_STATUS);
        const statusList = [{ label: '全部', value: '' }]
        this.list = statusList.concat(formStatusList);
        this.statusMap = this.$DictCache.getLabelByValueMapByType(
            this.$DictCache.TYPE.SPARE_PICK_FORM_STATUS
        );
    },
    onShow() {
        this.$nextTick(() => {
            this.$refs.myPage.initPage();
        })
    },
    onLoad() {},
    onHide() {
        this.maskId = 0
    },
    methods: {
        showMask(id, e) {
            this.maskId = id
            // #ifdef H5
            e.preventDefault()
            // #endif
        },
        // tab
        change(index, e) {
            this.current = index;
            this.$refs.myPage.initPage();
        },
        // 删除
        handleDel(recordModel) {
            const that = this
            const params = []
            params.push(recordModel.id)
            uni.showModal({
                title: '提示',
                content: '您确认删除吗?',
                success: (res) => {
                    if (res.confirm) {
                        this.$Http.deleteSparePickForms(params).then(res => {
                            uni.showToast({ title: '删除成功' })
                            that.$refs.myPage.listData = []
                            that.$refs.myPage.loadMore = true
                            that.$refs.myPage.pageNum = 1
                            that.$refs.myPage.initPage();
                        })
                    } else if (res.cancel) { }
                }
            });
        },
        loadData(parameter) {
            // filter: 1,
            // status: this.list[this.current].value
            return this.$Http
                .getSparePickFormPage({
                    ...parameter,
                    status: this.list[this.current].value,
                    dataScope: {
                        sortBy: 'desc',
                        sortName: 'update_time'
                    }
                })
                .then(res => {
                    const data = res.data;
                    if (this.$BaseTool.Object.isNotBlank(data)) {
                        const rows = data.rows;
                        if (this.$BaseTool.Object.isNotBlank(rows) && rows.length > 0) {
                            rows.forEach(item => {
                                item.totalPrice = this.$BaseTool.Amount.formatter(item.totalPrice);
                            })
                        }
                    }
                    return res.data;
                })
        },
        confirmHandle(item) {
            const that = this;
            uni.showModal({
                title: '提示',
                content: '确认提交到仓库？',
                success: function (res) {
                    if (res.confirm) {
                        that.$Http.updateToOutStore(item).then((res) => {
                            that.page = 1;
                            that.loadMore = true;
                            that.listData = [];
                            that.$refs.myPage.initPage();
                        });
                    }
                }
            });
        },
        handleClick() {
            uni.navigateTo({
                url: '/pages/receive/receive-add-new'
            });
        },
        // 跳转详情
        handleDetail(recordModel) {
            if (this.maskId != 0) return this.maskId = 0
            uni.navigateTo({
                url: '/pages/receive/receive-detail?id=' + recordModel.id
            });
        }
    }
};
</script>

<style lang="less">
page {
    background-color: #f4f4f4;
}

.box {
    border-radius: 20rpx;
    padding-right: 0;
}
.edit-box {
  padding: 0 30rpx;
  margin-top: 40rpx;

  .edit {
    padding: 8rpx 40rpx;
    border: 1px solid #ddd;
    border-radius: 20rpx;
    font-size: 26rpx;
    color: #666;
    margin-left: 30rpx;
  }
}
</style>