From e0ff6131301c738e8bfd5101cef4d6a7466e4bdf Mon Sep 17 00:00:00 2001
From: zhujiyan <17812234322@163.com>
Date: Tue, 28 May 2024 16:04:02 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B5=81=E7=A8=8B=E7=AE=A1=E7=90=86=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E6=8E=92=E5=BA=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../system/bpm/category/categoryPopup.vue     | 132 +++++++-------
 src/views/system/bpm/category/index.vue       |   1 +
 src/views/system/bpm/form/editor/index.vue    |   9 +-
 src/views/system/bpm/form/index.vue           |   1 +
 src/views/system/bpm/model/modelPopup.vue     |   2 +-
 src/views/system/bpm/sign/index.vue           | 161 +++++++++---------
 src/views/system/bpm/sign/signPopup.vue       | 134 ++++++++-------
 7 files changed, 220 insertions(+), 220 deletions(-)

diff --git a/src/views/system/bpm/category/categoryPopup.vue b/src/views/system/bpm/category/categoryPopup.vue
index cb64afaa..c53965ce 100644
--- a/src/views/system/bpm/category/categoryPopup.vue
+++ b/src/views/system/bpm/category/categoryPopup.vue
@@ -1,36 +1,36 @@
 <!--模型分类的新增编辑弹出框-->
 <template>
-  <el-dialog
-      draggable
-      class='cn-operate-dialog'
-      v-model='machineVisible'
-      :title='title'
-      style='width: 415px; height: 350px'
-      top='30vh'
-  >
-    <el-scrollbar>
-      <el-form :inline='false' :model='form' label-width='120px' :rules='rules' ref='formRef'>
-        <el-form-item label='分类名称' prop='name'>
-          <el-input v-model='form.name' placeholder='请输入分类名' clearable />
-        </el-form-item>
-        <el-form-item label='分类标识' prop='code'>
-          <el-input v-model='form.code' placeholder='请输入分类标识' clearable />
-        </el-form-item>
-        <el-form-item label='分类描述' prop='description'>
-          <el-input v-model='form.description' placeholder='请输入分类描述' clearable type='textarea'>
-          </el-input>
-        </el-form-item>
-      </el-form>
-    </el-scrollbar>
-    <template #footer>
-            <span class='dialog-footer'>
-                <el-button @click='machineVisible = false'>取消</el-button>
-                <el-button type='primary' @click='submit'>确认</el-button>
+    <el-dialog draggable class="cn-operate-dialog" v-model="machineVisible" :title="title" width="40%">
+        <el-scrollbar>
+            <el-form :inline="false" :model="form" label-width="120px" :rules="rules" ref="formRef">
+                <el-form-item label="分类名称" prop="name">
+                    <el-input v-model="form.name" placeholder="请输入分类名" clearable />
+                </el-form-item>
+                <el-form-item label="分类标识" prop="code">
+                    <el-input v-model="form.code" placeholder="请输入分类标识" clearable />
+                </el-form-item>
+                <el-form-item label="分类描述" prop="description">
+                    <el-input
+                        v-model="form.description"
+                        placeholder="请输入分类描述"
+                        clearable
+                        type="textarea"
+                    ></el-input>
+                </el-form-item>
+                <el-form-item label="排序">
+                    <el-input-number style="width: 100%" v-model="form.sort" :min="0" placeholder="请输入排序" />
+                </el-form-item>
+            </el-form>
+        </el-scrollbar>
+        <template #footer>
+            <span class="dialog-footer">
+                <el-button @click="machineVisible = false">取消</el-button>
+                <el-button type="primary" @click="submit">确认</el-button>
             </span>
-    </template>
-  </el-dialog>
+        </template>
+    </el-dialog>
 </template>
-<script lang='ts' setup>
+<script lang="ts" setup>
 import { ref, reactive, inject } from 'vue'
 import { ElMessage } from 'element-plus'
 import TableStore from '@/utils/tableStore'
