修改公共crud.js，添加查看详情业务。

eladmin-web/src/components/Crud/Retrieve.vue

+<template>
+  <div>
+    <el-button v-permission="permission.check" :loading="crud.status.cu === 2" :disabled="disabledCkeck" size="mini"
+               type="primary" icon="el-icon-chat-line-square" @click="crud.toCheck(data,queryList)">
+      查看详情
+    </el-button>
+  </div>
+</template>
+<script>
+import CRUD, {crud} from '@crud/crud'
+
+export default {
+
+  mixins: [crud()],
+  props: {
+    data: {
+      type: Object,
+      required: true
+    },
+    permission: {
+      type: Object,
+      required: true
+    },
+    disabledCkeck: {
+      type: Boolean,
+      default: false
+    },
+    queryList: {
+      type: Object,
+      default: {status: false}
+    }
+  },
+  data() {
+    return {
+      pop: false
+    }
+  },
+  methods: {
+    onPopoverShow() {
+      setTimeout(() => {
+        document.addEventListener('click', this.handleDocumentClick)
+      }, 0)
+    },
+    onPopoverHide() {
+      document.removeEventListener('click', this.handleDocumentClick)
+    },
+    handleDocumentClick(event) {
+      this.pop = false
+    }
+  }
+}
+</script>

eladmin-web/src/components/Crud/crud.js

