河-路-田，添加按排序排序，添加左侧部门树

data-ui/src/views/data/digitalwater/length/index.vue

@@ -1,5 +1,34 @@
 <template>
   <div class="app-container">
+    <el-row :gutter="20">
+    <el-col :span="4" :xs="24">
+      <div class="head-container">
+        <el-input
+          v-model="deptName"
+          placeholder="请输入部门名称"
+          clearable
+          size="small"
+          prefix-icon="el-icon-search"
+          style="margin-bottom: 20px"
+        >
+          <el-button slot="append" @click="changeQueryType" v-if="queryParams.deptName == 0">本级及下级</el-button>
+          <el-button slot="append" @click="changeQueryType" v-if="queryParams.deptName == 1">只查询本级</el-button>
+        </el-input>
+      </div>
+      <div class="head-container tree-scrollbar" style="height: 700px;overflow-y:auto;">
+        <el-tree
+          :data="deptOptions"
+          :props="defaultProps"
+          :expand-on-click-node="false"
+          :filter-node-method="filterNode"
+          ref="tree"
+          node-key="id"
+          :default-expanded-keys="[100]"
+          @node-click="handleNodeClick"
+        />
+      </div>
+    </el-col>
+    <el-col :span="20" :xs="24">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch"  @submit.native.prevent>
       <el-form-item label="姓名" prop="name">
         <el-input
@@ -10,15 +39,15 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item prop="deptId">
-        <template slot="label">
-          <span @click="changeQueryType" v-if="queryParams.deptName == 0">本级及下级</span>
-          <span @click="changeQueryType" v-if="queryParams.deptName == 1">只查询本级</span>
-        </template>
-        <treeselect v-model="queryParams.deptId" :options="deptOptions" multiple:false :show-count="true"
-                    placeholder="请选择部门" @select="hx" :noResultsText="'空'" :noOptionsText="'空'" style="width: 240px"/>
-        <el-input v-model="queryParams.deptName" v-if="false"/>
-      </el-form-item>
+<!--      <el-form-item prop="deptId">-->
+<!--        <template slot="label">-->
+<!--          <span @click="changeQueryType" v-if="queryParams.deptName == 0">本级及下级</span>-->
+<!--          <span @click="changeQueryType" v-if="queryParams.deptName == 1">只查询本级</span>-->
+<!--        </template>-->
+<!--        <treeselect v-model="queryParams.deptId" :options="deptOptions" multiple:false :show-count="true"-->
+<!--                    placeholder="请选择部门" @select="hx" :noResultsText="'空'" :noOptionsText="'空'" style="width: 240px"/>-->
+<!--        <el-input v-model="queryParams.deptName" v-if="false"/>-->
+<!--      </el-form-item>-->
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -141,7 +170,8 @@
       :limit.sync="queryParams.pageSize"
       @pagination="getList"
     />
-
+    </el-col>
+    </el-row>
     <!-- 添加或修改河长名录对话框 -->
     <el-dialog :title="title" :visible.sync="open" width="800px" class="form-style">
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
@@ -188,6 +218,9 @@
               <treeselect v-model="form.deptId" :options="deptOptions" multiple:false :show-count="true"
                           placeholder="请选择部门" @select="hx" :noResultsText="'空'" :noOptionsText="'空'"/>
             </el-form-item>
+            <el-form-item label="排序" prop="sort">
+              <el-input v-model="form.sort" placeholder="请输入排序" maxlength="50"/>
+            </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="性别" prop="sex">
@@ -211,7 +244,9 @@
             <el-form-item label="行政职务" prop="adminiStrativeLinJob">
               <el-input v-model="form.adminiStrativeLinJob" placeholder="请输入行政职务" maxlength="50"/>
             </el-form-item>
+
           </el-col>
+
         </el-row>
         <el-col :span="24">
           <el-form-item label="责任区" prop="introduction">
@@ -239,11 +274,11 @@
 </template>
 
 <script>
-import {addLength, delLength, getLength, listLength, updateLength} from "@/api/data/digitalwater/length";
+import {addLength, delLength, getLength, listLength, updateLength,} from "@/api/data/digitalwater/length";
 import {selectUserList} from "@/api/data/digitalforest/linleader/linleader";
 import {gridlistAll} from "@/api/data/digitalresources/grid";
 import Deptselector from '@/views/components/deptselector';
