修改action,添加tab浏览

 Source/plt-web/plt-web-ui/src/components/PLT-basic-component/basicForm.vue

@@ -239,20 +239,20 @@
          col.display=false
        }
      }
      if (col.type === "select") {
        if(col.data && col.data.length>0){
      if (col.type === "select" || col.type==='radio' || col.type==='checkbox') {
        if (col.data && col.data.length > 0) {
          col.dicData = col.data.map((d) => {
            return {
              label: d.key,
              key: d.value,
              value: d.value,
              attributes:d.attributes
              attributes: d.attributes
            };
          });
        }else if(!validatenull(col.dictCode)) {
        } else if (!validatenull(col.dictCode)) {
          getDicts(col.dictCode).then((res) => {
            if (res.data.success){
              if(res.data.data && res.data.obj == null){
            if (res.data.success) {
              if (res.data.data && res.data.obj == null) {
                res.data.obj = res.data.data
              }
              const dic = res.data.obj;
@@ -261,11 +261,13 @@
                  label: d.value,
                  key: d.key,
                  value: d.key,
                  attributes:d.attributes
                  attributes: d.attributes
                };
              });
            }
          });
        } else {
          col.dicData = [];
        }
      }
      if (col.type==='refer') {

 Source/plt-web/plt-web-ui/src/components/actions/base/EditAction.js

@@ -43,7 +43,7 @@
  }
  callPreEvent(options, doBefore, function (options) {
    doEdit(options, function (type,formData) {
      callPostEvent(options, doAfter,type, callback);
      callPostEvent(options, doAfter,callback,type);
    });
  });
};

 Source/plt-web/plt-web-ui/src/components/actions/base/RevisionAction.js

@@ -43,7 +43,7 @@
  }
  callPreEvent(options, doBefore, function (options) {
    doRev(options, function (formData) {
      callPostEvent(options, doAfter,'rev', callback);
      callPostEvent(options, doAfter,callback,'rev');
    });
  });
};

 Source/plt-web/plt-web-ui/src/components/actions/base/StartWorkflowAction.js

@@ -42,7 +42,7 @@

  callPreEvent(options, doBefore, function (options) {
    showStartWindow(options, function () {
      callPostEvent(options, doAfter, callback,type);
      callPostEvent(options, doAfter, callback,'startwork');
    });
  });
};

 Source/plt-web/plt-web-ui/src/components/actions/base/ViewAction.js

@@ -1,10 +1,12 @@
/**
 * æŒ‰é’®å¤„理 é¡µé¢å±•ç¤ºä¸ºtab选项卡
 * æŒ‰é’®å¤„理 å¼¹çª—展示详情
 */
import {paramLow,callPreEvent,callPostEvent,replaceFreeMarker} from '../BaseAction';
import {validatenull} from "@/util/validate";
import Vue from "vue";
import ViewDialog from "@/components/actions/base/ViewDialog";
import ViewTab from "@/views/base/ViewTab";
import router from "@/router/router"
import store from "@/store/index"

