Browse Source

页面左右分别滑动

gangyj 2 năm trước cách đây
mục cha
commit
f0b522eb23
3 tập tin đã thay đổi với 309 bổ sung290 xóa
  1. 4 0
      src/styles/common.scss
  2. 171 165
      src/views/manager/projectinfo/tree.vue
  3. 134 125
      src/views/manager/wbsinfo/edit.vue

+ 4 - 0
src/styles/common.scss

@@ -136,6 +136,10 @@ a{
   overflow: auto;
 }
 
+.ov-hidden{
+  overflow: hidden;
+}
+
 .required:before{
   content: "*";
   color: #f56c6c;

+ 171 - 165
src/views/manager/projectinfo/tree.vue

@@ -1,8 +1,8 @@
 <template>
   <basic-container>
-    <el-row :gutter="20">
-      <el-col :span="10">
-        <div class="box">
+    <el-row :gutter="20" class="h-100p">
+      <el-col :span="10" class="h-100p">
+        <div class="h-100p flex flex-d-c">
           <p>工程节点信息</p>
           <div class="flex">
             <el-input
@@ -13,8 +13,8 @@
             ></el-input>
             <!-- <el-button type="info" class="mg-l-20">导入划分</el-button> -->
           </div>
-          <div style="position: relative; height: calc(100% - 65px);">
-          <el-scrollbar>
+          <div class="flex1 ov-hidden">
+          <el-scrollbar class="h-100p">
             <div v-loading="treeLoad">
               <el-tree
                 v-show="!filterText"
@@ -172,32 +172,34 @@
 
         </div>
       </el-col>
-      <el-col :span="14">
+      <el-col :span="14" class="h-100p flex flex-d-c">
         <template v-if="leftType==5">
           <p>节点信息</p>
-          <el-table
-            :data="tableData"
-            border
-            style="width: 100%"
-          >
-            <el-table-column
-              align="center"
-              prop="nodeName"
-              label="当前节点"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="nodeType"
-              :formatter="formatCat"
-              label="节点类型"
-              width="180"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="parentName"
-              label="上级节点"
-            ></el-table-column>
-          </el-table>
+          <div>
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+            >
+              <el-table-column
+                align="center"
+                prop="nodeName"
+                label="当前节点"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="nodeType"
+                :formatter="formatCat"
+                label="节点类型"
+                width="180"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="parentName"
+                label="上级节点"
+              ></el-table-column>
+            </el-table>
+          </div>
           <div class="flex jc-sb">
             <p>
               <span>当前项目信息表</span>
@@ -232,146 +234,150 @@
               <el-button type="primary" size="medium" @click="eleFormulaHandle">表单设置</el-button>
             </div>
           </div>
-          <el-table
-            :data="formData"
-            border
-            style="width: 100%"
-          >
-            <el-table-column
-              align="center"
-              prop="tableName"
-              label="表单名称"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="elementTotal"
-              width="80"
-              label="字段总量"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="fillRate"
-              width="100"
-              label="填报率"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="tableType"
-              :formatter="formatTableType"
-              width="100"
-              label="表单类型"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="tableOwner"
-              :formatter="formatOwner"
-              label="所属方"
-            ></el-table-column>
-            <el-table-column
-              label="操作"
-              width="240"
+          <div style="flex: 1;position: relative;">
+            <el-table
+              :data="formData"
+              border height="100%"
+              style="width: 100%;position: absolute;"
             >
-              <template slot-scope="scope">
-                <el-button
-                  size="mini"
-                  @click="handleEdit(scope.$index, scope.row)"
-                >预览</el-button>
-                <el-button
-                  size="mini"
-                  type="primary"
-                  v-throttle='3000'
-                  v-show="scope.row.status==0"
-                  @click="hideMD(scope.row)"
-                >取消隐藏</el-button>
-                <el-button
-                  size="mini"
-                  type="primary"
-                  v-throttle='3000'
-                  v-show="scope.row.status==1"
-                  @click="hideMD(scope.row)"
-                >隐藏表单</el-button>
-                <el-button
-                  size="mini"
-                  type="danger"
-                  @click="handleDelete(scope.$index, scope.row)"
-                >删除</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
+              <el-table-column
+                align="center"
+                prop="tableName"
+                label="表单名称"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="elementTotal"
+                width="80"
+                label="字段总量"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="fillRate"
+                width="100"
+                label="填报率"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="tableType"
+                :formatter="formatTableType"
+                width="100"
+                label="表单类型"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="tableOwner"
+                :formatter="formatOwner"
+                label="所属方"
+              ></el-table-column>
+              <el-table-column
+                label="操作"
+                width="240"
+              >
+                <template slot-scope="scope">
+                  <el-button
+                    size="mini"
+                    @click="handleEdit(scope.$index, scope.row)"
+                  >预览</el-button>
+                  <el-button
+                    size="mini"
+                    type="primary"
+                    v-throttle='3000'
+                    v-show="scope.row.status==0"
+                    @click="hideMD(scope.row)"
+                  >取消隐藏</el-button>
+                  <el-button
+                    size="mini"
+                    type="primary"
+                    v-throttle='3000'
+                    v-show="scope.row.status==1"
+                    @click="hideMD(scope.row)"
+                  >隐藏表单</el-button>
+                  <el-button
+                    size="mini"
+                    type="danger"
+                    @click="handleDelete(scope.$index, scope.row)"
+                  >删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
         </template>
         <template v-if="leftType==4">
-          <el-table
-            :data="formData"
-            border
-            style="width: 100%"
-          >
-            <el-table-column
-              align="center"
-              prop="tableName"
-              label="表单名称"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="tableType"
-              :formatter="formatTableType"
-              label="表单类型"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="fillRate"
-              label="填报率"
-            ></el-table-column>
-            <el-table-column
-              label="是否关联清表"
-              prop="isLinkTable"
-              align="center"
-            >
-              <template slot-scope="scope">
-                <span v-if="scope.row.isLinkTable == 2">是</span>
-                <span v-else>否</span>
-              </template>
-            </el-table-column>
-            <el-table-column
-              align="center"
-              prop="tableOwner"
-              :formatter="formatOwner"
-              label="所属方"
-            ></el-table-column>
-            <el-table-column
-              label="操作"
-              width="400"
-              align="center"
+          <div style="flex: 1;position: relative;">
+            <el-table
+              :data="formData"
+              border height="100%"
+              style="width: 100%;position: absolute;"
             >
-              <template slot-scope="scope">
-                <el-link
-                  type="primary"
-                  @click="Associationlist(scope)"
-                >关联清表</el-link>
-                <el-link
-                  class="mg-l-10"
-                  type="primary"
-                  :disabled='scope.row.excelId==-1'
-                  @click="rightClick(scope.row.pkeyId,scope.row.excelId,scope.row.id,scope.row.initTableName)"
-                >编辑元素</el-link>
-                <el-link
-                  class="mg-l-10"
-                  type="primary"
-                  :disabled='scope.row.excelId==-1'
-                  @click="adjustExcel(scope.row.pkeyId,scope.row.excelId)"
-                >调整表单</el-link>
-                <el-link
-                  class="mg-l-10"
-                  type="primary"
-                  @click="handleEditFormula(scope.$index, scope.row)"
-                >编辑元素公式</el-link>
-                <el-link
-                  class="mg-l-10"
-                  type="danger"
-                  @click="handleDelete(scope.$index, scope.row)"
-                >删除表单</el-link>
-              </template>
-            </el-table-column>
-          </el-table>
+              <el-table-column
+                align="center"
+                prop="tableName"
+                label="表单名称"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="tableType"
+                :formatter="formatTableType"
+                label="表单类型"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="fillRate"
+                label="填报率"
+              ></el-table-column>
+              <el-table-column
+                label="是否关联清表"
+                prop="isLinkTable"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <span v-if="scope.row.isLinkTable == 2">是</span>
+                  <span v-else>否</span>
+                </template>
+              </el-table-column>
+              <el-table-column
+                align="center"
+                prop="tableOwner"
+                :formatter="formatOwner"
+                label="所属方"
+              ></el-table-column>
+              <el-table-column
+                label="操作"
+                width="400"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <el-link
+                    type="primary"
+                    @click="Associationlist(scope)"
+                  >关联清表</el-link>
+                  <el-link
+                    class="mg-l-10"
+                    type="primary"
+                    :disabled='scope.row.excelId==-1'
+                    @click="rightClick(scope.row.pkeyId,scope.row.excelId,scope.row.id,scope.row.initTableName)"
+                  >编辑元素</el-link>
+                  <el-link
+                    class="mg-l-10"
+                    type="primary"
+                    :disabled='scope.row.excelId==-1'
+                    @click="adjustExcel(scope.row.pkeyId,scope.row.excelId)"
+                  >调整表单</el-link>
+                  <el-link
+                    class="mg-l-10"
+                    type="primary"
+                    @click="handleEditFormula(scope.$index, scope.row)"
+                  >编辑元素公式</el-link>
+                  <el-link
+                    class="mg-l-10"
+                    type="danger"
+                    @click="handleDelete(scope.$index, scope.row)"
+                  >删除表单</el-link>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
         </template>
       </el-col>
     </el-row>

+ 134 - 125
src/views/manager/wbsinfo/edit.vue

@@ -1,8 +1,8 @@
 <template>
   <basic-container>
-    <el-row :gutter="20">
-      <el-col :span="10">
-        <div class="h-100p">
+    <el-row :gutter="20" class="h-100p">
+      <el-col :span="10" class="h-100p">
+        <div class="h-100p flex flex-d-c">
           <p>工程节点信息</p>
           <div class="flex">
             <el-input
@@ -13,8 +13,8 @@
             ></el-input>
             <!-- <el-button type="info" class="mg-l-20">导入划分</el-button> -->
           </div>
-          <div>
-          <el-scrollbar>
+          <div class="flex1 ov-hidden">
+          <el-scrollbar class="h-100p">
             <div v-loading="treeLoad">
               <el-tree
                 v-show="!filterText"
@@ -185,32 +185,34 @@
           </div>
         </div>
       </el-col>
-      <el-col :span="14">
+      <el-col :span="14" class="h-100p flex flex-d-c">
         <template v-if="leftType==5">
           <p>节点信息</p>
-          <el-table
-            :data="tableData"
-            border
-            style="width: 100%"
-          >
-            <el-table-column
-              align="center"
-              prop="nodeName"
-              label="当前节点"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="nodeType"
-              :formatter="formatCat"
-              label="节点类型"
-              width="180"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="parentName"
-              label="上级节点"
-            ></el-table-column>
-          </el-table>
+          <div>
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+            >
+              <el-table-column
+                align="center"
+                prop="nodeName"
+                label="当前节点"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="nodeType"
+                :formatter="formatCat"
+                label="节点类型"
+                width="180"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="parentName"
+                label="上级节点"
+              ></el-table-column>
+            </el-table>
+          </div>
           <div class="flex jc-sb">
             <p>
               <span>当前已创建的元素表</span>
@@ -243,103 +245,107 @@
               <el-button type="primary" size="medium" @click="eleFormulaHandle">公式设置</el-button>
             </div>
           </div>
-          <el-table
-            :data="formData"
-            border
-            style="width: 100%"
-          >
-            <el-table-column
-              align="center"
-              prop="tableName"
-              label="表单名称"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="elementTotal"
-              label="元素总量"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="fillRate"
-              label="填报率"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="tableType"
-              :formatter="formatTableType"
-              label="表单类型"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="tableOwner"
-              :formatter="formatOwner"
-              label="所属方"
-            ></el-table-column>
-            <el-table-column label="操作">
-              <template slot-scope="scope">
-                <el-button
-                  size="mini"
-                  @click="handleEdit(scope.$index, scope.row)"
-                >编辑</el-button>
-                <el-button
-                  size="mini"
-                  type="danger"
-                  @click="handleDelete(scope.$index, scope.row)"
-                >删除</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
+          <div style="flex: 1;position: relative;">
+            <el-table
+              :data="formData"
+              border height="100%"
+              style="width: 100%;position: absolute;"
+            >
+              <el-table-column
+                align="center"
+                prop="tableName"
+                label="表单名称"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="elementTotal"
+                label="元素总量"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="fillRate"
+                label="填报率"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="tableType"
+                :formatter="formatTableType"
+                label="表单类型"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="tableOwner"
+                :formatter="formatOwner"
+                label="所属方"
+              ></el-table-column>
+              <el-table-column label="操作">
+                <template slot-scope="scope">
+                  <el-button
+                    size="mini"
+                    @click="handleEdit(scope.$index, scope.row)"
+                  >编辑</el-button>
+                  <el-button
+                    size="mini"
+                    type="danger"
+                    @click="handleDelete(scope.$index, scope.row)"
+                  >删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
         </template>
         <template v-if="leftType==4">
-          <el-table
-            :data="formData"
-            border
-            style="width: 100%"
-          >
-            <el-table-column
-              align="center"
-              prop="tableName"
-              label="表单名称"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="elementTotal"
-              label="元素总量"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="fillRate"
-              label="填报率"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="tableType"
-              :formatter="formatTableType"
-              label="表单类型"
-            ></el-table-column>
-            <el-table-column
-              align="center"
-              prop="tableOwner"
-              :formatter="formatOwner"
-              label="所属方"
-            ></el-table-column>
-            <el-table-column
-              label="操作"
-              width="200"
+          <div style="flex: 1;position: relative;">
+            <el-table
+              :data="formData"
+              border height="100%"
+              style="width: 100%;position: absolute;"
             >
-              <template slot-scope="scope">
-                <el-button
-                  size="mini"
-                  @click="handleEditFormula(scope.$index, scope.row)"
-                >编辑元素公式</el-button>
-                <el-button
-                  size="mini"
-                  type="danger"
-                  @click="handleDelete(scope.$index, scope.row)"
-                >删除</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
+              <el-table-column
+                align="center"
+                prop="tableName"
+                label="表单名称"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="elementTotal"
+                label="元素总量"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="fillRate"
+                label="填报率"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="tableType"
+                :formatter="formatTableType"
+                label="表单类型"
+              ></el-table-column>
+              <el-table-column
+                align="center"
+                prop="tableOwner"
+                :formatter="formatOwner"
+                label="所属方"
+              ></el-table-column>
+              <el-table-column
+                label="操作"
+                width="200"
+              >
+                <template slot-scope="scope">
+                  <el-button
+                    size="mini"
+                    @click="handleEditFormula(scope.$index, scope.row)"
+                  >编辑元素公式</el-button>
+                  <el-button
+                    size="mini"
+                    type="danger"
+                    @click="handleDelete(scope.$index, scope.row)"
+                  >删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
         </template>
       </el-col>
     </el-row>
@@ -544,8 +550,11 @@
         <el-form-item
           label="节点名称"
           prop="nodeName"
-        >
-          <el-input v-model="nodeDetail.nodeName"></el-input>
+        > 
+          <div class="flex">
+            <el-input v-model="nodeDetail.nodeName"></el-input>
+            <!-- <el-button class="mg-l-10" type="primary">添加别名</el-button> -->
+          </div>
         </el-form-item>
         <el-form-item label="上级节点">
           <el-input