-import {checkPositiveDecimal, validPhoneMobile} from "@/api/rules/rules";
+import { checkNonnegativeInteger, checkPositiveDecimal, validPhoneMobile } from '@/api/rules/rules'
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import {treeselect} from "@/api/system/dept";
@@ -254,6 +289,13 @@ export default {
   dicts: ['centerdata_hydroenergy_plan_rank', 'traffic_lu_job', 'farm_tian_job', 'sys_user_sex', 'forest_lin_level'],
   data() {
     return {
+
+      defaultProps: {
+        children: 'children',
+        label: 'label'
+      },
+      // 部门名称
+      deptName: undefined,
       // 遮罩层
       loading: true,
       deptOptions: undefined,
@@ -322,6 +364,10 @@ export default {
         phone: [
           {required: true, message: '联系电话不能为空', trigger: 'change'},
           {validator: validPhoneMobile, trigger: 'blur'}
+        ],
+        sort: [
+          {required: false, },
+          {validator: checkNonnegativeInteger, trigger: 'blur'}
         ]
       },
       userList: [],
@@ -343,7 +389,27 @@ export default {
       this.gridList = response;
     });
   },
+  watch: {
+    // 根据名称筛选部门树
+    deptName(val) {
+      this.$refs.tree.filter(val)
+    }
+  },
   methods: {
+
+// 筛选节点
+    filterNode(value, data) {
+      if (!value) return true
+      return data.label.indexOf(value) !== -1
+    },
+    // 节点单击事件
+    handleNodeClick(data) {
+      this.queryParams.deptId = data.id;
+      this.queryParams.pageNum = 1;
+      this.getList();
+
+    },
+
     getTreeselect() {
       treeselect().then(response => {
         this.deptOptions = response.data
@@ -388,6 +454,7 @@ export default {
     // 表单重置
     reset() {
       this.form = {
+        sort: null,
         id: null,
         userId: null,
         name: null,
@@ -421,7 +488,8 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.queryParams.deptName = 0;
+      this.deptName = undefined;
+      this.queryParams.deptName = 0
       this.resetForm("queryForm");
       this.handleQuery();
     },
@@ -437,6 +505,7 @@ export default {
     },
     /** 新增按钮操作 */
     handleAdd() {
+
       this.reset();
       this.open = true;
       if (this.$route.query.type == 2) {
@@ -451,6 +520,7 @@ export default {
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
+
       this.reset();
       const id = row.id || this.ids
       getLength(id).then(response => {
@@ -491,8 +561,8 @@ export default {
     handleDelete(row) {
       const ids = row.id || this.ids;
       const type = this.$route.query.type;
-      this.$modal.confirm('是否确认删选中的数据项？').then(function () {
-        return delLength(ids,type);
+      this.$modal.confirm('是否确认删选中的数据项？').then(function() {
+        return delLength(ids, type);
       }).then(() => {
         this.getList();
         this.$modal.msgSuccess("删除成功");
@@ -501,14 +571,14 @@ export default {
     },
     /** 导出按钮操作 */
     handleExport() {
-      if (this.$route.query.type==2){
-        this.title="河长名录"
-      }else if(this.$route.query.type==3){
-        this.title="路长管理"
-      }else if (this.$route.query.type==6){
+      if (this.$route.query.type == 2) {
+        this.title = "河长名录"
+      } else if (this.$route.query.type == 3) {
+        this.title = "路长管理"
+      } else if (this.$route.query.type == 6) {
         this.title = "田长管理";
-      }else {
-        this.title="length"
+      } else {
+        this.title = "length"
       }
       this.download('sooka-sponest-center-data/length/export', {
         ...this.queryParams

src/main/java/com/sooka/sponest/data/digitalwater/domain/CenterdataTHydraulicRiverLength.java

@@ -119,6 +119,8 @@ public class CenterdataTHydraulicRiverLength extends BaseBusinessEntity {
 
     @ApiModelProperty(value = "类型", required = false)
     private String type;
+    @ApiModelProperty(value = "排序", required = false)
+    private Long sort;
 
     /**
      * 所属部门

src/main/java/com/sooka/sponest/data/digitalwater/service/impl/CenterdataTHydraulicRiverLengthServiceImpl.java

@@ -75,6 +75,9 @@ public class CenterdataTHydraulicRiverLengthServiceImpl extends BaseServiceImpl
         centerdataTHydraulicRiverLength.setCreateTime(DateUtils.getNowDate());
         centerdataTHydraulicRiverLength.setCreateName(SecurityUtils.getLoginUser().getSysUser().getNickName());
         centerdataTHydraulicRiverLength.setCreateBy(SecurityUtils.getUserId().toString());
+        if (StringUtils.isNull(centerdataTHydraulicRiverLength.getSort())){
+            centerdataTHydraulicRiverLength.setSort(999l);
+        }
         return centerdataTHydraulicRiverLengthMapper.insertCenterdataTHydraulicRiverLength(centerdataTHydraulicRiverLength);
     }
 
@@ -89,6 +92,9 @@ public class CenterdataTHydraulicRiverLengthServiceImpl extends BaseServiceImpl
         centerdataTHydraulicRiverLength.setUpdateBy(SecurityUtils.getUserId());
         centerdataTHydraulicRiverLength.setUpdateName(SecurityUtils.getLoginUser().getSysUser().getNickName());
         centerdataTHydraulicRiverLength.setUpdateTime(DateUtils.getNowDate());
+        if (StringUtils.isNull(centerdataTHydraulicRiverLength.getSort())){
+            centerdataTHydraulicRiverLength.setSort(999l);
+        }
         return centerdataTHydraulicRiverLengthMapper.updateCenterdataTHydraulicRiverLength(centerdataTHydraulicRiverLength);
     }
 

src/main/resources/mapper/digitalwater/CenterdataTHydraulicRiverLengthMapper.xml

@@ -30,11 +30,12 @@
         <result property="istrativeDivision" column="istrative_division"/>
         <result property="adminiStrativeLinJob" column="admini_strative_lin_job"/>
         <result property="type" column="type"/>
+        <result property="sort" column="sort"/>
     </resultMap>
 
     <sql id="selectCenterdataTHydraulicRiverLengthVo">
         select id, name, sex, phone, attach_id, post, admini_strative_lin_job,introduction, riverway_length_county, dept_id, dept_name, create_by, create_name, create_time, update_by, update_name, update_time, data_status,
-        user_id, lin_level, grid_id, grid_name, region_length, istrative_division, type from centerdata_t_hydraulic_river_length
+        user_id, lin_level, grid_id, grid_name, region_length, istrative_division, type ,sort from centerdata_t_hydraulic_river_length
     </sql>
 
     <select id="selectCenterdataTHydraulicRiverLengthList" parameterType="CenterdataTHydraulicRiverLength"
@@ -69,7 +70,7 @@
             <if test="gridId != null and gridId != ''">and grid_id  like concat('%', #{gridId})</if>
             ${params.dataScope}
         </where>
-        ORDER BY a.create_time DESC
+        ORDER BY a.sort asc,a.create_time DESC
     </select>
 
     <select id="selectCenterdataTHydraulicRiverLengthById" parameterType="String"
@@ -108,6 +109,7 @@
             <if test="istrativeDivision != null">istrative_division,</if>
             <if test="adminiStrativeLinJob != null">admini_strative_lin_job,</if>
             <if test="type != null">type,</if>
+            <if test="sort != null">sort,</if>
         </trim>
         <trim prefix="values (" suffix=")" suffixOverrides=",">
             <if test="id != null">#{id},</if>
@@ -135,6 +137,7 @@
             <if test="istrativeDivision != null">#{istrativeDivision},</if>
             <if test="adminiStrativeLinJob != null">#{adminiStrativeLinJob},</if>
             <if test="type != null">#{type},</if>
+            <if test="sort != null">#{sort},</if>
         </trim>
     </insert>
 
@@ -165,6 +168,7 @@
             <if test="istrativeDivision != null">istrative_division = #{istrativeDivision},</if>
             <if test="adminiStrativeLinJob != null">admini_strative_lin_job = #{adminiStrativeLinJob},</if>
             <if test="type != null">type = #{type},</if>
+            <if test="sort != null">sort = #{sort},</if>
         </trim>
         where id = #{id}
     </update>