修改form模板 调整form基本样式

server/resource/template/web/form.vue.tpl

@@ -1,5 +1,6 @@
 <template>
   <div>
+    <div class="gva-form-box">
       <el-form :model="formData" label-position="right" label-width="80px">
       {{- range .Fields}}
         <el-form-item label="{{.FieldDesc}}:">
@@ -32,6 +33,7 @@
         </el-form-item>
       </el-form>
     </div>
+  </div>
 </template>
 
 <script>

web/src/style/main.scss

@@ -761,11 +761,6 @@ li {
     .upload {
         padding: 0;
     }
-    .el-form.el-form--inline {
-        .el-form-item:last-child {
-            margin-bottom: 0;
-        }
-    }
     .edit_container,
     .edit {
         padding: 0;
@@ -1419,6 +1414,13 @@ $mainHight: 100vh;
 }
 
 .gva-search-box {
+    .el-collapse {
+        border: none;
+        .el-collapse-item__header,
+        .el-collapse-item__wrap {
+            border-bottom: none;
+        }
+    }
     padding: 24px;
     padding-bottom: 2px;
     background-color: #fff;
@@ -1431,6 +1433,12 @@ $mainHight: 100vh;
     }
 }
 
+.gva-form-box {
+    padding: 24px;
+    background-color: #fff;
+    border-radius: 2px;
+}
+
 .gva-table-box {
     padding: 24px;
     background-color: #fff;

web/src/view/superAdmin/menu/icon.vue

@@ -5,7 +5,7 @@
       :class="'el-icon-'+ metaData.icon"
       style="position: absolute; z-index: 9999; padding: 5px 10px; "
     />
-    <el-select v-model="metaData.icon" clearable filterable class="gva-select" placeholder="请选择">
+    <el-select v-model="metaData.icon" style="width:100%" clearable filterable class="gva-select" placeholder="请选择">
       <el-option v-for="item in options" :key="item.key" :label="item.key" :value="item.key">
         <span class="icon" :class="item.label" />
         <span style="float: left">{{ item.key }}</span>

web/src/view/superAdmin/menu/menu.vue

@@ -96,6 +96,7 @@
         <el-form-item label="父节点ID" style="width:30%">
           <el-cascader
             v-model="form.parentId"
+            style="width:100%"
             :disabled="!isEdit"
             :options="menuOption"
             :props="{ checkStrictly: true,label:'title',value:'ID',disabled:'disabled',emitPath:false}"
@@ -111,19 +112,19 @@
           <el-input v-model="form.meta.title" autocomplete="off" />
         </el-form-item>
         <el-form-item label="图标" prop="meta.icon" style="width:30%">
-          <icon :meta="form.meta" />
+          <icon :meta="form.meta" style="width:100%" />
         </el-form-item>
         <el-form-item label="排序标记" prop="sort" style="width:30%">
           <el-input v-model.number="form.sort" autocomplete="off" />
         </el-form-item>
         <el-form-item label="KeepAlive" prop="meta.keepAlive" style="width:30%">
-          <el-select v-model="form.meta.keepAlive" placeholder="是否keepAlive缓存页面">
+          <el-select v-model="form.meta.keepAlive" style="width:100%" placeholder="是否keepAlive缓存页面">
             <el-option :value="false" label="否" />
             <el-option :value="true" label="是" />
           </el-select>
         </el-form-item>
         <el-form-item label="CloseTab" prop="meta.closeTab" style="width:30%">
-          <el-select v-model="form.meta.closeTab" placeholder="是否自动关闭tab">
+          <el-select v-model="form.meta.closeTab" style="width:100%" placeholder="是否自动关闭tab">
             <el-option :value="false" label="否" />
             <el-option :value="true" label="是" />
           </el-select>

web/src/view/systemTools/autoCode/component/previewCodeDialg.vue

@@ -1,10 +1,5 @@
 <template>
   <div class="previewCode">
-    <div class="previewCodeTool">
-      <p>操作栏：</p>
-      <el-button @click="selectText">全选</el-button>
-      <el-button @click="copy">复制</el-button>
-    </div>
     <el-tabs v-model="activeName">
       <el-tab-pane v-for="(item, key) in previewCode" :key="key" :label="key" :name="key">
         <div :id="key" class="tab-info" />
@@ -82,12 +77,6 @@ export default {
 
 <style lang="scss">
 .previewCode {
-  .previewCodeTool {
-    display: flex;
-    align-items: center;
-    padding: 5px 0;
-    margin-top: -40px;
-  }
   .tab-info {
     height: 50vh;
     background: #fff;

web/src/view/systemTools/autoCode/index.vue

@@ -42,6 +42,8 @@
           </el-form>
         </el-collapse-item>
       </el-collapse>
+    </div>
+    <div class="gva-search-box">
       <!-- 初始版本自动化代码工具 -->
       <el-form ref="autoCodeForm" :rules="rules" :model="form" label-width="120px" :inline="true">
         <el-form-item label="Struct名称" prop="structName">
@@ -146,9 +148,16 @@
     </el-dialog>
 
     <el-dialog v-model="previewFlag">
+      <template #title>
+        <div class="previewCodeTool">
+          <p>操作栏：</p>
+          <el-button size="mini" type="primary" @click="selectText">全选</el-button>
+          <el-button size="mini" type="primary" @click="copy">复制</el-button>
+        </div>
+      </template>
       <PreviewCodeDialog v-if="previewFlag" :preview-code="preViewCode" />
       <template #footer>
-        <div class="dialog-footer">
+        <div class="dialog-footer" style="padding-top:14px;padding-right:14px">
           <el-button size="small" type="primary" @click="previewFlag = false">确 定</el-button>
         </div>
       </template>
@@ -427,6 +436,11 @@ export default {
 </script>
 
 <style scoped lang="scss">
+  .previewCodeTool {
+    display: flex;
+    align-items: center;
+    padding: 5px 0;
+  }
 .button-box {
   padding: 10px 20px;
   .el-button {