You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
136 lines
4.3 KiB
136 lines
4.3 KiB
<template>
|
|
<view class="u-font-14" style="height: 100%">
|
|
<view v-if="pluginContent">
|
|
<view
|
|
style="height: 100%"
|
|
:data-uid="userId"
|
|
:data-token="token"
|
|
:data-pid="projectId"
|
|
:data-did="task.detailId"
|
|
:data-rid="roleId"
|
|
:data-tid="task.id"
|
|
:data-tname="task.name"
|
|
:data-pstart="task.planStart"
|
|
:data-rstart="task.realStart"
|
|
:data-pdu="task.planDuration"
|
|
:data-rdu="task.realDuration"
|
|
:data-param="param"
|
|
v-html="pluginContent"
|
|
></view>
|
|
</view>
|
|
|
|
<view v-else>
|
|
<!-- <plugin-default /> -->
|
|
<!-- <component :task="task" :is="pluginComponent"></component> -->
|
|
<p-task-title :task="task" v-if="pluginId === '1'" />
|
|
<p-task-description :task="task" v-if="pluginId === '2'" />
|
|
<p-task-duration-delay :task="task" v-if="pluginId === '3'" />
|
|
<p-task-start-time-delay :task="task" v-if="pluginId === '4'" />
|
|
<!-- <p-deliverable :task="task" v-if="pluginId === '5'" /> -->
|
|
<p-subtasks :task="task" v-if="pluginId === '6'" />
|
|
<p-subproject :task="task" v-if="pluginId === '7'" />
|
|
<!-- <p-task-countdown :task="task" v-if="pluginId === '8'" /> -->
|
|
<p-manage-project :task="task" v-if="pluginId === '9'" />
|
|
<p-manage-role :task="task" v-if="pluginId === '10'" />
|
|
<p-manage-member :task="task" v-if="pluginId === '11'" />
|
|
<p-manage-task :task="task" v-if="pluginId === '12'" />
|
|
<p-wbs-import :task="task" v-if="pluginId === '13' || pluginId === '14'" />
|
|
<p-deliver-check :task="task" v-if="pluginId === '15'" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters, mapState } from 'vuex';
|
|
import pManageProject from '../../plugins/p-manage-project/p-manage-project.vue';
|
|
|
|
export default {
|
|
components: { pManageProject },
|
|
name: 'Plugin',
|
|
props: {
|
|
task: { default: () => {}, type: Object },
|
|
pluginId: { default: '1', type: String },
|
|
styleType: { default: 0, type: Number },
|
|
pluginTaskId: { default: '', type: String },
|
|
param: { type: String, default: '' },
|
|
},
|
|
|
|
data() {
|
|
return { pluginContent: null };
|
|
},
|
|
|
|
computed: {
|
|
...mapState('role', ['roleId']),
|
|
...mapState('user', ['token']),
|
|
...mapGetters('user', ['userId']),
|
|
...mapGetters('project', ['projectId']),
|
|
|
|
// 插件名称
|
|
// pluginComponent() {
|
|
// const target = this.$t.plugin.defaults.find(item => item.id === +this.pluginId);
|
|
// if (!target) return '';
|
|
// return target.component;
|
|
// },
|
|
},
|
|
|
|
created() {
|
|
this.getPlugin();
|
|
},
|
|
|
|
methods: {
|
|
// 获取插件信息
|
|
async getPlugin() {
|
|
const { pluginId, styleType } = this;
|
|
const data = await this.$u.api.getOtherPlugin({
|
|
pluginId,
|
|
styleType,
|
|
});
|
|
if (!data || !data.id) return;
|
|
const reg = /data-root=["|']?(\w+)["|']?/gi;
|
|
let uuid = '';
|
|
// FIXME: 没有兼容 只有js, 没有html的情况
|
|
if (data.html) {
|
|
// 查有没有data-root=“xxx” 有的话 将xxx替换为 pluginTaskId
|
|
|
|
if (reg.test(data.html)) {
|
|
uuid = RegExp.$1;
|
|
const str = data.html.replace(new RegExp(uuid, 'g'), `p${this.pluginTaskId}`);
|
|
this.pluginContent = str;
|
|
} else {
|
|
this.pluginContent = data.html;
|
|
}
|
|
|
|
const str = data.js.replace(new RegExp(uuid, 'g'), `p${this.pluginTaskId}`);
|
|
this.handleDom(str);
|
|
}
|
|
|
|
// if (data.js) {
|
|
// if (reg.test(data.js)) {
|
|
// const uuid = RegExp.$1;
|
|
// const str = data.js.replace(new RegExp(uuid, 'g'), `p${this.pluginTaskId}`);
|
|
// this.handleDom(str);
|
|
// } else {
|
|
// this.handleDom(data.js);
|
|
// }
|
|
// }
|
|
},
|
|
|
|
// 创建script dom
|
|
handleDom(js) {
|
|
const { pluginTaskId } = this;
|
|
let domList = Array.from(document.getElementsByTagName('script'));
|
|
const index = domList.findIndex(item => item.id === `p${pluginTaskId}`);
|
|
if (index >= 0) {
|
|
document.body.removeChild(document.getElementById(`p${pluginTaskId}`));
|
|
}
|
|
const scriptDom = document.createElement('script');
|
|
scriptDom.id = `p${pluginTaskId}`;
|
|
scriptDom.setAttribute('data-type', 'plugin');
|
|
scriptDom.innerHTML = js;
|
|
this.$nextTick(() => {
|
|
document.body.append(scriptDom);
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|