From 86b9a84a095a86f920681f69f6ee10e5553b9886 Mon Sep 17 00:00:00 2001
From: 32189 <3218665834@qq.com>
Date: Fri, 3 Mar 2023 19:56:33 +0800
Subject: [PATCH] =?UTF-8?q?:tada:=20=E6=A8=A1=E5=9E=8B=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E6=89=B9=E9=87=8F=E5=88=A0=E9=99=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/oa/model.ts          |   9 +-
 src/views/oa/model/form.vue  | 201 ++++++++++++++++++++---------------
 src/views/oa/model/index.vue | 162 ++++++++++++++--------------
 3 files changed, 203 insertions(+), 169 deletions(-)

diff --git a/src/api/oa/model.ts b/src/api/oa/model.ts
index 4de5bd3e..feee03f5 100644
--- a/src/api/oa/model.ts
+++ b/src/api/oa/model.ts
@@ -8,10 +8,11 @@ export function fetchList(query) {
   })
 }
 
-export function delObj(id) {
+export function delObj(ids:Object) {
   return request({
-    url: '/admin/model/' + id,
-    method: 'delete'
+    url: '/admin/model',
+    method: 'delete',
+    data: ids
   })
 }
 
@@ -22,7 +23,7 @@ export function deploy(id) {
   })
 }
 
