添加滑条

快乐的昕的电脑

2025-10-09 274cafb66b543b8d3cfe651c3c7783dd3d3a01b5

添加滑条

 components/mold.vue

@@ -12,6 +12,16 @@
            <view class="form-cell">
                <label class="form-label">设置使用上限：</label>
                <input class="input" type="number" v-model="useLimitInput" placeholder="每次换刀后手填" :disabled="!selectedToolNo" />
                <!-- 滑条控件 -->
                <input type="range"
                       min="0"
                       max="10000"
                       step="1"
                       v-model="useLimitInput"
                       :disabled="!selectedToolNo"
                       class="slider"
                       style="width: 160px; margin: 0 8px;" />
                <span style="min-width: 50px; display: inline-block;">{{ useLimitInput }}</span>
                <button class="btn-blue" @click="setUseLimit" :disabled="!selectedToolNo || !useLimitInput">保存上限</button>
            </view>
            <view class="form-cell">
@@ -104,9 +114,9 @@
    export default {
        data() {
            return {
                pageIndex: 1,
                pageSize: 20,
                total: 0,
                pageIndex: 1,
                pageSize: 20,
                total: 0,
                toolList: [],
                selectedToolNo: '',
                toolName: '',
@@ -121,50 +131,50 @@
                ]
            };
        },
        computed: {
            totalPages() {
                return Math.ceil(this.total / this.pageSize) || 1;
            }
        },
        computed: {
            totalPages() {
                return Math.ceil(this.total / this.pageSize) || 1;
            }
        },
        methods: {
            async fetchTools(searchKey) {
                const res = await this.$post({
                    url: '/MesCutterLedger/QueryTools',
                    data: JSON.stringify({
                        searchKey,
                        pageIndex: this.pageIndex,
                        pageSize: this.pageSize
                    }),
                    headers: { 'Content-Type': 'application/json' }
                });
                if (res.status === 0) {
                    this.filteredTools = res.data.tbBillList.map(t => ({
                        no: t.cutterId || t.no,
                        name: t.cutterName || t.name,
                        model: t.cutterModel || t.model
                    }));
                    this.total = res.data.total || 0; // 假设后端返回总数
                } else {
                    this.$showMessage(res.message || '查询失败');
                }
            async fetchTools(searchKey) {
                const res = await this.$post({
                    url: '/MesCutterLedger/QueryTools',
                    data: JSON.stringify({
                        searchKey,
                        pageIndex: this.pageIndex,
                        pageSize: this.pageSize
                    }),
                    headers: { 'Content-Type': 'application/json' }
                });
                if (res.status === 0) {
                    this.filteredTools = res.data.tbBillList.map(t => ({
                        no: t.cutterId || t.no,
                        name: t.cutterName || t.name,
                        model: t.cutterModel || t.model
                    }));
                    this.total = res.data.total || 0; // 假设后端返回总数
                } else {
                    this.$showMessage(res.message || '查询失败');
                }
            },
            //翻页
            async prevPage() {
                if (this.pageIndex > 1) {
                    this.pageIndex--;
                    await this.fetchTools(this.searchKey);
                }
            },
            async nextPage() {
                if (this.pageIndex < this.totalPages) {
                    this.pageIndex++;
                    await this.fetchTools(this.searchKey);
                }
            },
            async searchTool() {
                this.pageIndex = 1; // 搜索时重置到第一页
                await this.fetchTools(this.searchKey);
            },
            async prevPage() {
                if (this.pageIndex > 1) {
                    this.pageIndex--;
                    await this.fetchTools(this.searchKey);
                }
            },
            async nextPage() {
                if (this.pageIndex < this.totalPages) {
                    this.pageIndex++;
                    await this.fetchTools(this.searchKey);
                }
            },
            async searchTool() {
                this.pageIndex = 1; // 搜索时重置到第一页
                await this.fetchTools(this.searchKey);
            },
            selectTool(tool) {
                this.selectedToolNo = tool.no;
                this.toolName = tool.name;
@@ -337,4 +347,8 @@
    .tool-desc {
        margin-top: 2vh;
    }

    .slider {
        vertical-align: middle;
    }
</style>