export const doAction = (options,callback) => {
  const paramVOS = Object.assign({
@@ -26,7 +28,6 @@
    Vue.prototype.$message.error("仅能选择一条数据来操作");
    return false;
  }

  callPreEvent(options, doBefore, function (options) {
    doView(options, function (type,formData) {
      callPostEvent(options, doAfter,type, callback);
@@ -57,25 +58,19 @@
    name="查看【"+replaceFreeMarker(paramVOS.showname,options.dataStore,options.sourceData)+"】"
  }
  paramVOS.title=name;
  const dialogConstructor = Vue.extend(ViewDialog);
  let instance = new dialogConstructor();
  instance.sourceData = options.sourceData;
  instance.dataStore = options.dataStore;
  instance.paramVOS = paramVOS

  instance.dialogClose = function () {
    vm.visible = false;
    document.body.removeChild(vm.$el);
    instance.$destroy();
    instance = null;
  };
  if (callback) {
    instance.saveCallback = callback;
  const params= {
    options:options,
    paramVOS:paramVOS,
    saveCallback:callback
  }
  let vm = instance.$mount();
  document.body.appendChild(vm.$el);
  instance.visible = true;

  store.dispatch("setViewtabparams", params);
  router.push({
    name: "查看详情",
    params:params,
  });
}

/**
 * å‰ç½®äº‹ä»¶
 * @param options æŒ‰é’®çš„配置信息

 Source/plt-web/plt-web-ui/src/components/actions/base/ViewDialogAction.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,100 @@
/**
 * æŒ‰é’®å¤„理 å¼¹çª—展示详情
 */
import {paramLow,callPreEvent,callPostEvent,replaceFreeMarker} from '../BaseAction';
import {validatenull} from "@/util/validate";
import Vue from "vue";
import ViewDialog from "@/components/actions/base/ViewDialog";

export const doAction = (options,callback) => {
  const paramVOS = Object.assign({
    getdataurl: '/api/uiDataController/dataFormQuery',
    getdatamethod: 'post',
    url: '/api/uiDataController/editSave',
    method: 'put',
    uploadfileurl: 'vciFileUploadController/uploadFile'
  }, options.paramVOS)
  options.paramVOS = paramVOS;

  options.sourceData = options.sourceData || {};
  options.dataStore = options.dataStore || [];
  if (!options.dataStore || options.dataStore.length < 1) {
    Vue.prototype.$message.error("请选择需要浏览的数据");
    return false;
  }
  if (!paramVOS.multi && options.dataStore.length > 1) {
    Vue.prototype.$message.error("仅能选择一条数据来操作");
    return false;
  }
  callPreEvent(options, doBefore, function (options) {
    doView(options, function (type,formData) {
      callPostEvent(options, doAfter,type, callback);
    });
  });
};

/**
 * æ‰§è¡Œ
 * @param options æŒ‰é’®çš„配置信息
 * @param callback å›žè°ƒ
 */
export const doView = (options,callback)=> {
  const paramVOS = options.paramVOS;
  let component = 'base/UIContentViewerInDialog';
  if (!validatenull(paramVOS.customurl)) {
    //自定义js
    component = `custom-ui/` + paramVOS.customurl;
  }else{
    if (!paramVOS['type'] || !paramVOS['context']) {
      Vue.prototype.$message.error("按钮配置不正确");
      return false;
    }
  }
  paramVOS.component=component;
  let name="查看详情"
  if(paramVOS.showname){
    name="查看【"+replaceFreeMarker(paramVOS.showname,options.dataStore,options.sourceData)+"】"
  }
  paramVOS.title=name;
  const dialogConstructor = Vue.extend(ViewDialog);
  let instance = new dialogConstructor();
  instance.sourceData = options.sourceData;
  instance.dataStore = options.dataStore;
  instance.paramVOS = paramVOS

  instance.dialogClose = function () {
    vm.visible = false;
    document.body.removeChild(vm.$el);
    instance.$destroy();
    instance = null;
  };
  if (callback) {
    instance.saveCallback = callback;
  }
  let vm = instance.$mount();
  document.body.appendChild(vm.$el);
  instance.visible = true;
}

/**
 * å‰ç½®äº‹ä»¶
 * @param options æŒ‰é’®çš„配置信息
 * @param callback å›žè°ƒ
 */
export const doBefore = (options,callback)=> {
  console.log('执行查看前置事件');
  if(callback){
    callback(options);
  }
}
/**
 * åŽç½®äº‹ä»¶
 * @param options æŒ‰é’®çš„配置信息
 * @param callback å›žè°ƒ
 */
export const doAfter = (options,callback,actionType)=> {
  console.log('执行查看后置事件');
  if(callback){
    callback(actionType);
  }
}

 Source/plt-web/plt-web-ui/src/components/actions/base/downloadFileAction.js

@@ -23,7 +23,7 @@

  callPreEvent(options, doBefore, function (options) {
    showStartWindow(options, function () {
      callPostEvent(options, doAfter, callback,type);
      callPostEvent(options, doAfter, callback,'downloadfile');
    });
  });
};

 Source/plt-web/plt-web-ui/src/components/actions/base/upRevisionAction.js

@@ -18,7 +18,7 @@

  callPreEvent(options, doBefore, function (options) {
    showStartWindow(options, function () {
      callPostEvent(options, doAfter, callback,type);
      callPostEvent(options, doAfter, callback,'uprevision');
    });
  });
};

 Source/plt-web/plt-web-ui/src/components/actions/base/uploadFileAction.js

@@ -17,7 +17,7 @@
  }
  callPreEvent(options, doBefore, function (options) {
    showStartWindow(options, function () {
      callPostEvent(options, doAfter, callback,type);
      callPostEvent(options, doAfter, callback,'uploadfile');
    });
  });
};

 Source/plt-web/plt-web-ui/src/components/actions/handlers.js

@@ -3,10 +3,14 @@

export const handlerAction=function (type,options, callback) {
  const handlers = {
    //查看
    //查看，tab展示详情
    view: () => {import("@/components/actions/base/ViewAction").then(module => {
      module.doAction(options,callback);
    })},
    //查看，弹窗展示详情
    viewdialog: () => {import("@/components/actions/base/ViewDialogAction").then(module => {
      module.doAction(options,callback);
    })},
    //创建
    add: () => {import("@/components/actions/base/AddAction").then(module => {
      module.doAction(options,callback);

 Source/plt-web/plt-web-ui/src/router/views/index.js

@@ -103,4 +103,17 @@
    component: () =>
      import( /* webpackChunkName: "views" */ '@/views/work/process/leave/detail')
  }]
}]
},{
  path: '/viewTab',
  component: Layout,
  redirect: '/viewTab/index',
  children: [{
    path: 'index',
    name: '查看详情',
    meta: {
      i18n: 'viewTab'
    },
    component: () =>
      import('@/views/base/ViewTab')
  }]
} ]

 Source/plt-web/plt-web-ui/src/store/index.js

