|
@@ -1,10 +1,129 @@
|
|
|
<template>
|
|
|
+ <hc-card title="试验汇总分类配置">
|
|
|
+ <template #extra>
|
|
|
+ <el-button hc-btn type="primary" @click="addRowClick">新增</el-button>
|
|
|
+ </template>
|
|
|
+ <hc-table :column="tableColumn" :datas="tableData" :loading="tableLoading" :index-style="{ width: 60 }">
|
|
|
+ <template #action="{ row }">
|
|
|
+ <el-link type="primary" @click="editRowClick(row)">编辑</el-link>
|
|
|
+ <el-link type="warning">配置划分</el-link>
|
|
|
+ <el-link type="success">关联清表</el-link>
|
|
|
+ <el-link type="info">数据映射配置</el-link>
|
|
|
+ <el-link type="danger" @click="delRowClick(row)">删除</el-link>
|
|
|
+ </template>
|
|
|
+ </hc-table>
|
|
|
+ <template #action>
|
|
|
+ <hc-pages :pages="searchForm" @change="pageChange" />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <!-- 新增/修改 -->
|
|
|
+ <hc-dialog v-model="isRowInfoShow" widths="400px" is-footer-center :title="isNullES(formModel.id) ? '新增' : '修改'" @close="rowInfoClose">
|
|
|
+ <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" label-width="auto" size="large">
|
|
|
+ <el-form-item label="分类名称:" prop="className">
|
|
|
+ <el-input v-model="formModel.className" clearable placeholder="请输入分类名称" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <el-button hc-btn @click="rowInfoClose">取消</el-button>
|
|
|
+ <el-button hc-btn type="primary" :loading="rowInfoLoading" @click="rowInfoSubmit">提交</el-button>
|
|
|
+ </template>
|
|
|
+ </hc-dialog>
|
|
|
+ </hc-card>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
+import { onActivated, ref } from 'vue'
|
|
|
+import { deepClone, formValidate, getArrValue, isNullES } from 'js-fast-way'
|
|
|
+import mainApi from '~api/desk/test-collect'
|
|
|
+
|
|
|
+//激活
|
|
|
+onActivated(() => {
|
|
|
+ searchClick()
|
|
|
+})
|
|
|
+
|
|
|
+//搜索表单
|
|
|
+const searchForm = ref({ current: 1, size: 30, total: 0 })
|
|
|
+
|
|
|
+//搜索
|
|
|
+const searchClick = () => {
|
|
|
+ searchForm.value.current = 1
|
|
|
+ getTableData()
|
|
|
+}
|
|
|
+
|
|
|
+//分页
|
|
|
+const pageChange = ({ current, size }) => {
|
|
|
+ searchForm.value.current = current
|
|
|
+ searchForm.value.size = size
|
|
|
+ getTableData()
|
|
|
+}
|
|
|
+
|
|
|
+//表格数据
|
|
|
+const tableData = ref([])
|
|
|
+const tableColumn = ref([
|
|
|
+ { key: 'className', name: '分类名称' },
|
|
|
+ { key: 'action', name: '操作', width: 320, align: 'center' },
|
|
|
+])
|
|
|
+
|
|
|
+//获取表格数据
|
|
|
+const tableLoading = ref(false)
|
|
|
+const getTableData = async () => {
|
|
|
+ tableData.value = []
|
|
|
+ tableLoading.value = true
|
|
|
+ const { data } = await mainApi.page({
|
|
|
+ ...searchForm.value,
|
|
|
+ total: null,
|
|
|
+ })
|
|
|
+ tableLoading.value = false
|
|
|
+ tableData.value = getArrValue(data?.records)
|
|
|
+ searchForm.value.total = data?.total || 0
|
|
|
+}
|
|
|
+
|
|
|
+//新增
|
|
|
+const addRowClick = () => {
|
|
|
+ formModel.value = {}
|
|
|
+ isRowInfoShow.value = true
|
|
|
+}
|
|
|
+
|
|
|
+//编辑
|
|
|
+const editRowClick = (item) => {
|
|
|
+ formModel.value = deepClone(item)
|
|
|
+ isRowInfoShow.value = true
|
|
|
+}
|
|
|
+
|
|
|
+//新增编辑弹窗
|
|
|
+const isRowInfoShow = ref(false)
|
|
|
+const rowInfoLoading = ref(false)
|
|
|
+
|
|
|
+//表单
|
|
|
+const formRef = ref(null)
|
|
|
+const formModel = ref({})
|
|
|
+const formRules = { className: { required: true, trigger: 'blur', message: '请输入分类名称' } }
|
|
|
+
|
|
|
+//确认提交
|
|
|
+const rowInfoSubmit = async () => {
|
|
|
+ const isForm = await formValidate(formRef.value)
|
|
|
+ if (!isForm) return
|
|
|
+ rowInfoLoading.value = true
|
|
|
+ const { isRes } = await mainApi.submit(formModel.value)
|
|
|
+ rowInfoLoading.value = false
|
|
|
+ if (!isRes) return
|
|
|
+ window.$message.success('操作成功')
|
|
|
+ rowInfoClose()
|
|
|
+}
|
|
|
+
|
|
|
+//关闭表单
|
|
|
+const rowInfoClose = () => {
|
|
|
+ isRowInfoShow.value = false
|
|
|
+ rowInfoLoading.value = false
|
|
|
+ formModel.value = {}
|
|
|
+}
|
|
|
|
|
|
+//删除
|
|
|
+const delRowClick = (item) => {
|
|
|
+ console.log(item)
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
-<style scoped lang="scss">
|
|
|
+<style lang="scss">
|
|
|
|
|
|
</style>
|