|
@ -2,21 +2,22 @@ |
|
|
<q-card flat bordered> |
|
|
<q-card flat bordered> |
|
|
<q-card-section class="text-info px-2 pt-1 pb-0"> |
|
|
<q-card-section class="text-info px-2 pt-1 pb-0"> |
|
|
<div class="row no-wrap items-center"> |
|
|
<div class="row no-wrap items-center"> |
|
|
<q-icon name="bi-card-list" size="1.5em" /> |
|
|
<q-icon name="bi-card-list" size="1.4em" /> |
|
|
<span class="text-weight-bolder px-2">{{ $t('home.card.finishTask.title') }}</span> |
|
|
<span class="text-weight-bolder px-2">{{ $t('home.card.finishTask.title') }}</span> |
|
|
<q-space /> |
|
|
<q-space /> |
|
|
<q-btn size="12px" flat no-caps :label="$t('home.card.finishTask.action.list')" /> |
|
|
<q-btn size="12px" icon="bi-arrow-repeat" flat no-caps padding="2px 6px 2px 6px" :title="$t('refresh')" :loading="loadingRef" @click="refresh" /> |
|
|
|
|
|
<q-btn size="12px" icon="bi-justify" flat no-caps padding="2px 6px 2px 6px" :title="$t('home.card.finishTask.action.list')" /> |
|
|
</div> |
|
|
</div> |
|
|
</q-card-section> |
|
|
</q-card-section> |
|
|
<q-card-section class="p-0"> |
|
|
<q-card-section class="p-0"> |
|
|
<q-markup-table flat dense separator="none" style="height: 130px; overflow-y: auto"> |
|
|
<q-markup-table flat dense separator="none" style="height: 130px; overflow-y: auto"> |
|
|
<tbody> |
|
|
<tbody> |
|
|
<tr v-for="item in unCompletedTasksRef" :key="item.id" @click="handleTask(item)"> |
|
|
<tr v-for="item in itemsRef" :key="item.id" @click="handleTask(item)"> |
|
|
<td width="100%"> |
|
|
<td width="100%"> |
|
|
<div class="truncate" style="width: 350px">{{ item.businessDescription }}</div> |
|
|
<div class="truncate" style="width: 350px">{{ item.businessDescription }}</div> |
|
|
</td> |
|
|
</td> |
|
|
<td width="100px">{{ item.previousAssignee }}, {{ item.createTimeAndNowDiff }}{{ $t(item.createTimeAndNowDiffUnit) }}{{ $t('before') }}</td> |
|
|
<td width="100px">{{ item.previousAssignee }}, {{ item.createTimeAndNowDiff }}{{ $t(item.createTimeAndNowDiffUnit) }}{{ $t('before') }}</td> |
|
|
<td width="100px"><q-btn color="primary" :label="$t('view')" size="11px" @click="handleTask(item)" /></td> |
|
|
<td width="100px"><q-btn color="primary" no-caps :label="$t('home.card.finishTask.action.view')" size="11px" @click="handleTask(item)" /></td> |
|
|
</tr> |
|
|
</tr> |
|
|
</tbody> |
|
|
</tbody> |
|
|
</q-markup-table> |
|
|
</q-markup-table> |
|
@ -24,18 +25,36 @@ |
|
|
</q-card> |
|
|
</q-card> |
|
|
</template> |
|
|
</template> |
|
|
<script setup lang="ts"> |
|
|
<script setup lang="ts"> |
|
|
import { ref } from 'vue'; |
|
|
import { h, ref, defineAsyncComponent, nextTick } from 'vue'; |
|
|
import { axios, Environment, SessionManager, I18nMessageManager, AuthenticationManager, Tools } from '@/platform'; |
|
|
import { axios, Environment, ComponentManager, Tools } from '@/platform'; |
|
|
|
|
|
|
|
|
const unCompletedTasksRef = ref([]); |
|
|
const itemsRef = ref([]); |
|
|
const unCompletedTasksTotalCountRef = ref(); |
|
|
const loadingRef = ref(false); |
|
|
|
|
|
const componentRef = ref(); |
|
|
|
|
|
|
|
|
const findUnCompletedTasks = () => { |
|
|
const refresh = () => { |
|
|
axios.get(Environment.apiContextPath('/api/flowable/process/query/task')).then((response) => { |
|
|
loadingRef.value = true; |
|
|
unCompletedTasksRef.value = response.data.content || []; |
|
|
axios |
|
|
unCompletedTasksTotalCountRef.value = response.data.totalElements; |
|
|
.get(Environment.apiContextPath('/api/flowable/process/query/task')) |
|
|
|
|
|
.then((response: any) => { |
|
|
|
|
|
itemsRef.value = response.data.content || []; |
|
|
|
|
|
loadingRef.value = false; |
|
|
|
|
|
}) |
|
|
|
|
|
.catch(() => { |
|
|
|
|
|
loadingRef.value = false; |
|
|
|
|
|
}); |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
const handleTask = async (item: any) => { |
|
|
|
|
|
//删除已有组件 |
|
|
|
|
|
componentRef.value = null; |
|
|
|
|
|
//重新加载组件 |
|
|
|
|
|
nextTick(() => { |
|
|
|
|
|
const component = defineAsyncComponent(ComponentManager.getRemoteComponent(item.taskHandFrontendModelName, item.taskHandFrontendComponentName)); |
|
|
|
|
|
const properties = Tools.mergeObject({ taskId: item.id }, Tools.json2Object(item.taskHandFrontendComponentProperties)); |
|
|
|
|
|
componentRef.value = h(component, properties); |
|
|
}); |
|
|
}); |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
findUnCompletedTasks(); |
|
|
refresh(); |
|
|
</script> |
|
|
</script> |
|
|