20181122通用查询

src/main/java/com/izouma/awesomeadmin/dao/CommonQueryMapper.java

@@ -18,7 +18,6 @@ public interface CommonQueryMapper {
 
     Map selectByPrimaryKey(CommonQuery record);
 
-
     int insertSelective(Map<String, Object> parameter);
 
     int updateByPrimaryKeySelective(Map<String, Object> parameter);

src/main/java/com/izouma/awesomeadmin/dao/CommonQueryMapper.xml

@@ -137,12 +137,51 @@
 
     </select>
 
-
     <select id="selectByPrimaryKey" resultType="java.util.Map" parameterType="java.util.Map">
         select
         *
         from ${tableName}
-        where id = #{primaryKey,jdbcType=INTEGER}
+        where
+        (del_flag = 'N' or del_flag = '0')
+        <if test="primaryKey != null and !&quot;&quot;.equals(primaryKey)">
+            and id = #{primaryKey,jdbcType=INTEGER}
+        </if>
+
+        <if test="advancedQuery != null and !&quot;&quot;.equals(advancedQuery)">
+            <foreach item="item" index="index" collection="advancedQuery.split('_;')">
+                <choose>
+                    <when test="item.indexOf('like') != -1">
+                        <foreach item="itemDetail" index="detailIndex" collection="item.split('_,')">
+                            <if test="detailIndex == 3">
+                                concat('%',#{itemDetail},'%')
+                            </if>
+
+                            <if test="detailIndex &lt; 3">
+                                ${itemDetail}
+                            </if>
+
+                        </foreach>
+                    </when>
+                    <otherwise>
+                        <foreach item="itemDetail" index="detailIndex" collection="item.split('_,')">
+                            <if test="detailIndex == 3">
+                                #{itemDetail}
+                            </if>
+
+                            <if test="detailIndex &lt; 3">
+                                ${itemDetail}
+                            </if>
+
+                        </foreach>
+                    </otherwise>
+                </choose>
+
+
+            </foreach>
+
+
+        </if>
+        LIMIT 1
     </select>
 
     <insert id="insertSelective" parameterType="java.util.Map" useGeneratedKeys="true"

src/main/java/com/izouma/awesomeadmin/dao/CommonQuerySqlServerMapper.xml

@@ -134,10 +134,50 @@
     </select>
 
     <select id="selectByPrimaryKey" resultType="java.util.Map" parameterType="java.util.Map">
-        select
+        select top 1
         *
         from ${tableName}
-        where id = #{primaryKey,jdbcType=INTEGER}
+        <where>
+            <if test="primaryKey != null and !&quot;&quot;.equals(primaryKey)">
+                id = #{primaryKey,jdbcType=INTEGER}
+            </if>
+
+            <if test="advancedQuery != null and !&quot;&quot;.equals(advancedQuery)">
+                <foreach item="item" index="index" collection="advancedQuery.split('_;')">
+                    <choose>
+                        <when test="item.indexOf('like') != -1">
+                            <foreach item="itemDetail" index="detailIndex" collection="item.split('_,')">
+                                <if test="detailIndex == 3">
+                                    concat('%',#{itemDetail},'%')
+                                </if>
+
+                                <if test="detailIndex &lt; 3">
+                                    ${itemDetail}
+                                </if>
+
+                            </foreach>
+                        </when>
+                        <otherwise>
+                            <foreach item="itemDetail" index="detailIndex" collection="item.split('_,')">
+                                <if test="detailIndex == 3">
+                                    #{itemDetail}
+                                </if>
+
+                                <if test="detailIndex &lt; 3">
+                                    ${itemDetail}
+                                </if>
+
+                            </foreach>
+                        </otherwise>
+                    </choose>
+
+
+                </foreach>
+
+
+            </if>
+        </where>
+
     </select>
 
     <insert id="insertSelective" parameterType="java.util.Map" useGeneratedKeys="true"

src/main/java/com/izouma/awesomeadmin/dao/SysMenuMapper.xml

@@ -23,7 +23,7 @@
 	</resultMap>
 	<sql id="Base_Column_List" >
 		 id, parent_id, parent_ids, name, sort, href, target, icon, is_show, permission, create_by,
-		 create_date, update_by, update_date, remarks, del_flag, menu_type, can_move
+		 create_date, update_by, update_date, remarks, del_flag, menu_type, can_move,handheld
 	</sql>
 	<select id="selectByPrimaryKey" resultMap="BaseResultMap" parameterType="java.lang.Integer" >
 		select
@@ -95,6 +95,9 @@
 			<if test="menuType != null" >
 				menu_type,	
 			</if>
+			<if test="handheld != null" >
+				handheld,
+			</if>
 		</trim>
 		<trim prefix="values (" suffix=")" suffixOverrides="," >
 			<if test="id != null" >
@@ -148,6 +151,9 @@
 			<if test="menuType != null" >
 				#{menuType,jdbcType=CHAR},	
 			</if>
+			<if test="handheld != null" >
+				#{handheld,jdbcType=CHAR},
+			</if>
 		</trim>
 	</insert>
 	<update id="updateByPrimaryKeySelective" parameterType="com.izouma.awesomeadmin.model.SysMenu" >
@@ -201,6 +207,9 @@
 			<if test="menuType != null" >
 				menu_type = #{menuType,jdbcType=CHAR},	
 			</if>
+			<if test="handheld != null" >
+				handheld = #{handheld,jdbcType=CHAR},
+			</if>
 		</set>
 		where id = #{id,jdbcType=INTEGER}
 	</update>
@@ -259,6 +268,9 @@
 			<if test="record.menuType != null and !&quot;&quot;.equals(record.menuType)">
 				and menu_type = #{record.menuType}	
 			</if>
+			<if test="record.handheld != null and !&quot;&quot;.equals(record.handheld)">
+				and handheld = #{record.handheld}
+			</if>
 		</where>
 		order by id desc
 	</select>
@@ -317,6 +329,9 @@
 			<if test="menuType != null and !&quot;&quot;.equals(menuType)">
 				and menu_type = #{menuType}	
 			</if>
+			<if test="handheld != null and !&quot;&quot;.equals(handheld)">
+				and handheld = #{handheld}
+			</if>
 		</where>
 		order by id desc
 	</select>
@@ -375,6 +390,9 @@
 			<if test="menuType != null and !&quot;&quot;.equals(menuType)">
 				and menu_type = #{menuType}	
 			</if>
+			<if test="handheld != null and !&quot;&quot;.equals(handheld)">
+				and handheld = #{handheld}
+			</if>
 		</where>
 		LIMIT 1
 	</select>

src/main/java/com/izouma/awesomeadmin/model/SysMenu.java

@@ -53,6 +53,8 @@ public class SysMenu implements Cloneable {
 
     private String canMove;
 
+    private String handheld;
+
     private List<SysMenu> children;
 
     public void setId(Integer id) {
@@ -230,5 +232,13 @@ public class SysMenu implements Cloneable {
     public void setCanMove(String canMove) {
         this.canMove = canMove;
     }
+
+    public String getHandheld() {
+        return handheld;
+    }
+
+    public void setHandheld(String handheld) {
+        this.handheld = handheld;
+    }
 }
 

src/main/java/com/izouma/awesomeadmin/model/TableField.java

@@ -175,6 +175,8 @@ public class TableField {
 
     private Boolean logicalKey;
 
+    private String orderFlag;
+
 
     public void setId(Integer id) {
         this.id = id;
@@ -441,5 +443,13 @@ public class TableField {
     public void setApiFlag(String apiFlag) {
         this.apiFlag = apiFlag;
     }
+
+    public String getOrderFlag() {
+        return orderFlag;
+    }
+
+    public void setOrderFlag(String orderFlag) {
+        this.orderFlag = orderFlag;
+    }
 }
 

src/main/java/com/izouma/awesomeadmin/service/SysMenuService.java

@@ -27,9 +27,9 @@ public interface SysMenuService {
 
     boolean updateSysMenu(SysMenu record);
 
-    List<SysMenu> getMenuTree();
+    List<SysMenu> getMenuTree(String handheld);
 
-    List<SysMenu> getMenuTree(Integer userId);
+    List<SysMenu> getMenuTree(Integer userId, String handheld);
 
     List<TreeNode> getMenuTree(boolean all, Integer userId);
 

src/main/java/com/izouma/awesomeadmin/service/impl/SysMenuServiceImpl.java

@@ -201,10 +201,12 @@ public class SysMenuServiceImpl implements SysMenuService {
     }
 
     @Override
-    public List<SysMenu> getMenuTree() {
+    public List<SysMenu> getMenuTree(String handheld) {
         logger.info("getMenuTree");
         try {
-            List<SysMenu> allMenus = getSysMenuList(new SysMenu());
+            SysMenu sysMenu = new SysMenu();
+            sysMenu.setHandheld(handheld);//判断是否为手持机目录
+            List<SysMenu> allMenus = getSysMenuList(sysMenu);
             List<SysMenu> tree = new ArrayList<>();
             makeTree(allMenus, tree);
             return tree;
@@ -215,11 +217,11 @@ public class SysMenuServiceImpl implements SysMenuService {
     }
 
     @Override
-    public List<SysMenu> getMenuTree(Integer userId) {
+    public List<SysMenu> getMenuTree(Integer userId, String handheld) {
         logger.info("getMenuTree");
         try {
             List<SysMenu> nodes = new ArrayList<>();
-            List<SysMenu> entireTree = getMenuTree();
+            List<SysMenu> entireTree = getMenuTree(handheld);
             List<String> menuIds = new ArrayList<>();
             for (SysRole role : sysRoleService.getUserRoles(userId)) {
                 if (StringUtils.isNotEmpty(role.getMenuIds())) {

src/main/java/com/izouma/awesomeadmin/web/CommonQueryController.java

@@ -5,6 +5,7 @@ import com.izouma.awesomeadmin.dto.Page;
 import com.izouma.awesomeadmin.dto.Result;
 import com.izouma.awesomeadmin.model.CommonQuery;
 import com.izouma.awesomeadmin.service.CommonQueryService;
+import com.izouma.awesomeadmin.util.ExportExcelUtil;
 import net.sf.json.JSONObject;
 import org.apache.shiro.authz.annotation.RequiresAuthentication;
 import org.springframework.beans.factory.annotation.Autowired;
@@ -14,6 +15,7 @@ import org.springframework.web.bind.annotation.RequestMethod;
 import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.bind.annotation.ResponseBody;
 
+import javax.servlet.http.HttpServletResponse;
 import java.util.HashMap;
 import java.util.List;
 import java.util.Map;
@@ -117,5 +119,52 @@ public class CommonQueryController {
     }
 
 
+    @RequestMapping(value = "/exportExcel", method = RequestMethod.GET)
+    @ResponseBody
+    public void exportExcel(HttpServletResponse response, CommonQuery record) throws Exception {
+        List<Map> pp = commonQueryService.getTableListAll(record);
+
+        String sheetName = record.getTableName();
+        String titleName = record.getTableName();
+        String fileName = record.getTableName();
+
+        if (pp.size() > 0) {
+            int columnNumber = pp.get(0).size();
+            int[] columnWidth = new int[pp.get(0).size()];
+            String[] columnName = new String[pp.get(0).size()];
+            for (int i = 0; i < pp.get(0).size(); i++) {
+                columnWidth[i] = 20;
+
+            }
+            int columnIndex = 0;
+            for (Object key : pp.get(0).keySet()) {
+                columnName[columnIndex] = String.valueOf(key);
+                columnIndex++;
+            }
+
+            String[][] dataList = new String[pp.size()][12];
+
+            for (int i = 0; i < pp.size(); i++) {
+
+
+                for (int j = 0; j < columnName.length; j++) {
+                    for (Object key : pp.get(i).keySet()) {
+                        if (columnName[j].equals(key)) {
+                            dataList[i][j] = String.valueOf(String.valueOf(pp.get(i).get(key)));
+                        }
+                    }
+                }
+
+
+            }
+
+            ExportExcelUtil.ExportWithResponse(sheetName, titleName, fileName,
+                    columnNumber, columnWidth, columnName, dataList, response);
+        }
+
+
+    }
+
+
 }
 

src/main/java/com/izouma/awesomeadmin/web/SysMenuController.java

@@ -137,7 +137,7 @@ public class SysMenuController {
     @RequestMapping(value = "/menuTree", method = RequestMethod.GET)
     @ResponseBody
     public Result menuTree() {
-        List<SysMenu> trees = sysMenuService.getMenuTree();
+        List<SysMenu> trees = sysMenuService.getMenuTree(null);//获取全部目录树
         if (trees != null) {
             return new Result(true, trees);
         }
@@ -147,12 +147,23 @@ public class SysMenuController {
     @RequestMapping(value = "/userMenuTree", method = RequestMethod.GET)
     @ResponseBody
     public Result userMenuTree(@RequestParam("userId") Integer userId) {
-        List<SysMenu> trees = sysMenuService.getMenuTree(userId);
+        List<SysMenu> trees = sysMenuService.getMenuTree(userId, "N");//后台管理目录
         if (trees != null) {
             return new Result(true, trees);
         }
         return new Result(false, "获取失败");
     }
 
+    @RequestMapping(value = "/userHandheldMenuTree", method = RequestMethod.GET)
+    @ResponseBody
+    public Result userHandheldMenuTree(@RequestParam("userId") Integer userId) {
+        List<SysMenu> trees = sysMenuService.getMenuTree(userId, "Y");//手持机目录
+        if (trees != null) {
+            return new Result(true, trees);
+        }
+        return new Result(false, "获取失败");
+    }
+
+
 }
 

src/main/vue/src/pages/CommonQuery.vue

@@ -93,7 +93,7 @@ export default {
         onSave() {
             this.$refs.form.validate((valid) => {
                 if (valid) {
-                    this.submit();
+                    this.logicalValidate();
                 } else {
                     return false;
                 }
@@ -125,6 +125,10 @@ export default {
                         formDataTemp[key] = format(formDataTemp[key], 'YYYY/MM/DD HH:mm', { locale: zh });
                     } else if (formType == 'multiSelect') {
                         formDataTemp[key] = formDataTemp[key].join();
+                    } else if (formType == 'currentTime') {
+                        formDataTemp[key] = format(new Date(), 'YYYY/MM/DD HH:mm', { locale: zh });
+                    } else if (formType == 'currentDate') {
+                        formDataTemp[key] = format(new Date(), 'YYYY/MM/DD', { locale: zh });
                     }
 
 
@@ -171,6 +175,23 @@ export default {
                                 res.data[element.name] = res.data[element.name] ? res.data[element.name].split(',').map(i => String(i)) : [];
                             }
 
+                            if (element.formType == "loginName") {
+                                res.data[element.name] = this.userInfo.username;
+                            }
+                            if (element.formType == "workNumber") {
+                                res.data[element.name] = this.userInfo.workNumber;
+                            }
+                            if (element.formType == "departId") {
+                                res.data[element.name] = this.userInfo.departId;
+                            }
+                            if (element.formType == "departId") {
+                                res.data[element.name] = this.userInfo.departId;
+                            }
+                            if (element.formType == "departId") {
+                                res.data[element.name] = this.userInfo.departId;
+                            }
+
+
                         });
 
                         this.formData = res.data;
@@ -188,6 +209,111 @@ export default {
 
 
         },
+        logicalValidate() {
+
+            var formDataTemp = JSON.parse(JSON.stringify(this.formData));
+
+            for (var key in formDataTemp) {
+                var flag = 0;
+                var formType = 'singleLineText';
+
+                this.tableColumns.forEach(element => {
+                    if (element.name == key) {
+                        flag = 1;
+                        formType = element.formType;
+                    }
+
+                });
+
+                if (!flag) {
+
+                    delete formDataTemp[key];
+                } else {
+                    if (formType == 'date') {
+                        formDataTemp[key] = format(formDataTemp[key], 'YYYY/MM/DD HH:mm', { locale: zh });
+                    } else if (formType == 'datetime') {
+                        formDataTemp[key] = format(formDataTemp[key], 'YYYY/MM/DD HH:mm', { locale: zh });
+                    } else if (formType == 'multiSelect') {
+                        formDataTemp[key] = formDataTemp[key].join();
+                    }
+
+
+                }
+
+
+
+            }
+
+
+            var logicalKeyStr = '';
+
+            var logicalData = {
+            }
+
+            var advancedQuerySearchKey = '';
+
+            this.tableColumns.forEach(element => {
+                if (element.logicalKey) {
+                    logicalKeyStr += element.remark + ';'
+                    var tempSearchKey = 'AND' + '_,' + element.name + '_,' + '=' + '_,' + formDataTemp[element.name];
+                    if (advancedQuerySearchKey) {
+                        advancedQuerySearchKey = advancedQuerySearchKey + '_;' + tempSearchKey;
+                    } else {
+                        advancedQuerySearchKey = tempSearchKey;
+                    }
+                }
+
+            });
+
+
+            if (!advancedQuerySearchKey) {
+                this.submit();
+            } else {
+
+
+
+                logicalData.tableName = this.tableName;
+                logicalData.databasetype = this.databasetype;
+                logicalData.dataSourceCode = this.dataSourceCode;
+                logicalData.advancedQuery = advancedQuerySearchKey;
+
+                this.$http.get({
+                    url: '/commonQuery/one',
+                    data: logicalData
+                }).then(res => {
+                    if (res.success) {
+
+                        var logicalFlag = true;
+
+                        if (res.data) {
+                            if (this.formData.id) {
+                                if (res.data.id != this.formData.id) {
+                                    logicalFlag = false;
+                                }
+                            } else if (this.formData.ID) {
+                                if (res.data.ID != this.formData.ID) {
+                                    logicalFlag = false;
+                                }
+                            } else {
+                                logicalFlag = false;
+                            }
+
+                        }
+
+                        if (logicalFlag) {
+                            this.submit();
+                        } else {
+                            this.$message.warning('逻辑关键字:' + logicalKeyStr + '验证失败')
+                        }
+
+
+                    } else {
+                        this.$message.warning('逻辑关键字:' + logicalKeyStr + '验证失败')
+                    }
+                });
+            }
+        },
+
         getTableBase() {
 
             this.$http.get({

src/main/vue/src/pages/CommonQuerys.vue

@@ -13,6 +13,9 @@
             <el-button v-if="isModulesShow('add')" @click="$router.push({path:'/commonQuery',query:{code:$route.query.code,column:$route.query.column}})" type="primary" size="small" icon="el-icon-edit" class="filter-item">添加
             </el-button>
 
+            <el-button v-if="isModulesShow('excel')" @click="exportExcel" type="primary" size="small" icon="el-icon-share" class="filter-item">导出EXCEL
+            </el-button>
+
             <el-dropdown trigger="click" size="medium" class="table-column-filter">
                 <span>
                     筛选数据
@@ -205,6 +208,16 @@ export default {
                         columns.forEach(element => {
                             element.show = true;
                             this.tableColumns.push(element);
+
+                            if (element.orderFlag) {
+                                var tempOrderKey = element.name + '_,' + element.orderFlag;
+                                if (this.orderByStr) {
+                                    this.orderByStr = this.orderByStr + '_;' + tempOrderKey;
+                                } else {
+                                    this.orderByStr = tempOrderKey;
+                                }
+                            }
+
                         });
 
                         if (res.data.subJson) {
@@ -394,7 +407,12 @@ export default {
             })
         },
 
-
+        exportExcel() {
+             window.location.href = this.$baseUrl + "/commonQuery/exportExcel?advancedQuery="
+                 + this.advancedQuerySearchKey + "&tableName=" + this.tableName + "&databasetype=" + this.databasetype
+                 + "&searchColumn=" + this.searchColumn+ "&searchKey=" + this.filter1+ "&orderByStr=" + this.orderByStr
+                 + "&dataSourceCode=" + this.dataSourceCode;
+        },
     },
     watch: {
         $route() {

src/main/vue/src/pages/Menus.vue

@@ -24,11 +24,24 @@
                 </el-form-item>
                 <el-form-item prop="icon">
                     <template slot="label">图标
-                        <a href="https://fontawesome.com/icons?d=gallery&s=brands,solid&m=free" target="_blank" class="available-icons">查看所有可用图标</a></template>
+                        <a href="https://fontawesome.com/icons?d=gallery&s=brands,solid&m=free" target="_blank" class="available-icons">查看所有可用图标</a>
+                    </template>
                     <el-input v-model="icon">
-                        <template slot="append"><span ref="iconContainer" style="font-size: 18px"><i class="fas fa-"></i></span></template>
+                        <template slot="append">
+                            <span ref="iconContainer" style="font-size: 18px">
+                                <i class="fas fa-"></i>
+                            </span>
+                        </template>
                     </el-input>
                 </el-form-item>
+                <el-form-item label="手持机" prop="handheld">
+                    <el-select placeholder="手持机" size="small" v-model="menu.handheld" class="filter-item">
+                        <el-option label="N" value="N">
+                        </el-option>
+                        <el-option label="Y" value="Y">
+                        </el-option>
+                    </el-select>
+                </el-form-item>
             </el-form>
             <div slot="footer">
                 <el-button @click="dialogVisible = false" size="small">取消</el-button>
@@ -67,7 +80,8 @@ export default {
             menu: {
                 name: '',
                 href: '',
-                icon: ''
+                icon: '',
+                handheld: '',
             },
             icon: '',
             roleShow: false,
@@ -86,7 +100,8 @@ export default {
                 parentId: 0,
                 name: '',
                 href: '',
-                icon: 'bars'
+                icon: 'bars',
+                handheld: '',
             };
             this.icon = 'bars';
             if (this.menus && this.menus.length > 0) {
@@ -104,7 +119,8 @@ export default {
                 parentId: node.data.id,
                 name: '',
                 href: '',
-                icon: null
+                icon: null,
+                handheld: '',
             };
             this.icon = '';
             if (node.childNodes && node.childNodes.length > 0) {
@@ -130,7 +146,8 @@ export default {
                 id: data.id,
                 name: data.name,
                 href: data.href,
-                icon: iconName
+                icon: iconName,
+                handheld: data.handheld,
             };
             this.icon = iconName;
             this.dialogVisible = true;

src/main/vue/src/pages/QueryConfig.vue

@@ -46,6 +46,8 @@
                     </el-option>
                     <el-option label="删除" value="del">
                     </el-option>
+                    <el-option label="导出" value="excel">
+                    </el-option>
                 </el-select>
             </el-form-item>
 
@@ -53,7 +55,7 @@
                 <el-tabs value="1" type="border-card">
                     <el-tab-pane label="字段" name="1">
 
-                        <el-table :data="tablecolumnsFields">
+                        <el-table :data="tablecolumnsFields" border>
 
                             <el-table-column prop="value" label="字段" width="150" align="center">
                                 <template slot-scope="{row}">
@@ -92,9 +94,11 @@
                             </el-table-column>
                         </el-table>
                         <el-button @click="addField" type="text" icon="el-icon-plus">添加</el-button>
+                        <el-button @click="changeRankDialog = !changeRankDialog" type="primary" size="small" icon="el-icon-sort" class="filter-item">排序
+                        </el-button>
                     </el-tab-pane>
                     <el-tab-pane label="表单校验" name="2">
-                        <el-table :data="tablecolumnsFields">
+                        <el-table :data="tablecolumnsFields" border>
 
                             <el-table-column prop="name" label="字段" width="150" align="center">
                             </el-table-column>
@@ -102,6 +106,12 @@
                             <el-table-column prop="remark" label="显示" width="150" align="center">
                             </el-table-column>
 
+                            <el-table-column prop="logicalKey" label="逻辑关键字" width="50" align="center">
+                                <template slot-scope="{row}">
+                                    <el-checkbox v-model="row.logicalKey"></el-checkbox>
+                                </template>
+                            </el-table-column>
+
                             <el-table-column prop="required" label="必填" width="50" align="center">
                                 <template slot-scope="{row}">
                                     <el-checkbox v-model="row.required"></el-checkbox>
@@ -141,7 +151,7 @@
                             </el-table-column>
                         </el-table>
                     </el-tab-pane>
-                    <el-tab-pane label="子表" name="3">
+                    <el-tab-pane label="子表" name="3" border>
                         <el-table :data="subtables">
 
                             <el-table-column prop="name" label="控件名" width="150" align="center">
@@ -176,6 +186,28 @@
                         </el-table>
                         <el-button @click="addSubtable" type="text" icon="el-icon-plus">添加</el-button>
                     </el-tab-pane>
+                    <el-tab-pane label="排序" name="4">
+                        <el-table :data="tablecolumnsFields" border>
+
+                            
+                            <el-table-column prop="name" label="字段" width="150" align="center">
+                            </el-table-column>
+
+                            <el-table-column prop="remark" label="显示" width="150" align="center">
+                            </el-table-column>
+
+                            <el-table-column prop="orderFlag" label="排序" align="center">
+                                <template slot-scope="{row}">
+                                    <el-select v-model="row.orderFlag" clearable >
+                                        <el-option label="降序" value="desc">
+                                        </el-option>
+                                        <el-option label="升序" value="asc">
+                                        </el-option>
+                                    </el-select>
+                                </template>
+                            </el-table-column>
+                        </el-table>
+                    </el-tab-pane>
                 </el-tabs>
             </el-form-item>
 
@@ -184,6 +216,14 @@
                 <el-button @click="$router.go(-1)">取消</el-button>
             </el-form-item>
         </el-form>
+
+        <el-dialog title="调整顺序" :visible.sync="changeRankDialog">
+            <div class="colorList">
+                <div class="color-item" v-for="color in tablecolumnsFields" v-dragging="{ item: color, list: tablecolumnsFields, group: 'color' }" :key="color.name">{{color.name}}——{{color.remark}}</div>
+
+            </div>
+        </el-dialog>
+
     </div>
 </template>
 <script>
@@ -307,6 +347,11 @@ export default {
                 { label: '单选下拉框', value: 'select' },
                 { label: '多选下拉框', value: 'multiSelect' },
                 { label: '单图上传', value: 'singleImage' },
+                { label: '登录名', value: 'loginName' },
+                { label: '工号', value: 'workNumber' },
+                { label: '部门', value: 'departId' },
+                { label: '当前时间', value: 'currentTime' },
+                { label: '当前日期', value: 'currentDate' },
             ],
             validatorTypes: [
                 { label: '英文', value: 'english' },
@@ -328,6 +373,7 @@ export default {
             tableList: [],
             subtables: [],
             subCodes: [],
+            changeRankDialog: false,
 
         }
     },
@@ -377,6 +423,7 @@ export default {
                 label: '',
                 value: '',
                 type: 'singleLineText',
+                orderFlag: '',
             });
         },
         removeField(i) {
@@ -463,4 +510,20 @@ export default {
 }
 </script>
 <style lang="less" scoped>
+.color-item {
+    height: 42px;
+    font-size: 14px;
+    border-bottom: 1px solid #eee;
+    line-height: 42px;
+    padding: 0 20px;
+    cursor: move;
+    &:last-child {
+        border-bottom: none;
+    }
+}
+.colorList {
+    border: 1px solid #eee;
+    max-height: 60vh;
+    overflow: auto;
+}
 </style>

src/main/vue/src/pages/TestAaa.vue

@@ -1,79 +1,61 @@
 <template>
     <div>
-        <el-form :model="formData" :rules="rules" ref="form" label-width="120px" label-position="right" size="small"
-                 style="max-width: 500px;">
+        <el-form :model="formData" :rules="rules" ref="form" label-width="120px" label-position="right" size="small" style="max-width: 500px;">
             <el-form-item>
                 <h2> test_aaa</h2>
             </el-form-item>
 
-                                                                                                                                                                                                                                                                 <el-form-item prop="imageUrl" label="图片">
-                 <single-upload v-model="formData.imageUrl" :disabled="'imageUrl'==subColumn"></single-upload>
-             </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                            <el-form-item prop="testName" label="枚举单选">
+            <el-form-item prop="imageUrl" label="图片">
+                <single-upload v-model="formData.imageUrl" :disabled="'imageUrl'==subColumn"></single-upload>
+            </el-form-item>
+            <el-form-item prop="testName" label="枚举单选">
                 <template>
-                    <el-select v-model="formData.testName" clearable  placeholder="请选择" :disabled="'testName'==subColumn">
-                        <el-option
-                                v-for="item in testNameOptions"
-                                :key="item.value"
-                                :label="item.label"
-                                :value="item.value">
+                    <el-select v-model="formData.testName" clearable placeholder="请选择" :disabled="'testName'==subColumn">
+                        <el-option v-for="item in testNameOptions" :key="item.value" :label="item.label" :value="item.value">
                         </el-option>
                     </el-select>
                 </template>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                                                                    <el-form-item prop="remark" label="接口单选">
+            <el-form-item prop="remark" label="接口单选">
                 <template>
-                    <el-select v-model="formData.remark" clearable  placeholder="请选择" :disabled="'remark'==subColumn">
-                        <el-option
-                                v-for="item in remarkOptions"
-                                :key="item.value"
-                                :label="item.label"
-                                :value="item.value">
+                    <el-select v-model="formData.remark" clearable placeholder="请选择" :disabled="'remark'==subColumn">
+                        <el-option v-for="item in remarkOptions" :key="item.value" :label="item.label" :value="item.value">
                         </el-option>
                     </el-select>
                 </template>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                        <el-form-item prop="multiSelect" label="表多选">
+            <el-form-item prop="multiSelect" label="表多选">
                 <template>
                     <el-select v-model="formData.multiSelect" multiple clearable placeholder="请选择" :disabled="'multiSelect'==subColumn">
-                        <el-option
-                                v-for="item in multiSelectOptions"
-                                :key="item.value"
-                                :label="item.label"
-                                :value="item.value">
+                        <el-option v-for="item in multiSelectOptions" :key="item.value" :label="item.label" :value="item.value">
                         </el-option>
                     </el-select>
                 </template>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                        <el-form-item prop="testTime" label="时间">
+            <el-form-item prop="testTime" label="时间">
                 <template>
                     <div class="block">
-                        <el-date-picker
-                                v-model="formData.testTime"
-                                type="date"
-                                value-format="timestamp"
-                                placeholder="选择日期"
-                                :disabled="'testTime'==subColumn">
+                        <el-date-picker v-model="formData.testTime" type="date" value-format="timestamp" placeholder="选择日期" :disabled="'testTime'==subColumn">
                         </el-date-picker>
                     </div>
                 </template>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        <el-form-item prop="loginUser" label="登录名">
-                            <el-input v-model="formData.loginUser" disabled style="width: 215px;"></el-input>
-                        </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            <el-form-item prop="testcTime" label="当前时间">
-                            <el-input v-model="formData.testcTime" disabled style="width: 215px;"></el-input>
-                        </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    <el-form-item prop="testcDate" label="当前日期">
-                            <el-input v-model="formData.testcDate" disabled style="width: 215px;"></el-input>
-                        </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                    <el-form-item prop="workNumber" label="工号">
-                            <el-input v-model="formData.workNumber" disabled style="width: 215px;"></el-input>
-                        </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    <el-form-item prop="departId" label="部门">
-                            <el-input v-model="formData.departId" disabled style="width: 215px;"></el-input>
-                        </el-form-item>
-                                                                                                    <el-form-item>
+            <el-form-item prop="loginUser" label="登录名">
+                <el-input v-model="formData.loginUser" disabled style="width: 215px;"></el-input>
+            </el-form-item>
+            <el-form-item prop="testcTime" label="当前时间">
+                <el-input v-model="formData.testcTime" disabled style="width: 215px;"></el-input>
+            </el-form-item>
+            <el-form-item prop="testcDate" label="当前日期">
+                <el-input v-model="formData.testcDate" disabled style="width: 215px;"></el-input>
+            </el-form-item>
+            <el-form-item prop="workNumber" label="工号">
+                <el-input v-model="formData.workNumber" disabled style="width: 215px;"></el-input>
+            </el-form-item>
+            <el-form-item prop="departId" label="部门">
+                <el-input v-model="formData.departId" disabled style="width: 215px;"></el-input>
+            </el-form-item>
+            <el-form-item>
                 <el-button @click="onSave" :loading="$store.state.fetchingData" type="primary">保存</el-button>
                 <el-button @click="onDelete" v-if="formData.id&&isModulesShow('del')" type="danger">删除</el-button>
                 <el-button @click="changeEditDialogVisible(false)">取消</el-button>
@@ -88,201 +70,201 @@ import { format } from 'date-fns'
 import zh from 'date-fns/locale/zh_cn'
 
 export default {
-    props:{
-        formData:{
-            type:Object,
-            default:{
-                                                                                                                                                                                                                                                                                
-            multiSelect : [],
+    props: {
+        formData: {
+            type: Object,
+            default: {
 
-                                                                                                                                                    loginUser : '',
+                multiSelect: [],
 
-                                                        testcTime : format(new Date(), 'YYYY/MM/DD HH:mm', { locale: zh }),
+                loginUser: '',
 
-                                                                                testcDate : format(new Date(), 'YYYY/MM/DD', { locale: zh }),
+                testcTime: format(new Date(), 'YYYY/MM/DD HH:mm', { locale: zh }),
 
-                                                                                        workNumber : '',
+                testcDate: format(new Date(), 'YYYY/MM/DD', { locale: zh }),
 
-                                                                                departId : '',
+                workNumber: '',
 
-                        }
+                departId: '',
+
+            }
         }
     },
 
     created() {
 
-                                                                                                                                                                                                                                                                                                
 
 
-                    this.$http.get({
-                        url:'/testBbb/all'
-                    }).then(res => {
-                        if (res.success) {
 
-                    if (res.data.length > 0) {
-                        res.data.forEach(item => {
-                            this.remarkOptions.push({label: item.nameAaa, value:item.id});
+        this.$http.get({
+            url: '/testBbb/all'
+        }).then(res => {
+            if (res.success) {
+
+                if (res.data.length > 0) {
+                    res.data.forEach(item => {
+                        this.remarkOptions.push({ label: item.nameAaa, value: item.id });
                     })
-                    }
                 }
-                });
-                                                                                                                        this.$http.get({
-                        url:'/commonQuery/all',
-                        data: {
-                            tableName: 'test_bbb',
-                            databasetype: 'Mysql',
-                            dataSourceCode: 'dataSource',
-                        }
-                    }).then(res => {
-                        if (res.success) {
+            }
+        });
+        this.$http.get({
+            url: '/commonQuery/all',
+            data: {
+                tableName: 'test_bbb',
+                databasetype: 'Mysql',
+                dataSourceCode: 'dataSource',
+            }
+        }).then(res => {
+            if (res.success) {
 
-                    if (res.data.length > 0) {
-                        res.data.forEach(item => {
-                            this.multiSelectOptions.push({label: item.name_ccc, value:item.id});
+                if (res.data.length > 0) {
+                    res.data.forEach(item => {
+                        this.multiSelectOptions.push({ label: item.name_ccc, value: item.id });
                     })
-                    }
                 }
-                });
-                                                                                                                                                                        this.formData.loginUser = this.userInfo.username;
-                                                                                                                                                                                                                this.formData.workNumber = this.userInfo.workNumber;
-                                                                                                this.formData.departId = this.userInfo.departId;
-                        },
+            }
+        });
+        this.formData.loginUser = this.userInfo.username;
+        this.formData.workNumber = this.userInfo.workNumber;
+        this.formData.departId = this.userInfo.departId;
+    },
     data() {
         return {
             saving: false,
-        rules: {
-                                                                                                                                    testName:
-                [
-                                            {required: true, message: '请输入 枚举单选', trigger: 'blur'},
-                                                        ],
-                                                                remark:
-                [
-                                            {required: true, message: '请输入 接口单选', trigger: 'blur'},
-                                                        ],
-                                                                multiSelect:
-                [
-                                            {required: true, message: '请输入 表多选', trigger: 'blur'},
-                                                        ],
-                                                                                                                                                                                                            },
-        modules:            'search,query,orders,edit,excel,add,del'.split(',').map(i => String(i))
-     ,
-                                                                                                                            testNameOptions:[{ label: 'A', value: 'A' }, { label: 'B', value: 'B' },{ label: 'C', value: 'C' }],
-                                                                                    remarkOptions:[],
-                                                                                    multiSelectOptions:[],
-                                                                                                                                                                }
+            rules: {
+                testName:
+                    [
+                        { required: true, message: '请输入 枚举单选', trigger: 'blur' },
+                    ],
+                remark:
+                    [
+                        { required: true, message: '请输入 接口单选', trigger: 'blur' },
+                    ],
+                multiSelect:
+                    [
+                        { required: true, message: '请输入 表多选', trigger: 'blur' },
+                    ],
+            },
+            modules: 'search,query,orders,edit,excel,add,del'.split(',').map(i => String(i))
+            ,
+            testNameOptions: [{ label: 'A', value: 'A' }, { label: 'B', value: 'B' }, { label: 'C', value: 'C' }],
+            remarkOptions: [],
+            multiSelectOptions: [],
+        }
     },
     computed: {
-            ...mapState(['userInfo']),
-                subColumn(){
-                if(this.formData.subColumn){
-                   return  this.formData.subColumn;
-                }else{
-                    return '';
-                }
+        ...mapState(['userInfo']),
+        subColumn() {
+            if (this.formData.subColumn) {
+                return this.formData.subColumn;
+            } else {
+                return '';
+            }
         },
-},
-methods: {
-    changeEditDialogVisible(value){
-        this.$emit('changeEditDialogVisible',value)
-    },
-    isModulesShow(column) {
-        var row = this.modules.find(i => i === column);
-        return row ? true : false;
     },
-    onSave() {
-        this.$refs.form.validate((valid) => {
-            if (valid) {
-                this.logicalValidate();
+    methods: {
+        changeEditDialogVisible(value) {
+            this.$emit('changeEditDialogVisible', value)
+        },
+        isModulesShow(column) {
+            var row = this.modules.find(i => i === column);
+            return row ? true : false;
+        },
+        onSave() {
+            this.$refs.form.validate((valid) => {
+                if (valid) {
+                    this.logicalValidate();
+                } else {
+                    return false;
+                }
+            });
+        },
+        logicalValidate() {
+            var data = JSON.parse(JSON.stringify(this.formData));
+
+            var logicalData = {
+                testName: data.testName,
+                remark: data.remark,
+            }
+
+            if (JSON.stringify(logicalData) == '{}') {
+                this.submit();
             } else {
-                return false;
-    }
-    });
-    },
-    logicalValidate() {
-        var data = JSON.parse(JSON.stringify(this.formData));
+                this.$http.get({
+                    url: '/testAaa/getOne',
+                    data: logicalData
+                }).then(res => {
+                    if (res.success) {
 
-        var logicalData = {
-                                                                                                testName:data.testName,
-                                                remark:data.remark,
-                                                                                                                                                                    }
+                        var logicalFlag = true;
 
-        if (JSON.stringify(logicalData) == '{}') {
-            this.submit();
-        } else {
-            this.$http.get({
-                url: '/testAaa/getOne',
-                data: logicalData
-            }).then(res => {
-                if (res.success) {
+                        if (res.data) {
+                            if (this.formData.id) {
+                                if (res.data.id != this.formData.id) {
+                                    logicalFlag = false;
+                                }
+                            } else {
+                                logicalFlag = false;
+                            }
 
-                var logicalFlag = true;
+                        }
 
-                if (res.data) {
-                    if (this.formData.id) {
-                        if (res.data.id != this.formData.id) {
-                            logicalFlag = false;
+                        if (logicalFlag) {
+                            this.submit();
+                        } else {
+                            this.$message.warning('逻辑关键字:' + '枚举单选,接口单选,' + '验证失败')
                         }
-                    } else {
-                        logicalFlag = false;
-                    }
 
-                }
 
-                if (logicalFlag) {
-                    this.submit();
-                } else {
-                    this.$message.warning('逻辑关键字:'+'枚举单选,接口单选,'+'验证失败')
-                }
+                    } else {
+                        this.$message.warning('逻辑关键字:' + '枚举单选,接口单选,' + '验证失败')
+                    }
+                });
+            }
+        },
+        submit() {
+            var data = JSON.parse(JSON.stringify(this.formData));
 
+            if (data.testcTime) {
+                data.testcTime = Date.parse(new Date(data.testcTime));
+            }
 
-            } else {
-                this.$message.warning('逻辑关键字:'+'枚举单选,接口单选,'+'验证失败')
+            if (data.testcDate) {
+                data.testcDate = Date.parse(new Date(data.testcDate));
             }
-        });
-        }
-    },
-    submit() {
-        var data = JSON.parse(JSON.stringify(this.formData));
 
-                                                                                                                                                                                                    if(data.testcTime){
-                    data.testcTime = Date.parse(new Date(data.testcTime));
-                }
 
-                                                if(data.testcDate){
-                    data.testcDate = Date.parse(new Date(data.testcDate));
+            this.$http.post({
+                url: this.formData.id ? '/testAaa/update' : '/testAaa/save',
+                data: data
+            }).then(res => {
+                if (res.success) {
+                    this.$message.success('成功');
+                    this.$emit('changeEdit')
+                } else {
+                    this.$message.warning('失败')
+                }
+            });
+        },
+        onDelete() {
+            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' }).then(() => {
+                return this.$http.post({
+                    url: '/testAaa/del',
+                    data: { id: this.formData.id }
+                })
+            }).then(() => {
+                this.$message.success('删除成功');
+                this.$emit('changeEdit')
+            }).catch(action => {
+                if (action === 'cancel') {
+                    this.$message.info('删除取消');
+                } else {
+                    this.$message.error('删除失败');
                 }
-
-                                                            
-    this.$http.post({
-        url: this.formData.id ? '/testAaa/update' : '/testAaa/save',
-        data: data
-    }).then(res => {
-        if (res.success) {
-            this.$message.success('成功');
-            this.$emit('changeEdit')
-        } else {
-            this.$message.warning('失败')
-        }
-    });
-    },
-    onDelete() {
-        this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' }).then(() => {
-            return this.$http.post({
-                url: '/testAaa/del',
-                data: { id: this.formData.id }
             })
-        }).then(() => {
-            this.$message.success('删除成功');
-        this.$emit('changeEdit')
-    }).catch(action => {
-            if (action === 'cancel') {
-            this.$message.info('删除取消');
-        } else {
-            this.$message.error('删除失败');
-        }
-    })
-    },
-}
+        },
+    }
 }
 </script>
 <style lang="less" scoped>