From c7b4b9a2f4c0f05aeb60a9e3f5fba5d9a3676f3f Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期一, 18 八月 2025 16:22:42 +0800
Subject: [PATCH] 中强恒兴设备管理页面添加
---
src/views/equipmentManagement/brand/index.vue | 217 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 217 insertions(+), 0 deletions(-)
diff --git a/src/views/equipmentManagement/brand/index.vue b/src/views/equipmentManagement/brand/index.vue
new file mode 100644
index 0000000..6607cc8
--- /dev/null
+++ b/src/views/equipmentManagement/brand/index.vue
@@ -0,0 +1,217 @@
+<template>
+ <div class="app-container">
+ <el-form :model="filters" :inline="true">
+ <el-form-item label="鍝佺墝鍚嶇О/鍥藉">
+ <el-input
+ v-model="filters.name"
+ style="width: 240px"
+ placeholder="璇疯緭鍏ュ叧閿瘝"
+ clearable
+ prefix-icon="Search"
+ @change="getTableData"
+ />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="getTableData">鎼滅储</el-button>
+ <el-button @click="resetFilters">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+
+ <div class="table_list">
+ <div class="actions">
+ <div></div>
+ <div>
+ <el-button type="primary" @click="openAdd" icon="Plus"> 鏂板 </el-button>
+ <el-button
+ type="danger"
+ icon="Delete"
+ :disabled="multipleSelection.length <= 0"
+ @click="handleBatchDelete"
+ >鎵归噺鍒犻櫎</el-button>
+ </div>
+ </div>
+
+ <PIMTable
+ rowKey="id"
+ isSelection
+ :column="columns"
+ :tableData="dataList"
+ :page="{
+ current: pagination.currentPage,
+ size: pagination.pageSize,
+ total: pagination.total,
+ }"
+ @selection-change="handleSelectionChange"
+ @pagination="changePage"
+ >
+ </PIMTable>
+ </div>
+
+ <el-dialog v-model="visible" :title="dialogTitle" width="520px" destroy-on-close>
+ <el-form :model="form" ref="formRef" :rules="rules" label-width="90px">
+ <el-form-item label="鍝佺墝鍚嶇О" prop="name">
+ <el-input v-model="form.name" placeholder="璇疯緭鍏ュ搧鐗屽悕绉�" />
+ </el-form-item>
+ <el-form-item label="鎵�灞炲浗瀹�" prop="country">
+ <el-input v-model="form.country" placeholder="璇疯緭鍏ュ浗瀹�/鍦板尯" />
+ </el-form-item>
+ <el-form-item label="鎻忚堪" prop="description">
+ <el-input v-model="form.description" type="textarea" :rows="3" placeholder="鍙～鍐欏搧鐗岀畝浠�" />
+ </el-form-item>
+ </el-form>
+ <template #footer>
+ <el-button @click="visible = false">鍙栨秷</el-button>
+ <el-button type="primary" @click="handleSubmit">纭畾</el-button>
+ </template>
+ </el-dialog>
+ </div>
+
+</template>
+
+<script setup>
+import { ref, getCurrentInstance, onMounted } from 'vue'
+import { ElMessageBox, ElMessage } from 'element-plus'
+import { usePaginationApi } from '@/hooks/usePaginationApi'
+import { getBrandPage, addBrand, editBrand, delBrand } from '@/api/equipmentManagement/brand'
+
+defineOptions({ name: '璁惧鍝佺墝绠＄悊' })
+
+const { proxy } = getCurrentInstance()
+
+const multipleSelection = ref([])
+const formRef = ref()
+const visible = ref(false)
+const dialogTitle = ref('鏂板鍝佺墝')
+const form = ref({ id: undefined, name: '', country: '', description: '' })
+
+const rules = {
+ name: [{ required: true, message: '璇疯緭鍏ュ搧鐗屽悕绉�', trigger: 'blur' }],
+ country: [{ required: true, message: '璇疯緭鍏ユ墍灞炲浗瀹�', trigger: 'blur' }]
+}
+
+const {
+ filters,
+ columns,
+ dataList,
+ pagination,
+ getTableData,
+ resetFilters,
+ onCurrentChange,
+} = usePaginationApi(
+ getBrandPage,
+ { name: undefined },
+ [
+ { label: '鍝佺墝鍚嶇О', align: 'center', prop: 'name' },
+ { label: '鎵�灞炲浗瀹�', align: 'center', prop: 'country' },
+ { label: '鎻忚堪', align: 'center', prop: 'description' },
+ { label: '鍒涘缓鏃堕棿', align: 'center', prop: 'createdAt' },
+ {
+ dataType: 'action',
+ label: '鎿嶄綔',
+ align: 'center',
+ fixed: 'right',
+ width: 140,
+ operation: [
+ {
+ name: '缂栬緫',
+ type: 'text',
+ clickFun: (row) => openEdit(row),
+ },
+ {
+ name: '鍒犻櫎',
+ type: 'text',
+ clickFun: (row) => handleDelete(row.id),
+ }
+ ]
+ }
+ ]
+)
+
+const handleSelectionChange = (list) => {
+ multipleSelection.value = list
+}
+
+const changePage = ({ page, limit }) => {
+ pagination.currentPage = page
+ pagination.pageSize = limit
+ onCurrentChange(page)
+}
+
+function resetForm() {
+ form.value = { id: undefined, name: '', country: '', description: '' }
+}
+
+function openAdd() {
+ resetForm()
+ dialogTitle.value = '鏂板鍝佺墝'
+ visible.value = true
+}
+
+function openEdit(row) {
+ form.value = { id: row.id, name: row.name, country: row.country, description: row.description }
+ dialogTitle.value = '缂栬緫鍝佺墝'
+ visible.value = true
+}
+
+function handleSubmit() {
+ formRef.value.validate(async (valid) => {
+ if (!valid) return
+ const isEdit = Boolean(form.value.id)
+ const api = isEdit ? editBrand : addBrand
+ const { code, msg } = await api({ ...form.value })
+ if (code === 200) {
+ ElMessage.success(isEdit ? '淇敼鎴愬姛' : '鏂板鎴愬姛')
+ visible.value = false
+ getTableData()
+ } else {
+ ElMessage.error(msg || '鎿嶄綔澶辫触')
+ }
+ })
+}
+
+function handleDelete(id) {
+ ElMessageBox.confirm('姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ュ搧鐗�, 鏄惁缁х画?', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning',
+ }).then(async () => {
+ const { code } = await delBrand(id)
+ if (code === 200) {
+ ElMessage.success('鍒犻櫎鎴愬姛')
+ getTableData()
+ }
+ })
+}
+
+function handleBatchDelete() {
+ if (multipleSelection.value.length === 0) return
+ ElMessageBox.confirm('灏嗗垹闄ら�変腑鐨勫搧鐗岋紝鏄惁缁х画锛�', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning',
+ }).then(async () => {
+ const ids = multipleSelection.value.map((i) => i.id)
+ const { code } = await delBrand(ids)
+ if (code === 200) {
+ ElMessage.success('鍒犻櫎鎴愬姛')
+ getTableData()
+ }
+ })
+}
+
+onMounted(() => {
+ getTableData()
+})
+
+</script>
+
+<style scoped lang="scss">
+.table_list { margin-top: unset; }
+.actions {
+ display: flex;
+ justify-content: space-between;
+ margin-bottom: 10px;
+}
+</style>
+
+
--
Gitblit v1.9.3