110 lines
4.3 KiB
Vue
110 lines
4.3 KiB
Vue
<template>
|
|
<div>
|
|
<n-modal
|
|
v-model:show="showModal"
|
|
:mask-closable="false"
|
|
:show-icon="false"
|
|
preset="dialog"
|
|
transform-origin="center"
|
|
:title="'工单详情 ' + formValue.orderId"
|
|
:style="{ width: dialogWidth }"
|
|
>
|
|
<n-scrollbar style="max-height: 87vh" class="pr-5">
|
|
<n-spin :show="loading" description="请稍候...">
|
|
<n-descriptions label-placement="left" bordered :column="settingStore.isMobile ? 1 : 2">
|
|
<n-descriptions-item label="商户">{{ formValue.tenantName }}</n-descriptions-item>
|
|
<n-descriptions-item label="类型">{{ typeLabel }}</n-descriptions-item>
|
|
<n-descriptions-item label="工单ID">{{ formValue.orderId }}</n-descriptions-item>
|
|
<n-descriptions-item label="状态">{{ statusLabel }}</n-descriptions-item>
|
|
<n-descriptions-item label="提交人ID">{{ formValue.userId }}</n-descriptions-item>
|
|
<n-descriptions-item label="分类">{{
|
|
categoryLabelOf(formValue.type, formValue.category)
|
|
}}</n-descriptions-item>
|
|
<n-descriptions-item label="目标类型">{{
|
|
targetTypeLabel(formValue.targetType)
|
|
}}</n-descriptions-item>
|
|
<n-descriptions-item label="目标摘要">{{
|
|
formValue.targetSummary || '-'
|
|
}}</n-descriptions-item>
|
|
<n-descriptions-item label="联系方式">{{
|
|
formValue.contact || '-'
|
|
}}</n-descriptions-item>
|
|
<n-descriptions-item label="包含诊断">{{
|
|
formValue.includeDiagnostics ? '是' : '否'
|
|
}}</n-descriptions-item>
|
|
<n-descriptions-item label="创建时间">{{
|
|
formValue.createdAt || '-'
|
|
}}</n-descriptions-item>
|
|
<n-descriptions-item label="修改时间">{{
|
|
formValue.updatedAt || '-'
|
|
}}</n-descriptions-item>
|
|
<n-descriptions-item label="内容" :span="2">{{
|
|
formValue.content || formValue.description || '-'
|
|
}}</n-descriptions-item>
|
|
<n-descriptions-item label="证据/附件" :span="2">
|
|
<n-code :code="formValue.evidenceJson || '-'" language="json" word-wrap />
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="快照" :span="2">
|
|
<n-code :code="formValue.snapshotJson || '-'" language="json" word-wrap />
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="客户端上下文" :span="2">
|
|
<n-code :code="formValue.clientContextJson || '-'" language="json" word-wrap />
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="幂等键" :span="2">{{
|
|
formValue.idempotencyKey || '-'
|
|
}}</n-descriptions-item>
|
|
</n-descriptions>
|
|
</n-spin>
|
|
</n-scrollbar>
|
|
<template #action>
|
|
<n-space>
|
|
<n-button @click="closeForm">关闭</n-button>
|
|
</n-space>
|
|
</template>
|
|
</n-modal>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { computed, ref } from 'vue';
|
|
import { useDictStore } from '@/store/modules/dict';
|
|
import { View } from '@/api/imWorkOrder';
|
|
import { categoryLabelOf, newState, State, targetTypeLabel } from './model';
|
|
import { useProjectSettingStore } from '@/store/modules/projectSetting';
|
|
import { adaModalWidth } from '@/utils/hotgo';
|
|
|
|
const settingStore = useProjectSettingStore();
|
|
const dict = useDictStore();
|
|
const loading = ref(false);
|
|
const showModal = ref(false);
|
|
const formValue = ref<State>(newState(null));
|
|
const dialogWidth = computed(() => adaModalWidth(980));
|
|
const statusLabel = computed(() =>
|
|
dict.getLabel('ImWorkOrderStatusOptions', formValue.value.status)
|
|
);
|
|
const typeLabel = computed(() => (formValue.value.type === 'abuse' ? '举报' : '反馈'));
|
|
|
|
function closeForm() {
|
|
showModal.value = false;
|
|
loading.value = false;
|
|
}
|
|
|
|
function openModal(state: State) {
|
|
showModal.value = true;
|
|
loading.value = true;
|
|
View({ tenantId: state.tenantId, type: state.type, id: state.id })
|
|
.then((res) => {
|
|
formValue.value = newState(res);
|
|
})
|
|
.finally(() => {
|
|
loading.value = false;
|
|
});
|
|
}
|
|
|
|
defineExpose({
|
|
openModal,
|
|
});
|
|
</script>
|
|
|
|
<style lang="less"></style>
|