-export function addObj(obj) {
+export function addObj(obj?: Object) {
   return request({
     url: '/admin/model/insert',
     method: 'post',
diff --git a/src/views/oa/model/form.vue b/src/views/oa/model/form.vue
index c520ab57..8a5f1172 100644
--- a/src/views/oa/model/form.vue
+++ b/src/views/oa/model/form.vue
@@ -1,105 +1,134 @@
 <template>
-  <el-dialog :title="form.id ? $t('common.editBtn') : $t('common.addBtn')" v-model="visible" :close-on-click-modal="false"
-    draggable>
-    <el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="90px">
-      <el-row :gutter="35">
-        <el-col :span="24" class="mb20">
-          <el-form-item :label="$t('model.name')" prop="name">
-            <el-input v-model="form.name" :placeholder="$t('model.inputNameTip')" clearable></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="24" class="mb20">
-          <el-form-item :label="$t('model.key')" prop="key">
-            <el-input v-model="form.key" :placeholder="$t('model.inputKeyTip')" clearable />
-          </el-form-item>
-        </el-col>
-        <el-col :span="24" class="mb20">
-          <el-form-item :label="$t('model.category')" prop="category">
-            <el-input v-model="form.category" :placeholder="$t('model.inputCategoryTip')" clearable />
-          </el-form-item>
-        </el-col>
-      </el-row>
-    </el-form>
-    <template #footer>
+    <el-dialog :close-on-click-modal="false" :title="form.id ? $t('common.editBtn') : $t('common.addBtn')"
+               draggable
+               v-model="visible">
+        <el-form :model="form" :rules="dataRules" label-width="90px" ref="dataFormRef" v-loading="loading">
+            <el-row :gutter="35">
+                <el-col :span="24" class="mb20">
+                    <el-form-item :label="$t('model.name')" prop="name">
+                        <el-input :placeholder="$t('model.inputNameTip')" clearable v-model="form.name"></el-input>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="24" class="mb20">
+                    <el-form-item :label="$t('model.key')" prop="key">
+                        <el-input :placeholder="$t('model.inputKeyTip')" clearable v-model="form.key"/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="24" class="mb20">
+                    <el-form-item :label="$t('model.category')" prop="category">
+                        <el-input :placeholder="$t('model.inputCategoryTip')" clearable v-model="form.category"/>
+                    </el-form-item>
+                </el-col>
+            </el-row>
+        </el-form>
+        <template #footer>
       <span class="dialog-footer">
         <el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
-        <el-button type="primary" @click="onSubmit">{{ $t('common.confirmButtonText') }}</el-button>
+        <el-button @click="onSubmit" type="primary">{{ $t('common.confirmButtonText') }}</el-button>
       </span>
-    </template>
-  </el-dialog>
+        </template>
+    </el-dialog>
 </template>
 
-<script setup lang="ts" name="systemRoleDialog">
-import { useMessage } from "/@/hooks/message"
-import { addObj } from "/@/api/oa/model";
-import { useI18n } from "vue-i18n"
+<script lang="ts" name="systemRoleDialog" setup>
+    import {useMessage} from "/@/hooks/message"
+    import {useI18n} from "vue-i18n"
+    import {addObj, getObj, putObj} from "/@/api/oa/model";
 
-const emit = defineEmits(['refresh']);
+    const emit = defineEmits(['refresh']);
 
-const { t } = useI18n();
+    const {t} = useI18n();
 
-// 定义变量内容
-const dataFormRef = ref();
-const visible = ref(false)
+    // 定义变量内容
+    const dataFormRef = ref();
+    const visible = ref(false)
+    const loading = ref(false)
 
-// 提交表单数据
-const form = reactive({
-  id: '',
-  key: '',
-  name: '',
-  category: ''
-});
+    // 提交表单数据
+    const form = reactive({
+        id: '',
+        key: '',
+        name: '',
+        category: '',
+        desc: 'vvv',
+    });
 
-// 定义校验规则
-const dataRules = ref(
-  {
-    key: [
-      { required: true, message: '模型表示不能为空', trigger: 'blur' },
-    ],
-    name: [
-      { required: true, message: '模型名称不能为空', trigger: 'blur' }
-    ],
-    category: [
-      { required: true, message: '模型分类不能为空', trigger: 'blur' }
-    ]
-  }
-)
+    // 定义校验规则
+    const dataRules = ref(
+        {
+            key: [
+                {required: true, message: '模型表示不能为空', trigger: 'blur'},
+            ],
+            name: [
+                {required: true, message: '模型名称不能为空', trigger: 'blur'}
+            ],
+            category: [
+                {required: true, message: '模型分类不能为空', trigger: 'blur'}
+            ]
+        }
+    )
 
-// 打开弹窗
-const openDialog = (id: string) => {
-  visible.value = true
-  form.id = ''
+    // 打开弹窗
+    const openDialog = (id: string) => {
+        visible.value = true
+        form.id = ''
 
-  // 重置表单数据
-  if (dataFormRef.value) {
-    dataFormRef.value.resetFields()
-  }
+        // 重置表单数据
+        if (dataFormRef.value) {
+            dataFormRef.value.resetFields()
+        }
 
-  if (id) {
-    form.id = id
-  }
-};
-
-// 提交
-const onSubmit = () => {
-  dataFormRef.value.validate((valid: boolean) => {
-    if (!valid) {
-      return false
+        if (id) {
+            form.id = id
+            getModelData(id);
+        }
+    };
+    const getModelData = (id: string) => {
+        // 获取数据
+        loading.value = true
+        getObj(id).then((res: any) => {
+            Object.assign(form, res.data)
+        }).finally(() => {
+            loading.value = false
+        })
     }
 
-    addObj(form).then(() => {
-      useMessage().success(t('common.addSuccessText'))
-      visible.value = false // 关闭弹窗
-      emit('refresh')
-    }).catch((err: any) => {
-      useMessage().error(err.msg)
-    })
-  })
-};
+    // 提交
+    const onSubmit = () => {
+        dataFormRef.value.validate((valid: boolean) => {
+            if (!valid) {
+                return false
+            }
+            // 更新
+            if (form.id) {
+                loading.value = true
+                putObj(form).then(() => {
+                    useMessage().success(t('common.editSuccessText'))
+                    visible.value = false // 关闭弹窗
+                    emit('refresh')
+                }).catch((err: any) => {
+                    useMessage().error(err.msg)
+                }).finally(() => {
+                    loading.value = false
+                })
+            } else {
+                loading.value = true
+                addObj(form).then(() => {
+                    useMessage().success(t('common.addSuccessText'))
+                    visible.value = false // 关闭弹窗
+                    emit('refresh')
+                }).catch((err: any) => {
+                    useMessage().error(err.msg)
+                }).finally(() => {
+                    loading.value = false
+                })
+            }
+        })
+    };
 
 
-// 暴露变量
-defineExpose({
-  openDialog,
-});
+    // 暴露变量
+    defineExpose({
+        openDialog,
+    });
 </script>
diff --git a/src/views/oa/model/index.vue b/src/views/oa/model/index.vue
index 562928aa..4d248f49 100644
--- a/src/views/oa/model/index.vue
+++ b/src/views/oa/model/index.vue
@@ -5,7 +5,7 @@
                 <el-form :inline="true" :model="state.queryForm" @keyup.enter="getDataList" ref="queryRef">
                     <el-form-item :label="$t('model.category')" prop="category">
                         <el-input :placeholder="$t('model.inputCategoryTip')" style="max-width: 180px"
-                            v-model="state.queryForm.category" />
+                                  v-model="state.queryForm.category"/>
                     </el-form-item>
                     <el-form-item class="ml2">
                         <el-button @click="getDataList" icon="search" type="primary">
@@ -18,125 +18,129 @@
             <el-row>
                 <div class="mb8" style="width: 100%">
                     <el-button @click="formDialogRef.openDialog()" class="ml10" icon="folder-add" type="primary"
-                        v-auth="'app_approle_add'">
+                               v-auth="'oa_model_add'">
                         {{ $t('common.addBtn') }}
                     </el-button>
                     <el-button :disabled="multiple" @click="handleDelete(selectObjs)" class="ml10" icon="Delete"
-                        type="primary" v-auth="'app_approle_del'">
+                               type="primary" v-auth="'oa_model_del'">
                         {{ $t('common.delBtn') }}
                     </el-button>
                     <right-toolbar @queryTable="getDataList" class="ml10" style="float: right;margin-right: 20px"
-                        v-model:showSearch="showSearch"></right-toolbar>
+                                   v-model:showSearch="showSearch"></right-toolbar>
                 </div>
             </el-row>
             <el-table :data="state.dataList" @selection-change="handleSelectionChange" style="width: 100%"
-                v-loading="state.loading">
-                <el-table-column align="center" type="selection" width="50" />
-                <el-table-column :label="$t('model.index')" type="index" width="80" />
+                      v-loading="state.loading">
+                <el-table-column align="center" type="selection" width="50"/>
+                <el-table-column :label="$t('model.index')" type="index" width="80"/>
                 <el-table-column :label="$t('model.name')" prop="name" show-overflow-tooltip></el-table-column>
                 <el-table-column :label="$t('model.key')" prop="key" show-overflow-tooltip></el-table-column>
                 <el-table-column :label="$t('model.category')" prop="category" show-overflow-tooltip></el-table-column>
                 <el-table-column :label="$t('model.version')" prop="version" show-overflow-tooltip></el-table-column>
-                <el-table-column :label="$t('model.createTime')" prop="createTime" show-overflow-tooltip></el-table-column>
+                <el-table-column :label="$t('model.createTime')" prop="createTime"
+                                 show-overflow-tooltip></el-table-column>
                 <el-table-column :label="$t('model.lastUpdateTime')" prop="lastUpdateTime"
-                    show-overflow-tooltip></el-table-column>
+                                 show-overflow-tooltip></el-table-column>
                 <el-table-column :label="$t('common.action')" width="200">
                     <template #default="scope">
                         <el-button @click="handleView(scope.row.id)" text type="primary" v-auth="'app_approle_edit'">模型图
                         </el-button>
-                        <el-button @click="handleDeploy(scope.row.id)" text type="primary" v-auth="'app_approle_edit'">部署
+                        <el-button @click="handleDeploy(scope.row.id)" text type="primary" v-auth="'app_approle_edit'">
+                            部署
                         </el-button>
                         <el-button @click="handleDelete([scope.row.roleId])" text type="primary"
-                            v-auth="'app_approle_del'">{{
-                                $t('common.delBtn')
+                                   v-auth="'app_approle_del'">{{
+                            $t('common.delBtn')
                             }}
                         </el-button>
                     </template>
                 </el-table-column>
             </el-table>
-            <pagination @current-change="currentChangeHandle" @size-change="sizeChangeHandle" v-bind="state.pagination" />
+            <pagination @current-change="currentChangeHandle" @size-change="sizeChangeHandle"
+                        v-bind="state.pagination"/>
         </el-card>
 
-        <form-dialog @refresh="getDataList()" ref="formDialogRef" />
+        <form-dialog @refresh="getDataList()" ref="formDialogRef"/>
     </div>
 </template>
 
 <script lang="ts" name="model" setup>
-import { BasicTableProps, useTable } from "/@/hooks/table";
-import { delObj, deploy, fetchList } from "/@/api/oa/model";
-import { useMessage, useMessageBox } from "/@/hooks/message";
-import { useI18n } from "vue-i18n";
+    import {BasicTableProps, useTable} from "/@/hooks/table";
+    import {delObj, deploy, fetchList} from "/@/api/oa/model";
+    import {useMessage, useMessageBox} from "/@/hooks/message";
+    import {useI18n} from "vue-i18n";
 
-// 引入组件
-const FormDialog = defineAsyncComponent(() => import('./form.vue'));
-const { t } = useI18n()
-const router = useRouter()
+    // 引入组件
+    const FormDialog = defineAsyncComponent(() => import('./form.vue'));
+    const {t} = useI18n()
+    const router = useRouter()
 
 
-// 定义变量内容
-const formDialogRef = ref()
-const queryRef = ref()
-const showSearch = ref(true)
-// 多选rows
-const selectObjs = ref([]) as any
+    // 定义变量内容
+    const formDialogRef = ref()
+    const queryRef = ref()
+    const showSearch = ref(true)
+    // 多选rows
+    const selectObjs = ref([]) as any
 
-// 是否可以多选
-const multiple = ref(true)
+    // 是否可以多选
+    const multiple = ref(true)
 
-const state: BasicTableProps = reactive<BasicTableProps>({
-    queryForm: {
-        category: ''
-    },
-    pageList: fetchList // H
-});
-
-//  table hook
-const {
-    getDataList,
-    currentChangeHandle,
-    sizeChangeHandle,
-} = useTable(state)
-
-// 清空搜索条件
-const resetQuery = () => {
-    queryRef.value.resetFields()
-    getDataList()
-}
-
-// 多选事件
-const handleSelectionChange = (objs: any) => {
-    selectObjs.value = []
-    objs.forEach((val: any) => {
-        selectObjs.value.push(val.roleId)
+    const state: BasicTableProps = reactive<BasicTableProps>({
+        queryForm: {
+            category: ''
+        },
+        pageList: fetchList // H
     });
-    multiple.value = !objs.length
-}
 
-// 删除操作
-const handleDelete = (ids: string[]) => {
-    useMessageBox().confirm(t('common.delConfirmText'))
-        .then(() => {
-            delObj(ids).then(() => {
-                getDataList();
-                useMessage().success(t('common.delSuccessText'));
-            }).catch((err: any) => {
-                useMessage().error(err.msg)
+    //  table hook
+    const {
+        getDataList,
+        currentChangeHandle,
+        sizeChangeHandle,
+    } = useTable(state)
+
+    // 清空搜索条件
+    const resetQuery = () => {
+        queryRef.value.resetFields()
+        getDataList()
+    }
+
+    // 多选事件
+    const handleSelectionChange = (objs: any) => {
+        selectObjs.value = []
+        console.log(objs)
+        objs.forEach((val: any) => {
+            selectObjs.value.push(val.id)
+        });
+        multiple.value = !objs.length
+    }
+
+    // 删除操作
+    const handleDelete = (ids: string[]) => {
+        useMessageBox().confirm(t('common.delConfirmText'))
+            .then(() => {
+                delObj(ids).then(() => {
+                    getDataList();
+                    useMessage().success(t('common.delSuccessText'));
+                }).catch((err: any) => {
+                    useMessage().error(err.msg)
+                })
             })
+    };
+
+    const handleDeploy = (id: string) => {
+        deploy(id).then(() => {
+            useMessage().success(t('common.optSuccessText'));
         })
-};
-
-const handleDeploy = (id: string) => {
-    deploy(id).then(() => {
-        useMessage().success(t('common.optSuccessText'));
-    })
-}
+    }
 
 
-const handleView = (id: string) => {
-    router.push({
-        path: "/oa/model/detail",
-        query: { id: id },
-    });
-}
+    const handleView = (id: string) => {
+        router.push({
+            path: "/oa/model/detail",
+            query: {id: id},
+        });
+    }
 
 </script>