@@ -7,6 +7,7 @@
import dict from './modules/dict'
import getters from './getters'
import flow from './modules/LifeFlow'
import { setStore } from "@/util/store.js";

Vue.use(Vuex)
const store = new Vuex.Store({
@@ -19,6 +20,25 @@
    flow
  },
  getters,
  state: {
    viewtabparams:undefined, //查看tab Action参数
  },
  mutations: {
    // è§„程详情参数
    getViewtabparams(state, obj) {
      state.viewtabparams = obj;
    },
  },
  actions: {
    setViewtabparams({ commit }, obj){
      commit("getViewtabparams", obj);
      setStore({
        name:'viewtabparams',
        content:obj,
        type:'session'
      });
    }
  }
})

export default store

 Source/plt-web/plt-web-ui/src/views/base/ViewTab.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,67 @@
<template>
  <!--Action æŸ¥çœ‹Tab的实现-->
  <component :is="currentComponent"
             ref="uiViewRef"
             key="ViewTab"
             :btmType="paramVOS.type"
             :context="paramVOS.context"
             :inDialog="false"
             :canEdit="false"
             actionType="view"
             :sourceData="sourceData"
             :dataStore="dataStore"
             :paramVOS="paramVOS"></component>
</template>

<script>
import {validatenull} from "@/util/validate";
import { getStore } from "@/util/store.js";

export default {
  name: "ViewTab",
  components:{},
  data(){
    return {
      sourceData:{},
      dataStore:[],
      paramVOS:{},
      currentComponent: null,
    }
  },
  computed:{
    title(){
      return this.paramVOS.title || "查看详情"
    }
  },
  created() {
    let config = {};
    if (!validatenull(this.$store.state.viewtabparams)) {
      config = this.$store.state.viewtabparams;
    } else {
      config = getStore('viewtabparams');
    }
    this.sourceData = config.options.sourceData;
    this.dataStore = config.options.dataStore;
    this.paramVOS = config.paramVOS;
  },
  mounted() {
    this.loadCompoent();
  },
  methods: {
    loadCompoent(){
      // åŠ¨æ€å¯¼å…¥ç»„件
      import(`@/views/${this.paramVOS.component}.vue`).then((module) => {
        // æˆåŠŸå¯¼å…¥åŽï¼Œå°†ç»„件注册到Vue实例中
        this.currentComponent = module.default;
      }).catch((error) => {
        // å¤„理导入失败的情况
        console.log('组件加载失败:', error);
      });
    }
  }
}
</script>

<style scoped>

</style>