@@ -43,58 +43,60 @@ const formRef = ref()
 
 // 注意不要和表单ref的命名冲突
 const form = reactive({
-  id: '',
-  name: '',
-  code: '',
-  description: ''
+    id: '',
+    name: '',
+    code: '',
+    description: '',
+    sort: 100
 })
 
 //form表单校验规则
 const rules = {
-  name: [{ required: true, message: '分类名不能为空', trigger: 'blur' }],
-  code: [{ required: true, message: '分类标识不能为空', trigger: 'blur' }]
+    name: [{ required: true, message: '分类名不能为空', trigger: 'blur' }],
+    code: [{ required: true, message: '分类标识不能为空', trigger: 'blur' }]
 }
 
 const open = (text: string, data?: any) => {
-  title.value = text
-  if (data) {
-    // 表单赋值
-    for (let key in form) {
-      form[key] = data[key]
+    title.value = text
+    if (data) {
+        // 表单赋值
+        for (let key in form) {
+            form[key] = data[key]
+        }
+    } else {
+        resetForm()
+        // 在此处恢复默认表单
+        for (let key in form) {
+            form[key] = ''
+        }
+        form.sort=100
     }
-  } else {
-    resetForm()
-    // 在此处恢复默认表单
-    for (let key in form) {
-      form[key] = ''
-    }
-  }
-  machineVisible.value = true
+    machineVisible.value = true
 }
 
 //重置表单内容
 const resetForm = () => {
-  if (formRef.value) {
-    formRef.value.resetFields()
-  }
+    if (formRef.value) {
+        formRef.value.resetFields()
+    }
 }
 
 /**
  * 提交用户表单数据
  */
 const submit = () => {
-  formRef.value.validate(async (valid: any) => {
-    if (valid) {
-      if (form.id) {
-        await updateCategory(form)
-      } else {
-        await addCategory(form)
-      }
-      ElMessage.success('保存成功')
-      tableStore.index()
-      machineVisible.value = false
-    }
-  })
+    formRef.value.validate(async (valid: any) => {
+        if (valid) {
+            if (form.id) {
+                await updateCategory(form)
+            } else {
+                await addCategory(form)
+            }
+            ElMessage.success('保存成功')
+            tableStore.index()
+            machineVisible.value = false
+        }
+    })
 }
 
 defineExpose({ open })
@@ -102,10 +104,10 @@ defineExpose({ open })
 
 <style scoped>
 .el-upload-list__item {
-  transition: none !important;
+    transition: none !important;
 }
 
 .el-select {
-  min-width: 180px;
+    min-width: 180px;
 }
 </style>
diff --git a/src/views/system/bpm/category/index.vue b/src/views/system/bpm/category/index.vue
index eb3fc448..381fd845 100644
--- a/src/views/system/bpm/category/index.vue
+++ b/src/views/system/bpm/category/index.vue
@@ -49,6 +49,7 @@ const tableStore = new TableStore({
     { title: '分类标识', field: 'code', minWidth: 130 },
     { title: '分类描述', field: 'description', minWidth: 170 },
     { title: '创建时间', field: 'createTime', minWidth: 170 },
+    { title: '排序', field: 'sort', width: 170 },
     {
       title: '操作',
       align: 'center',
diff --git a/src/views/system/bpm/form/editor/index.vue b/src/views/system/bpm/form/editor/index.vue
index 6562734b..a472f4a1 100644
--- a/src/views/system/bpm/form/editor/index.vue
+++ b/src/views/system/bpm/form/editor/index.vue
@@ -13,8 +13,7 @@
     </content-wrap>
 
     <!-- 表单保存的弹窗 -->
-    <el-dialog v-model='dialogVisible' title='保存表单' class='cn-operate-dialog' style='width: 415px;height: 350px'
-               top='30vh'>
+    <el-dialog v-model='dialogVisible' title='保存表单' class='cn-operate-dialog' width="40%">
       <el-scrollbar>
         <el-form ref='formRef' :model='formData' :rules='formRules' label-width='80px'>
           <el-form-item label='表单名' prop='name'>
@@ -34,6 +33,9 @@
           <el-form-item label='备注' prop='remark'>
             <el-input v-model='formData.remark' placeholder='请输入备注' type='textarea' />
           </el-form-item>
+          <el-form-item label="排序">
+                    <el-input-number style="width: 100%" v-model="formData.sort" :min="0" placeholder="请输入排序" />
+          </el-form-item>
         </el-form>
       </el-scrollbar>
       <template #footer>
@@ -83,7 +85,8 @@ const formLoading = ref(false) // 表单的加载中：提交的按钮禁用
 const formData = ref({
   name: '',
   status: 1,
-  remark: ''
+  remark: '',
+  sort:100,
 })
 const formRules = reactive({
   name: [{ required: true, message: '表单名不能为空', trigger: 'blur' }],
diff --git a/src/views/system/bpm/form/index.vue b/src/views/system/bpm/form/index.vue
index a120dc35..67203068 100644
--- a/src/views/system/bpm/form/index.vue
+++ b/src/views/system/bpm/form/index.vue
@@ -64,6 +64,7 @@ const tableStore = new TableStore({
                 1: '开启',
             }
         },
+        { title: '排序', field: 'sort', width: 170 },
         {
             title: '操作',
             align: 'center',
diff --git a/src/views/system/bpm/model/modelPopup.vue b/src/views/system/bpm/model/modelPopup.vue
index 3f281e42..86748190 100644
--- a/src/views/system/bpm/model/modelPopup.vue
+++ b/src/views/system/bpm/model/modelPopup.vue
@@ -1,6 +1,6 @@
 <template>
     <el-dialog draggable class='cn-operate-dialog' v-model='dialogVisible' :title='title'
-               style='max-width: 450px;height: 450px'>
+            width="40%">
         <el-scrollbar>
             <el-form :inline='false' :model='formData' label-width='120px' :rules='rules' ref='formRef'>
 
diff --git a/src/views/system/bpm/sign/index.vue b/src/views/system/bpm/sign/index.vue
index 34946160..c63994bf 100644
--- a/src/views/system/bpm/sign/index.vue
+++ b/src/views/system/bpm/sign/index.vue
@@ -1,35 +1,27 @@
 <!--流程分类页面-->
 <template>
-  <div class='default-main'>
-    <TableHeader>
-      <template v-slot:select>
-        <el-form-item label='标识名称'>
-          <el-input
-              v-model='tableStore.table.params.name'
-              clearable
-              placeholder='请输入名称'
-          />
-        </el-form-item>
-        <el-form-item label='标识key'>
-          <el-input
-              v-model='tableStore.table.params.signKey'
-              clearable
-              placeholder='请输入key'
-          />
-        </el-form-item>
-      </template>
-      <template v-slot:operation>
-        <el-button type='primary' class='ml10' @click='add' :icon='Plus'>新增</el-button>
-      </template>
-    </TableHeader>
-    <!--表格-->
-    <Table ref='tableRef'></Table>
-    <!--弹出框-->
-    <sign-popup ref='signPopup' />
-  </div>
+    <div class="default-main">
+        <TableHeader>
+            <template v-slot:select>
+                <el-form-item label="标识名称">
+                    <el-input v-model="tableStore.table.params.name" clearable placeholder="请输入名称" />
+                </el-form-item>
+                <el-form-item label="标识key">
+                    <el-input v-model="tableStore.table.params.signKey" clearable placeholder="请输入key" />
+                </el-form-item>
+            </template>
+            <template v-slot:operation>
+                <el-button type="primary" class="ml10" @click="add" :icon="Plus">新增</el-button>
+            </template>
+        </TableHeader>
+        <!--表格-->
+        <Table ref="tableRef"></Table>
+        <!--弹出框-->
+        <sign-popup ref="signPopup" />
+    </div>
 </template>
 
-<script setup lang='ts'>
+<script setup lang="ts">
 import TableStore from '@/utils/tableStore'
 import Table from '@/components/table/index.vue'
 import TableHeader from '@/components/table/header/index.vue'
@@ -41,80 +33,79 @@ import SignPopup from '@/views/system/bpm/sign/signPopup.vue'
 import { deleteSign } from '@/api/bpm-boot/sign'
 
 defineOptions({
-  name: 'bpmSign'
+    name: 'bpmSign'
 })
 
 const { push } = useRouter()
 const signPopup = ref()
 
 const tableStore = new TableStore({
-  url: '/bpm-boot/bpmSign/list',
-  method: 'POST',
-  column: [
-    { title: '序号', type: 'seq', width: 80 },
-    { title: '标识名称', field: 'name', minWidth: 130 },
-    { title: '标识key', field: 'signKey', minWidth: 130 },
-    { title: '表单查看地址', field: 'viewPath', minWidth: 200 },
-    { title: '创建时间', field: 'createTime', minWidth: 170 },
-    {
-      title: '操作',
-      align: 'center',
-      minWidth: '150',
-      fixed: 'right',
-      render: 'buttons',
-      buttons: [
+    url: '/bpm-boot/bpmSign/list',
+    method: 'POST',
+    column: [
+        { title: '序号', type: 'seq', width: 80 },
+        { title: '标识名称', field: 'name', minWidth: 130 },
+        { title: '标识key', field: 'signKey', minWidth: 130 },
+        { title: '表单查看地址', field: 'viewPath', minWidth: 200 },
+        { title: '创建时间', field: 'createTime', minWidth: 170 },
+        { title: '排序', field: 'sort', width: 170 },
         {
-          name: 'update',
-          title: '编辑',
-          type: 'primary',
-          icon: 'el-icon-EditPen',
-          render: 'basicButton',
-          click: row => {
-            signPopup.value.open('修改流程标识', row)
-          }
-        },
-        {
-          name: 'update',
-          title: '删除',
-          type: 'danger',
-          icon: 'el-icon-Delete',
-          render: 'confirmButton',
-          popconfirm: {
-            confirmButtonText: '确认',
-            cancelButtonText: '取消',
-            confirmButtonType: 'danger',
-            title: '确定删除吗？'
-          },
-          click: row => {
-            deleteSign(row.id).then(res => {
-              ElMessage.success('删除成功')
-              tableStore.index()
-            })
-          }
+            title: '操作',
+            align: 'center',
+            minWidth: '150',
+            fixed: 'right',
+            render: 'buttons',
+            buttons: [
+                {
+                    name: 'update',
+                    title: '编辑',
+                    type: 'primary',
+                    icon: 'el-icon-EditPen',
+                    render: 'basicButton',
+                    click: row => {
+                        signPopup.value.open('修改流程标识', row)
+                    }
+                },
+                {
+                    name: 'update',
+                    title: '删除',
+                    type: 'danger',
+                    icon: 'el-icon-Delete',
+                    render: 'confirmButton',
+                    popconfirm: {
+                        confirmButtonText: '确认',
+                        cancelButtonText: '取消',
+                        confirmButtonType: 'danger',
+                        title: '确定删除吗？'
+                    },
+                    click: row => {
+                        deleteSign(row.id).then(res => {
+                            ElMessage.success('删除成功')
+                            tableStore.index()
+                        })
+                    }
+                }
+            ]
+        }
+    ],
+    beforeSearchFun: () => {
+        for (let key in tableStore.table.params) {
+            if (tableStore.table.params[key] === '') {
+                delete tableStore.table.params[key]
+            }
         }
-      ]
     }
-  ],
-  beforeSearchFun: () => {
-    for (let key in tableStore.table.params) {
-      if (tableStore.table.params[key] === '') {
-        delete tableStore.table.params[key]
-      }
-    }
-
-  }
 })
 
 onMounted(() => {
-  // 加载数据
-  tableStore.index()
+    // 加载数据
+    tableStore.index()
 })
 tableStore.table.params.name = ''
 tableStore.table.params.signKey = ''
 provide('tableStore', tableStore)
 
 const add = () => {
-  signPopup.value.open('新增流程标识')
+    signPopup.value.open('新增流程标识')
 }
-
 </script>
diff --git a/src/views/system/bpm/sign/signPopup.vue b/src/views/system/bpm/sign/signPopup.vue
index d784bc68..a580870c 100644
--- a/src/views/system/bpm/sign/signPopup.vue
+++ b/src/views/system/bpm/sign/signPopup.vue
@@ -1,36 +1,36 @@
 <!--模型分类的新增编辑弹出框-->
 <template>
-  <el-dialog
-      draggable
-      class='cn-operate-dialog'
-      v-model='machineVisible'
-      :title='title'
-      style='width: 415px; height: 350px'
-      top='30vh'
-  >
-    <el-scrollbar>
-      <el-form :inline='false' :model='form' label-width='120px' :rules='rules' ref='formRef'>
-        <el-form-item label='标识名称' prop='name'>
-          <el-input v-model='form.name' placeholder='请输入标识名' clearable />
-        </el-form-item>
-        <el-form-item label='分类key' prop='signKey'>
-          <el-input v-model='form.signKey' placeholder='请输入标识key' clearable />
-        </el-form-item>
-        <el-form-item label='查看表单路径' prop='viewPath'>
-          <el-input v-model='form.viewPath' placeholder='请输入查看表单路径' clearable>
-          </el-input>
-        </el-form-item>
-      </el-form>
-    </el-scrollbar>
-    <template #footer>
-            <span class='dialog-footer'>
-                <el-button @click='machineVisible = false'>取消</el-button>
-                <el-button type='primary' @click='submit'>确认</el-button>
+    <el-dialog draggable class="cn-operate-dialog" v-model="machineVisible" :title="title" width="40%">
+        <el-scrollbar>
+            <el-form :inline="false" :model="form" label-width="120px" :rules="rules" ref="formRef">
+                <el-form-item label="标识名称" prop="name">
+                    <el-input v-model="form.name" placeholder="请输入标识名" clearable />
+                </el-form-item>
+                <el-form-item label="分类key" prop="signKey">
+                    <el-input v-model="form.signKey" placeholder="请输入标识key" clearable />
+                </el-form-item>
+                <el-form-item label="查看表单路径" prop="viewPath">
+                    <el-input v-model="form.viewPath" placeholder="请输入查看表单路径" clearable></el-input>
+                </el-form-item>
+                <el-form-item label="排序">
+                    <el-input-number
+                        style="width: 100%"
+                        v-model="form.sort"
+                        :min="0"
+                        placeholder="请输入排序"
+                    />
+                </el-form-item>
+            </el-form>
+        </el-scrollbar>
+        <template #footer>
+            <span class="dialog-footer">
+                <el-button @click="machineVisible = false">取消</el-button>
+                <el-button type="primary" @click="submit">确认</el-button>
             </span>
-    </template>
-  </el-dialog>
+        </template>
+    </el-dialog>
 </template>
-<script lang='ts' setup>
+<script lang="ts" setup>
 import { ref, reactive, inject } from 'vue'
 import { ElMessage } from 'element-plus'
 import TableStore from '@/utils/tableStore'
@@ -43,59 +43,61 @@ const formRef = ref()
 
 // 注意不要和表单ref的命名冲突
 const form = reactive({
-  id: '',
-  name: '',
-  signKey: '',
-  viewPath: ''
+    id: '',
+    name: '',
+    signKey: '',
+    viewPath: '',
+    sort:100,
 })
 
 //form表单校验规则
 const rules = {
-  name: [{ required: true, message: '标识名不能为空', trigger: 'blur' }],
-  signKey: [{ required: true, message: '标识key不能为空', trigger: 'blur' }],
-  viewPath: [{ required: true, message: '查看表单路径不能为空', trigger: 'blur' }],
+    name: [{ required: true, message: '标识名不能为空', trigger: 'blur' }],
+    signKey: [{ required: true, message: '标识key不能为空', trigger: 'blur' }],
+    viewPath: [{ required: true, message: '查看表单路径不能为空', trigger: 'blur' }]
 }
 
 const open = (text: string, data?: any) => {
-  title.value = text
-  if (data) {
-    // 表单赋值
-    for (let key in form) {
-      form[key] = data[key]
+    title.value = text
+    if (data) {
+        // 表单赋值
+        for (let key in form) {
+            form[key] = data[key]
+        }
+    } else {
+        resetForm()
+        // 在此处恢复默认表单
+        for (let key in form) {
+            form[key] = ''
+        }
+        form.sort=100
     }
-  } else {
-    resetForm()
-    // 在此处恢复默认表单
-    for (let key in form) {
-      form[key] = ''
-    }
-  }
-  machineVisible.value = true
+    machineVisible.value = true
 }
 
 //重置表单内容
 const resetForm = () => {
-  if (formRef.value) {
-    formRef.value.resetFields()
-  }
+    if (formRef.value) {
+        formRef.value.resetFields()
+    }
 }
 
 /**
  * 提交用户表单数据
  */
 const submit = () => {
-  formRef.value.validate(async (valid: any) => {
-    if (valid) {
-      if (form.id) {
-        await updateSign(form)
-      } else {
-        await addSign(form)
-      }
-      ElMessage.success('保存成功')
-      tableStore.index()
-      machineVisible.value = false
-    }
-  })
+    formRef.value.validate(async (valid: any) => {
+        if (valid) {
+            if (form.id) {
+                await updateSign(form)
+            } else {
+                await addSign(form)
+            }
+            ElMessage.success('保存成功')
+            tableStore.index()
+            machineVisible.value = false
+        }
+    })
 }
 
 defineExpose({ open })
@@ -103,10 +105,10 @@ defineExpose({ open })
 
 <style scoped>
 .el-upload-list__item {
-  transition: none !important;
+    transition: none !important;
 }
 
 .el-select {
-  min-width: 180px;
+    min-width: 180px;
 }
 </style>