style: 部门管理页面排版

src/i18n/locales/en-US.ts

@@ -1390,7 +1390,6 @@ export default {
         open:'Exhibition',
         close:'Fold',
         addClass:'Add new sub-department',
-        showSort:'Show Sort',
         admin:'Principal',
         phone:'Contact Number',
         email:'Mail',

src/i18n/locales/zh-CN.ts

@@ -1390,7 +1390,6 @@ export default {
         open:'展',
         close:'折',
         addClass:'新增子部门',
-        showSort:'显示排序',
         admin:'负责人',
         phone:'联系电话',
         email:'邮箱',

src/views/system/dept/index.vue

@@ -84,28 +84,33 @@ let tableColumns: ColumnsType = [
   {
     title: t('views.system.dept.className'),
     dataIndex: 'deptName',
-    align: 'center',
+    align: 'left',
+    width: 300,
   },
   {
     title: t('views.system.dept.classId'),
     dataIndex: 'deptId',
-    align: 'center',
+    align: 'left',
+    width: 150,
   },
   {
-    title: t('views.system.dept.className'),
+    title: t('views.system.dept.classSort'),
     dataIndex: 'orderNum',
-    align: 'center',
+    align: 'left',
+    width: 200,
   },
   {
     title: t('views.system.dept.status'),
     dataIndex: 'status',
     key: 'status',
     align: 'center',
+    width: 150,
   },
   {
     title: t('views.system.dept.createTime'),
     dataIndex: 'createTime',
     align: 'center',
+    width: 150,
     customRender(opt) {
       if (+opt.value <= 0) return '';
       return parseDateToStr(+opt.value);
@@ -114,7 +119,7 @@ let tableColumns: ColumnsType = [
   {
     title: t('common.operate'),
     key: 'deptId',
-    align: 'center',
+    align: 'left',
   },
 ];
 
@@ -553,7 +558,7 @@ onMounted(() => {
         :size="tableState.size"
         :row-class-name="fnTableStriped"
         :pagination="false"
-        :scroll="{ x: true }"
+        :scroll="{ x: tableColumns.length * 120 }"
         children-column-name="children"
         :expanded-row-keys="tableState.expandedRowKeys"
         @expandedRowsChange="fnTableExpandedRowsChange"
@@ -594,7 +599,7 @@ onMounted(() => {
                   <template #icon><DeleteOutlined /></template>
                 </a-button>
               </a-tooltip>
-              <a-tooltip v-if="record.status !== '0'">
+              <a-tooltip placement="topRight" v-if="record.status !== '0'">
                 <template #title>{{
                   t('views.system.dept.addClass')
                 }}</template>
@@ -653,7 +658,7 @@ onMounted(() => {
           </a-col>
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item
-              :label="t('views.system.dept.showSort')"
+              :label="t('views.system.dept.classSort')"
               name="orderNum"
             >
               {{ modalState.from.orderNum }}
@@ -727,6 +732,8 @@ onMounted(() => {
           :label="t('views.system.dept.highClass')"
           name="parentId"
           v-bind="modalStateFrom.validateInfos.parentId"
+          :label-col="{ span: 3 }"
+          :labelWrap="true"
         >
           <a-tree-select
             v-model:value="modalState.from.parentId"
@@ -750,6 +757,8 @@ onMounted(() => {
           :label="t('views.system.dept.className')"
           name="deptName"
           v-bind="modalStateFrom.validateInfos.deptName"
+          :label-col="{ span: 3 }"
+          :labelWrap="true"
         >
           <a-input
             v-model:value="modalState.from.deptName"
@@ -771,7 +780,7 @@ onMounted(() => {
           </a-col>
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item
-              :label="t('views.system.dept.showSort')"
+              :label="t('views.system.dept.classSort')"
               name="orderNum"
             >
               <a-input-number