zx_bms_uni/pages/deviceTransfer/deviceTransfer.vue

<template>
    <view class="container">
        <view class="content-container">
            <view class="shop-container">
                <view class="form-label">转移到</view>
                <view style="width: 100%" @tap="bindSelectShop">
                    <text v-if="selectedShop">{{ selectedShop.shop_name }}</text>
                    <text v-else style="color: #999">请选择转移用户</text>
                </view>
                <text class="btn-transfer" @tap="bindTransfer">转移</text>
            </view>
        </view>

        <view class="device-list-container">
            <view class="block-head">
                设备信息
                <text style="font-size: 24rpx">(共{{ devicelist.length }})</text>
            </view>
            <view class="table">
                <view class="tb-head">
                    <view class="tb-row">
                        <view class="tb-column col-1">电池编号</view>
                        <view class="tb-column col-2">型号</view>
                        <view class="tb-column col-3">操作</view>
                    </view>
                </view>
                <view class="tb-body">
                    <view class="tb-row" v-for="(item, index) in devicelist" :key="index">
                        <view class="tb-column col-1">{{ item.battery_sn }}</view>

                        <view class="tb-column col-2">{{ item.dev_name }}</view>

                        <view class="tb-column col-3">
                            <text class="del-btn" @tap="bindDelDevice" :data-index="index">删除</text>
                        </view>
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
// pages/deviceTransfer/deviceTransfer.js
var config = require('../../common/config.js');
var http = require('../../common/http.js');
var common = require('../../common/common.js');
var storage = require('../../common/storage.js');
export default {
    data() {
        return {
            devicelist: [],
            selectedShop: null
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
        storage.setSelectedShop(null);
        const devicelist = storage.getBatchSelectedDeviceList();
        if (!devicelist || devicelist.length === 0) {
            uni.navigateBack({
                delta: 1
            });
        }
        this.setData({
            devicelist: devicelist
        });
    },
    onShow: function () {
        const selectedShop = storage.getSelectedShop();
        this.setData({
            selectedShop: selectedShop
        });
    },
    methods: {
        bindSelectShop: function () {
            uni.navigateTo({
                url: '/pages/selectShop/selectShop'
            });
        },

        bindTransfer: function () {
            if (!this.selectedShop) {
                common.simpleToast('请选择转移用户');
                return;
            }
            let batteryList = [];
            this.devicelist.forEach((item) => {
                batteryList.push(item.battery_id);
            });
            const pData = {
                shop_id: this.selectedShop.shop_id,
                batteryList: JSON.stringify(batteryList)
            };
            http.postApi(config.API_BATTERY_TRANSFER, pData, function (resp) {
                if (resp.data.code === 200) {
                    storage.setRefreshDeviceoPage(true);
                    common.simpleToast('转移成功');
                    setTimeout(function () {
                        uni.navigateBack({
                            delta: 1
                        });
                    }, 1500);
                } else {
                    common.simpleToast(resp.data.msg);
                }
            });
        },

        bindDelDevice: function (e) {
            const index = e.currentTarget.dataset.index;
            let devicelist = [];
            this.devicelist.forEach((item, idx) => {
                if (idx != index) {
                    devicelist.push(item);
                }
            });
            this.setData({
                devicelist: devicelist
            });
        }
    }
};
</script>
<style>
@import './deviceTransfer.css';
</style>