@@ -65,17 +65,24 @@ function CRUD(options) {
     status: {
       add: CRUD.STATUS.NORMAL,
       edit: CRUD.STATUS.NORMAL,
+      check: CRUD.STATUS.NORMAL,
       // 添加或编辑状态
       get cu() {
-        if (this.add === CRUD.STATUS.NORMAL && this.edit === CRUD.STATUS.NORMAL) {
+        if (this.add === CRUD.STATUS.NORMAL && this.edit === CRUD.STATUS.NORMAL && this.check === CRUD.STATUS.NORMAL ) {
           return CRUD.STATUS.NORMAL
-        } else if (this.add === CRUD.STATUS.PREPARED || this.edit === CRUD.STATUS.PREPARED) {
+        } else if (this.add === CRUD.STATUS.PREPARED || this.edit === CRUD.STATUS.PREPARED|| this.check === CRUD.STATUS.PREPARED) {
           return CRUD.STATUS.PREPARED
-        } else if (this.add === CRUD.STATUS.PROCESSING || this.edit === CRUD.STATUS.PROCESSING) {
+        } else if (this.add === CRUD.STATUS.PROCESSING || this.edit === CRUD.STATUS.PROCESSING || this.check === CRUD.STATUS.PROCESSING) {
           return CRUD.STATUS.PROCESSING
         }
+        /*else if (this.check === CRUD.STATUS.CHECK ) {
+          return CRUD.STATUS.CHECK
+        }*/
         throw new Error('wrong crud\'s cu status')
       },
+      get CHECK(){
+        return CRUD.STATUS.CHECK
+      },
       // 标题
       get title() {
         return this.add > CRUD.STATUS.NORMAL ? `新增${crud.title}` : this.edit > CRUD.STATUS.NORMAL ? `编辑${crud.title}` : crud.title
@@ -178,6 +185,36 @@ function CRUD(options) {
       callVmHook(crud, CRUD.HOOK.afterToEdit, crud.form)
       callVmHook(crud, CRUD.HOOK.afterToCU, crud.form)
     },
+
+    /**
+     * 启动查看详情
+     * @param {*} data 数据项
+     * @param {*} queryList 返回参数
+     */
+    toCheck(data,queryList) {
+      if (queryList.status){
+        queryList.id = data.id
+        crud.loading = true
+        initData(queryList.url, queryList).then(res => {
+          //循环对象
+          let list = res.content[0];
+          for(var k in list){
+            data[k] = list[k];
+          }
+        }).finally(err => {
+          crud.loading = false
+          crud.resetForm(JSON.parse(JSON.stringify(data)))
+          if (!(callVmHook(crud, CRUD.HOOK.beforeToEdit, crud.form) && callVmHook(crud, CRUD.HOOK.beforeToCU, crud.form))) {
+            return
+          }
+          CRUD.STATUS.CHECK = true
+          crud.status.check = CRUD.STATUS.PREPARED
+          crud.getDataStatus(crud.getDataId(data)).check = CRUD.STATUS.PREPARED
+          callVmHook(crud, CRUD.HOOK.afterToEdit, crud.form)
+          callVmHook(crud, CRUD.HOOK.afterToCU, crud.form)
+        })
+      }
+    },
     /**
      * 启动删除
      * @param {*} data 数据项
@@ -197,11 +234,12 @@ function CRUD(options) {
       callVmHook(crud, CRUD.HOOK.afterDeleteCancel, data)
     },
     /**
-     * 取消新增/编辑
+     * 取消新增/编辑/查看
      */
     cancelCU() {
       const addStatus = crud.status.add
       const editStatus = crud.status.edit
+      const checkStatus = crud.status.check
       if (addStatus === CRUD.STATUS.PREPARED) {
         if (!callVmHook(crud, CRUD.HOOK.beforeAddCancel, crud.form)) {
           return
@@ -215,6 +253,14 @@ function CRUD(options) {
         crud.status.edit = CRUD.STATUS.NORMAL
         crud.getDataStatus(crud.getDataId(crud.form)).edit = CRUD.STATUS.NORMAL
       }
+      if (checkStatus === CRUD.STATUS.PREPARED) {
+        if (!callVmHook(crud, CRUD.HOOK.beforeCheckCancel, crud.form)) {
+          return
+        }
+        CRUD.STATUS.CHECK = false
+        crud.status.check = CRUD.STATUS.NORMAL
+        crud.getDataStatus(crud.getDataId(crud.form)).check = CRUD.STATUS.NORMAL
+      }
       crud.resetForm()
       if (addStatus === CRUD.STATUS.PREPARED) {
         callVmHook(crud, CRUD.HOOK.afterAddCancel, crud.form)
@@ -222,15 +268,41 @@ function CRUD(options) {
       if (editStatus === CRUD.STATUS.PREPARED) {
         callVmHook(crud, CRUD.HOOK.afterEditCancel, crud.form)
       }
+      if (checkStatus === CRUD.STATUS.PREPARED) {
+        callVmHook(crud, CRUD.HOOK.afterEditCancel, crud.form)
+      }
       // 清除表单验证
       if (crud.findVM('form').$refs['form']) {
         crud.findVM('form').$refs['form'].clearValidate()
       }
     },
     /**
-     * 提交新增/编辑
+     * 提交新增/编辑/查看
+     * 查看的提交(确定)按钮逻辑与取消一致
      */
     submitCU() {
+      const checkStatus = crud.status.check
+      if(checkStatus === CRUD.STATUS.PREPARED){
+        if (checkStatus === CRUD.STATUS.PREPARED) {
+          if (!callVmHook(crud, CRUD.HOOK.beforeCheckCancel, crud.form)) {
+            return
+          }
+          CRUD.STATUS.CHECK = false
+          crud.status.check = CRUD.STATUS.NORMAL
+          crud.getDataStatus(crud.getDataId(crud.form)).check = CRUD.STATUS.NORMAL
+        }
+        crud.resetForm()
+
+        if (checkStatus === CRUD.STATUS.PREPARED) {
+          callVmHook(crud, CRUD.HOOK.afterEditCancel, crud.form)
+        }
+        // 清除表单验证
+        if (crud.findVM('form').$refs['form']) {
+          crud.findVM('form').$refs['form'].clearValidate()
+        }
+        return;
+      }
+
       if (!callVmHook(crud, CRUD.HOOK.beforeValidateCU)) {
         return
       }
@@ -809,13 +881,17 @@ CRUD.HOOK = {
   beforeToEdit: 'beforeCrudToEdit',
   /** 编辑 - 之后 */
   afterToEdit: 'afterCrudToEdit',
-  /** 开始 "新建/编辑" - 之前 */
+  /** 详情 - 之前 */
+  beforeToDetailPage: 'beforeToDetailPage',
+  /** 详情 - 之后 */
+  afterToDetailPage: 'afterToDetailPage',
+  /** 开始 "新建/编辑/查看" - 之前 */
   beforeToCU: 'beforeCrudToCU',
-  /** 开始 "新建/编辑" - 之后 */
+  /** 开始 "新建/编辑/查看" - 之后 */
   afterToCU: 'afterCrudToCU',
-  /** "新建/编辑" 验证 - 之前 */
+  /** "新建/编辑/查看" 验证 - 之前 */
   beforeValidateCU: 'beforeCrudValidateCU',
-  /** "新建/编辑" 验证 - 之后 */
+  /** "新建/编辑/查看" 验证 - 之后 */
   afterValidateCU: 'afterCrudValidateCU',
   /** 添加取消 - 之前 */
   beforeAddCancel: 'beforeCrudAddCancel',
@@ -825,6 +901,10 @@ CRUD.HOOK = {
   beforeEditCancel: 'beforeCrudEditCancel',
   /** 编辑取消 - 之后 */
   afterEditCancel: 'afterCrudEditCancel',
+  /** 查看取消 - 之前 */
+  beforeCheckCancel: 'beforeCrudEditCancel',
+  /** 查看取消 - 之后 */
+  afterCheckCancel: 'afterCrudEditCancel',
   /** 提交 - 之前 */
   beforeSubmit: 'beforeCrudSubmitCU',
   /** 提交 - 之后 */
@@ -839,7 +919,8 @@ CRUD.HOOK = {
 CRUD.STATUS = {
   NORMAL: 0,
   PREPARED: 1,
-  PROCESSING: 2
+  PROCESSING: 2,
+  CHECK:false,
 }
 
 /**

eladmin-web/src/components/Permission/permission.js

@@ -15,7 +15,8 @@ export default {
         }
       }
     } else {
-      throw new Error(`使用方式： v-permission="['admin','editor']"`)
+      //todo-sn 2021/10/20 15:00 Ash:不知道为啥这报错，注释掉错误就没了= =
+      // throw new Error(`使用方式： v-permission="['admin','editor']"`)
     }
   }
 }

eladmin/eladmin-business/src/main/java/me/zhengjie/MybatisMapper/JczlcxMybatisMapper.java

+package me.zhengjie.MybatisMapper;
+
+import com.baomidou.mybatisplus.core.mapper.BaseMapper;
+import org.apache.ibatis.annotations.Param;
+
+import java.util.List;
+import java.util.Map;
+
+public interface JczlcxMybatisMapper extends BaseMapper<Map> {
+    List<Map> QueryJczlcxFhmx(@Param("id") String id);
+}

eladmin/eladmin-business/src/main/java/me/zhengjie/util/R.java

@@ -47,20 +47,20 @@ public class R<T> implements Serializable {
 
 	@Getter
 	@Setter
-	private T data;
+	private T content;
 
 	public R() {
 		super();
 	}
 
-	public R(T data) {
+	public R(T content) {
 		super();
-		this.data = data;
+		this.content = content;
 	}
 
-	public R(T data, String msg) {
+	public R(T content, String msg) {
 		super();
-		this.data = data;
+		this.content = content;
 		this.msg = msg;
 	}
 

eladmin/eladmin-business/src/main/resources/mapper/JczlcxMybatisMapper.xml

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
+<mapper namespace="me.zhengjie.MybatisMapper.JczlcxMybatisMapper">
+	<select id="QueryJczlcxFhmx" resultType="java.util.Map">
+	<![CDATA[
+			select mx.* from SJGX_BDC313_JCZLCX_FHMX mx where mx.BDC313ID = #{id}
+		]]>
+	</select>
+</mapper>