服务指令功能完善
This commit is contained in:
parent
1295827497
commit
0e4720b3f2
|
|
@ -149,7 +149,6 @@ export default defineComponent({
|
|||
function handleChange(e) {
|
||||
const { mode } = unref<Recordable>(getBindValue);
|
||||
let changeValue: any;
|
||||
let changeLabel: any;
|
||||
// 兼容多选模式
|
||||
|
||||
//update-begin---author:wangshuai ---date:20230216 for：[QQYUN-4290]公文发文：选择机关代字报错,是因为值改变触发了change事件三次，导致数据发生改变------------
|
||||
|
|
@ -165,13 +164,11 @@ export default defineComponent({
|
|||
}
|
||||
} else {
|
||||
changeValue = e?.target?.value ?? e;
|
||||
// changeLabel = dictOptions.value.filter(d => d.value == changeValue)[0].label
|
||||
}
|
||||
state.value = changeValue;
|
||||
|
||||
//update-begin---author:wangshuai ---date:20230403 for：【issues/4507】JDictSelectTag组件使用时，浏览器给出警告提示：Expected Function, got Array------------
|
||||
emit('update:value', changeValue)
|
||||
// emit('upLabel', changeLabel)
|
||||
//update-end---author:wangshuai ---date:20230403 for：【issues/4507】JDictSelectTag组件使用时，浏览器给出警告提示：Expected Function, got Array述------------
|
||||
//update-end---author:wangshuai ---date:20230216 for：[QQYUN-4290]公文发文：选择机关代字报错,是因为值改变触发了change事件三次，导致数据发生改变------------
|
||||
|
||||
|
|
|
|||
|
|
@ -1,19 +1,19 @@
|
|||
import { defHttp } from '/@/utils/http/axios';
|
||||
import { useMessage } from "/@/hooks/web/useMessage";
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
|
||||
const { createConfirm } = useMessage();
|
||||
|
||||
enum Api {
|
||||
list = '/services/serviceDirective/list',
|
||||
save='/services/serviceDirective/add',
|
||||
edit='/services/serviceDirective/edit',
|
||||
save = '/services/serviceDirective/add',
|
||||
edit = '/services/serviceDirective/edit',
|
||||
audit = '/services/serviceDirective/audit',
|
||||
deleteOne = '/services/serviceDirective/delete',
|
||||
deleteBatch = '/services/serviceDirective/deleteBatch',
|
||||
importExcel = '/services/serviceDirective/importExcel',
|
||||
exportXls = '/services/serviceDirective/exportXls',
|
||||
async = '/services/serviceDirective/async',
|
||||
departList = '/sys/sysDepart/list',
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -39,11 +39,11 @@ export const departList = (params) => defHttp.get({ url: Api.departList, params
|
|||
* @param params
|
||||
* @param handleSuccess
|
||||
*/
|
||||
export const deleteOne = (params,handleSuccess) => {
|
||||
return defHttp.delete({url: Api.deleteOne, params}, {joinParamsToUrl: true}).then(() => {
|
||||
export const deleteOne = (params, handleSuccess) => {
|
||||
return defHttp.delete({ url: Api.deleteOne, params }, { joinParamsToUrl: true }).then(() => {
|
||||
handleSuccess();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 批量删除
|
||||
|
|
@ -58,12 +58,12 @@ export const batchDelete = (params, handleSuccess) => {
|
|||
okText: '确认',
|
||||
cancelText: '取消',
|
||||
onOk: () => {
|
||||
return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
|
||||
return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
|
||||
handleSuccess();
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 保存或者更新
|
||||
|
|
@ -73,7 +73,15 @@ export const batchDelete = (params, handleSuccess) => {
|
|||
export const saveOrUpdate = (params, isUpdate) => {
|
||||
let url = isUpdate ? Api.edit : Api.save;
|
||||
return defHttp.post({ url: url, params }, { isTransformResponse: false });
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 审批
|
||||
* @param params
|
||||
*/
|
||||
export const audit = (params) => {
|
||||
return defHttp.post({ url: Api.audit, params });
|
||||
};
|
||||
|
||||
/**
|
||||
* 同步数据
|
||||
|
|
@ -81,4 +89,4 @@ export const saveOrUpdate = (params, isUpdate) => {
|
|||
*/
|
||||
export const asyncFunc = (params) => {
|
||||
return defHttp.post({ url: Api.async, params }, { isTransformResponse: false });
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -100,6 +100,164 @@ export const columns: BasicColumn[] = [
|
|||
dataIndex: 'serviceDuration',
|
||||
width: 135,
|
||||
},
|
||||
{
|
||||
title: '指令状态',
|
||||
align: 'center',
|
||||
dataIndex: 'status_dictText',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '是否启用',
|
||||
align: 'center',
|
||||
dataIndex: 'izEnabled_dictText',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '服务指令图片',
|
||||
align: 'center',
|
||||
dataIndex: 'previewFile',
|
||||
customRender: render.renderImage,
|
||||
},
|
||||
{
|
||||
title: '服务指令描述',
|
||||
align: 'center',
|
||||
dataIndex: 'serviceContent',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '指令音频文件',
|
||||
align: 'center',
|
||||
dataIndex: 'mp3File',
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
title: '指令视频文件',
|
||||
align: 'center',
|
||||
dataIndex: 'mp4File',
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
title: '即时指令图标',
|
||||
align: 'center',
|
||||
dataIndex: 'immediateFile',
|
||||
customRender: render.renderImage,
|
||||
},
|
||||
];
|
||||
|
||||
//列表数据
|
||||
export const auditColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '机构名称',
|
||||
align: 'center',
|
||||
dataIndex: 'sysOrgCode_dictText',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '分类标签',
|
||||
align: 'center',
|
||||
dataIndex: 'instructionTagId_dictText',
|
||||
ellipsis: false,
|
||||
customCell: (record, index, column) => {
|
||||
if (record.instructionRowSpan != null) {
|
||||
return { rowSpan: record.instructionRowSpan };
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '服务类别',
|
||||
align: 'center',
|
||||
dataIndex: 'categoryId_dictText',
|
||||
ellipsis: false,
|
||||
customCell: (record, index, column) => {
|
||||
if (record.categoryRowSpan != null) {
|
||||
return { rowSpan: record.categoryRowSpan };
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '服务类型',
|
||||
align: 'center',
|
||||
dataIndex: 'typeId_dictText',
|
||||
ellipsis: false,
|
||||
customCell: (record, index, column) => {
|
||||
if (record.typeRowSpan != null) {
|
||||
return { rowSpan: record.typeRowSpan };
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '服务指令',
|
||||
align: 'center',
|
||||
dataIndex: 'directiveName',
|
||||
},
|
||||
{
|
||||
title: '体型标签',
|
||||
align: 'center',
|
||||
dataIndex: 'bodyTagList',
|
||||
width: 150,
|
||||
ellipsis: false,
|
||||
// format(text, record, index) {
|
||||
// if (!!text) {
|
||||
// return text.map((item) => item.tagName).join('、');
|
||||
// } else {
|
||||
// return '-';
|
||||
// }
|
||||
// },
|
||||
},
|
||||
{
|
||||
title: '情绪标签',
|
||||
align: 'center',
|
||||
dataIndex: 'emotionTagList',
|
||||
width: 150,
|
||||
ellipsis: false,
|
||||
// format(text, record, index) {
|
||||
// if (!!text) {
|
||||
// return text.map((item) => item.tagName).join('、');
|
||||
// } else {
|
||||
// return '-';
|
||||
// }
|
||||
// },
|
||||
},
|
||||
{
|
||||
title: '收费价格',
|
||||
align: 'center',
|
||||
dataIndex: 'tollPrice',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '提成价格',
|
||||
align: 'center',
|
||||
dataIndex: 'comPrice',
|
||||
},
|
||||
{
|
||||
title: '医保报销',
|
||||
align: 'center',
|
||||
dataIndex: 'izReimbursement_dictText',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '机构优惠',
|
||||
align: 'center',
|
||||
dataIndex: 'izPreferential_dictText',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '周期类型',
|
||||
align: 'center',
|
||||
dataIndex: 'cycleType_dictText',
|
||||
},
|
||||
{
|
||||
title: '服务时长（分钟）',
|
||||
align: 'center',
|
||||
dataIndex: 'serviceDuration',
|
||||
width: 135,
|
||||
},
|
||||
{
|
||||
title: '指令状态',
|
||||
align: 'center',
|
||||
dataIndex: 'status_dictText',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '是否启用',
|
||||
align: 'center',
|
||||
|
|
|
|||
|
|
@ -85,6 +85,8 @@
|
|||
preIcon="tabler:settings">配置情绪标签</a-button>
|
||||
<a-button type="primary" class="btnPrivate" @click="handleAdd"
|
||||
preIcon="ant-design:plus-outlined">新增服务指令</a-button>
|
||||
<a-button type="primary" class="btnPrivate" @click="auditListFunc"
|
||||
preIcon="ant-design:audit-outlined">审核列表</a-button>
|
||||
</template>
|
||||
<!--操作栏-->
|
||||
<template #action="{ record }">
|
||||
|
|
@ -408,10 +410,6 @@ function searchReset() {
|
|||
reload();
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
let rangeField = 'tollPrice,comPrice,'
|
||||
|
||||
/**
|
||||
|
|
@ -569,8 +567,15 @@ const stopAudio = () => {
|
|||
}
|
||||
};
|
||||
|
||||
// 添加音频结束监听
|
||||
/**
|
||||
* 打开审核列表
|
||||
*/
|
||||
function auditListFunc() {
|
||||
registerModal.value.openAuditList();
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
// 添加音频结束监听
|
||||
if (audioPlayer.value) {
|
||||
audioPlayer.value.addEventListener('ended', () => {
|
||||
isPlaying.value = false;
|
||||
|
|
@ -578,8 +583,6 @@ onMounted(() => {
|
|||
}
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,27 @@
|
|||
<template>
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<JFormContainer :disabled="disabled">
|
||||
<JFormContainer>
|
||||
<template #detail>
|
||||
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol"
|
||||
name="ConfigService2DirectiveForm">
|
||||
<a-row v-show="isAudit">
|
||||
<a-col :span="12">
|
||||
<a-config-provider :disabled="false">
|
||||
<a-form-item label="服务指令审批" v-bind="validateInfos.statusVal" id="ConfigServiceDirectiveForm-statusVal"
|
||||
name="statusVal">
|
||||
<a-select v-model:value="formData.statusVal" placeholder="请选择审核状态" style="width: 200px"
|
||||
:disabled="false">
|
||||
<a-select-option value="auditPass">审核通过</a-select-option>
|
||||
<a-select-option value="auditFaild">审核不通过</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-config-provider>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</template>
|
||||
</JFormContainer>
|
||||
<JFormContainer :disabled="disabled" style="margin-top: -30px;">
|
||||
<template #detail>
|
||||
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol"
|
||||
name="ConfigService2DirectiveForm">
|
||||
|
|
@ -102,8 +123,9 @@
|
|||
<a-row>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="服务指令图片" v-bind="validateInfos.previewFile">
|
||||
<JImageUpload :fileMax="1" v-model:value="formData.previewFile" :disabled="!canUploadPreviewImage"
|
||||
:bizPath="directiveBizPath">
|
||||
<span v-if="disabled && !formData.previewFile">暂无文件</span>
|
||||
<JImageUpload v-else :fileMax="1" v-model:value="formData.previewFile"
|
||||
:disabled="!canUploadPreviewImage" :bizPath="directiveBizPath">
|
||||
</JImageUpload>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
|
@ -114,7 +136,7 @@
|
|||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-row v-show="!disabled">
|
||||
<a-col :span="12">
|
||||
<a-form-item label="指令音频文件" v-bind="validateInfos.mp3File" id="ConfigServiceDirectiveForm-mp3File">
|
||||
<j-upload v-model:value="formData.mp3File" accept=".mp3" :maxCount="1"
|
||||
|
|
@ -127,35 +149,44 @@
|
|||
:disabled="!canUploadPreviewImage" :bizPath="directiveBizPath"></j-upload>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-row>
|
||||
</a-row>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</template>
|
||||
</JFormContainer>
|
||||
<JFormContainer>
|
||||
<JFormContainer style="margin-top: -40px;">
|
||||
<template #detail>
|
||||
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol"
|
||||
name="ConfigServiceDirectiveForm">
|
||||
<a-row>
|
||||
<a-col :span="12" v-if="!!formData.mp3File">
|
||||
<a-form-item label="语音预览" id="ConfigServiceDirectiveForm-mp3File">
|
||||
<a-form-item label="指令音频预览" id="ConfigServiceDirectiveForm-mp3File">
|
||||
<audio controls disabled="false">
|
||||
<source :src="getFileAccessHttpUrl(formData.mp3File)">
|
||||
</audio>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12" v-if="disabled && !formData.mp3File">
|
||||
<a-form-item label="指令音频预览">
|
||||
<span>暂无文件</span>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12" v-if="!!formData.mp4File" :push="!!formData.mp3File ? 0 : 12">
|
||||
<a-form-item label="视频预览" id="ConfigServiceDirectiveForm-mp4File">
|
||||
<a-form-item label="指令视频预览" id="ConfigServiceDirectiveForm-mp4File">
|
||||
<video controls>
|
||||
<source :src="getFileAccessHttpUrl(formData.mp4File)">
|
||||
</video>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12" v-if="disabled && !formData.mp3File">
|
||||
<a-form-item label="指令视频预览">
|
||||
<span>暂无文件</span>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="即时指令图标" v-bind="validateInfos.immediateFile">
|
||||
<JImageUpload :fileMax="1" v-model:value="formData.immediateFile" :disabled="!canUploadPreviewImage"
|
||||
:bizPath="directiveBizPath">
|
||||
<span v-if="disabled && !formData.immediateFile">暂无文件</span>
|
||||
<JImageUpload v-else :fileMax="1" v-model:value="formData.immediateFile"
|
||||
:disabled="!canUploadPreviewImage || disabled" :bizPath="directiveBizPath">
|
||||
</JImageUpload>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
|
@ -175,7 +206,7 @@ import { JCheckbox } from '/@/components/Form';
|
|||
import JUpload from '/@/components/Form/src/jeecg/components/JUpload/JUpload.vue';
|
||||
import JImageUpload from '/@/components/Form/src/jeecg/components/JImageUpload.vue';
|
||||
import { getValueType } from '/@/utils';
|
||||
import { saveOrUpdate } from '../ConfigServiceDirective.api';
|
||||
import { saveOrUpdate, audit } from '../ConfigServiceDirective.api';
|
||||
import { Form } from 'ant-design-vue';
|
||||
import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
|
||||
import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
|
||||
|
|
@ -213,6 +244,8 @@ const formData = reactive<Record<string, any>>({
|
|||
mp4File: '',
|
||||
previewFile: '',
|
||||
immediateFile: '',
|
||||
status: '',
|
||||
statusVal: undefined,
|
||||
});
|
||||
const { createMessage } = useMessage();
|
||||
const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 6 } });
|
||||
|
|
@ -221,6 +254,7 @@ const labelCol2 = ref<any>({ xs: { span: 24 }, sm: { span: 3 } });
|
|||
const wrapperCol2 = ref<any>({ xs: { span: 24 }, sm: { span: 20 } });
|
||||
const confirmLoading = ref<boolean>(false);
|
||||
const isEditMedia = ref(false)
|
||||
const isAudit = ref(false)
|
||||
//表单验证
|
||||
const validatorRules = reactive({
|
||||
categoryId: [{ required: true, message: '请选择服务类别!' },],
|
||||
|
|
@ -353,9 +387,12 @@ function add() {
|
|||
/**
|
||||
* 编辑
|
||||
* isEditMedia_是否为编辑指令资源 （隐藏业务字段）
|
||||
* isAudit_是否为服务指令那个审批 （隐藏业务字段）
|
||||
*/
|
||||
function edit(record, isEditMedia_ = false) {
|
||||
function edit(record, isEditMedia_ = false, isAudit_ = false) {
|
||||
console.log("🌊 ~ edit ~ record:", record)
|
||||
isEditMedia.value = isEditMedia_
|
||||
isAudit.value = isAudit_
|
||||
formData.bodyTags = ''
|
||||
formData.emotionTags = ''
|
||||
nextTick(() => {
|
||||
|
|
@ -413,7 +450,6 @@ async function submitForm() {
|
|||
retrun;
|
||||
}
|
||||
|
||||
//
|
||||
model.mediaFileSavePath = directiveBizPath
|
||||
|
||||
await saveOrUpdate(model, isUpdate.value)
|
||||
|
|
@ -430,11 +466,34 @@ async function submitForm() {
|
|||
});
|
||||
}
|
||||
|
||||
function submitAudit() {
|
||||
if (formData.statusVal == 'auditPass') {
|
||||
formData.status = 2
|
||||
} else if (formData.statusVal == 'auditFaild') {
|
||||
formData.status = 3
|
||||
} else {
|
||||
createMessage.warning('请选择审批结果！')
|
||||
return
|
||||
}
|
||||
audit(formData)
|
||||
.then((res) => {
|
||||
if (res.success) {
|
||||
createMessage.success('操作成功！');
|
||||
emit('ok');
|
||||
} else {
|
||||
createMessage.warning(res.message);
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
confirmLoading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
add,
|
||||
edit,
|
||||
submitForm,
|
||||
submitAudit,
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,22 +1,29 @@
|
|||
<template>
|
||||
<j-modal :title="title" width="70vw" :visible="visible" @ok="handleOk"
|
||||
:okButtonProps="{ class: { 'jee-hidden': disableSubmit } }" @cancel="handleCancel" cancelText="关闭"
|
||||
:okButtonProps="{ class: { 'jee-hidden': (disableSubmit && !isAudit) } }" @cancel="handleCancel" cancelText="关闭"
|
||||
:maskClosable="false">
|
||||
<ConfigServiceDirectiveForm ref="registerForm" v-if="visible" @ok="submitCallback" :formDisabled="disableSubmit"
|
||||
:formBpm="false"></ConfigServiceDirectiveForm>
|
||||
</j-modal>
|
||||
<j-modal title="审核列表" width="70vw" :visible="auditVisible" :okButtonProps="{ class: { 'jee-hidden': true } }"
|
||||
@cancel="handleAuditCancel" cancelText="关闭" :maskClosable="false">
|
||||
<ServiceDirectiveAuditList></ServiceDirectiveAuditList>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, nextTick, defineExpose, defineProps } from 'vue';
|
||||
import ConfigServiceDirectiveForm from './ConfigServiceDirectiveForm.vue'
|
||||
import JModal from '/@/components/Modal/src/JModal/JModal.vue';
|
||||
import ServiceDirectiveAuditList from './ServiceDirectiveAuditList.vue'
|
||||
|
||||
const props = defineProps({
|
||||
});
|
||||
const title = ref<string>('');
|
||||
const visible = ref<boolean>(false);
|
||||
const auditVisible = ref<boolean>(false);
|
||||
const disableSubmit = ref<boolean>(false);
|
||||
const isAudit = ref<boolean>(false);
|
||||
const registerForm = ref();
|
||||
const emit = defineEmits(['register', 'success']);
|
||||
|
||||
|
|
@ -38,12 +45,33 @@ function add() {
|
|||
*/
|
||||
function edit(record) {
|
||||
title.value = disableSubmit.value ? '详情' : '编辑';
|
||||
isAudit.value = false
|
||||
visible.value = true;
|
||||
nextTick(() => {
|
||||
registerForm.value.edit(record);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 审批列表 - 审批
|
||||
* @param record
|
||||
*/
|
||||
function audit(record) {
|
||||
title.value = '审批';
|
||||
isAudit.value = true
|
||||
visible.value = true;
|
||||
nextTick(() => {
|
||||
registerForm.value.edit(record, false, true);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开审核列表
|
||||
*/
|
||||
function openAuditList() {
|
||||
auditVisible.value = true;
|
||||
}
|
||||
|
||||
/**
|
||||
* 编辑指令资源
|
||||
* @param record
|
||||
|
|
@ -52,7 +80,7 @@ function editMedia(record) {
|
|||
title.value = '编辑指令资源';
|
||||
visible.value = true;
|
||||
nextTick(() => {
|
||||
registerForm.value.edit(record,true);
|
||||
registerForm.value.edit(record, true);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -60,7 +88,11 @@ function editMedia(record) {
|
|||
* 确定按钮点击事件
|
||||
*/
|
||||
function handleOk() {
|
||||
registerForm.value.submitForm();
|
||||
if (isAudit.value) {
|
||||
registerForm.value.submitAudit();
|
||||
} else {
|
||||
registerForm.value.submitForm();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -78,11 +110,21 @@ function handleCancel() {
|
|||
visible.value = false;
|
||||
}
|
||||
|
||||
/**
|
||||
* 审核列表-关闭按钮回调事件
|
||||
*/
|
||||
function handleAuditCancel() {
|
||||
auditVisible.value = false;
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
add,
|
||||
edit,
|
||||
editMedia,
|
||||
disableSubmit,
|
||||
audit,
|
||||
isAudit,
|
||||
openAuditList,
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,299 @@
|
|||
<template>
|
||||
<div class="p-2">
|
||||
<!--引用表格-->
|
||||
<BasicTable @register="registerTable">
|
||||
<!--插槽:table标题-->
|
||||
<template #tableTitle>
|
||||
</template>
|
||||
<!--操作栏-->
|
||||
<template #action="{ record }">
|
||||
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
|
||||
</template>
|
||||
<template v-slot:bodyCell="{ column, record, index, text }">
|
||||
<!-- 音频播放控制 -->
|
||||
<template v-if="column.dataIndex === 'mp3File'">
|
||||
<span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
|
||||
<a-button v-else type="link" class="btnPrivate" @click="openAudioModal(text)">播放</a-button>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'mp4File'">
|
||||
<span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
|
||||
<a-button v-else type="link" class="btnPrivate" @click="openVideoModal(text)">播放</a-button>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'bodyTagList'">
|
||||
<span :title="text.map((item) => item.tagName).join('、')">{{text.map((item) =>
|
||||
item.tagName).join('、')}}</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'emotionTagList'">
|
||||
<span :title="text.map((item) => item.tagName).join('、')">{{text.map((item) =>
|
||||
item.tagName).join('、')}}</span>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
<!-- 表单区域 -->
|
||||
<ConfigServiceDirectiveModal ref="registerModal" @success="handleSuccess">
|
||||
</ConfigServiceDirectiveModal>
|
||||
</div>
|
||||
|
||||
<!-- 音频播放 -->
|
||||
<a-modal v-model:visible="showAudioModal" title="音频播放" :footer="null" @cancel="closeAudioModal"
|
||||
:bodyStyle="{ padding: '0', maxHeight: '80vh', overflow: 'auto' }" :keyboard="true">
|
||||
<audio controls style="width: 100%; display: block; margin: 20px auto;">
|
||||
<source :src="audioUrl">
|
||||
您的浏览器不支持音频播放。
|
||||
</audio>
|
||||
</a-modal>
|
||||
|
||||
<!-- 视频播放 -->
|
||||
<a-modal v-model:visible="showVideoModal" title="视频播放" :footer="null" @cancel="closeVideoModal"
|
||||
:bodyStyle="{ padding: '0', maxHeight: '80vh', overflow: 'auto' }">
|
||||
<video controls style="width: 100%; max-height: 70vh; display: block; margin: 0 auto;">
|
||||
<source :src="videoUrl">
|
||||
您的浏览器不支持视频播放。
|
||||
</video>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" name="serviceDirective-configServiceDirective" setup>
|
||||
import { ref, reactive, watch, onMounted } from 'vue';
|
||||
import { BasicTable, TableAction } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { auditColumns, superQuerySchema } from '../ConfigServiceDirective.data';
|
||||
import { list, deleteOne, batchDelete, getImportUrl, getExportUrl } from '../ConfigServiceDirective.api';
|
||||
import ConfigServiceDirectiveModal from './ConfigServiceDirectiveModal.vue'
|
||||
import { cloneDeep } from "lodash-es";
|
||||
import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
|
||||
|
||||
const formRef = ref();
|
||||
const queryParam = reactive<any>({
|
||||
instructionTagId: '',
|
||||
categoryId: '',
|
||||
typeId: '',
|
||||
});
|
||||
watch(
|
||||
() => queryParam.instructionTagId,
|
||||
() => {
|
||||
queryParam.categoryId = ''
|
||||
queryParam.typeId = ''
|
||||
}
|
||||
)
|
||||
|
||||
// 当服务类别变动，清空服务类型
|
||||
watch(
|
||||
() => queryParam.categoryId,
|
||||
() => {
|
||||
queryParam.typeId = ''
|
||||
}
|
||||
)
|
||||
const registerModal = ref();
|
||||
//注册table数据
|
||||
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
||||
tableProps: {
|
||||
title: '服务指令',
|
||||
api: list,
|
||||
columns: auditColumns,
|
||||
canResize: false,
|
||||
useSearchForm: false,
|
||||
showIndexColumn: true,
|
||||
pagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '50', '100'],
|
||||
},
|
||||
actionColumn: {
|
||||
width: 200,
|
||||
fixed: 'right',
|
||||
},
|
||||
beforeFetch: async (params) => {
|
||||
params.column = 'createTime'
|
||||
params.order = 'desc'
|
||||
params.status = '1,2,3'
|
||||
let rangerQuery = await setRangeQuery();
|
||||
return Object.assign(params, rangerQuery);
|
||||
},
|
||||
},
|
||||
exportConfig: {
|
||||
name: "服务指令",
|
||||
url: getExportUrl,
|
||||
params: queryParam,
|
||||
},
|
||||
importConfig: {
|
||||
url: getImportUrl,
|
||||
success: handleSuccess
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
|
||||
|
||||
/**
|
||||
* 详情
|
||||
*/
|
||||
function handleAudit(record: Recordable) {
|
||||
registerModal.value.disableSubmit = true;
|
||||
registerModal.value.isAudit = true;
|
||||
registerModal.value.audit(record);
|
||||
}
|
||||
|
||||
/**
|
||||
* 成功回调
|
||||
*/
|
||||
function handleSuccess() {
|
||||
(selectedRowKeys.value = []) && reload();
|
||||
}
|
||||
|
||||
/**
|
||||
* 编辑指令资源
|
||||
*/
|
||||
function handleMedia(record: Recordable) {
|
||||
registerModal.value.disableSubmit = false;
|
||||
registerModal.value.editMedia(record);
|
||||
}
|
||||
|
||||
/**
|
||||
* 操作栏
|
||||
*/
|
||||
function getTableAction(record) {
|
||||
return [
|
||||
{
|
||||
label: '审批',
|
||||
onClick: handleAudit.bind(null, record),
|
||||
ifShow: record.status == '1'
|
||||
},
|
||||
{
|
||||
label: '指令资源',
|
||||
onClick: handleMedia.bind(null, record)
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* 下拉操作栏
|
||||
*/
|
||||
function getDropDownAction(record) {
|
||||
return [
|
||||
|
||||
]
|
||||
}
|
||||
|
||||
let rangeField = 'tollPrice,comPrice,'
|
||||
|
||||
/**
|
||||
* 设置范围查询条件
|
||||
*/
|
||||
async function setRangeQuery() {
|
||||
let queryParamClone = cloneDeep(queryParam);
|
||||
if (rangeField) {
|
||||
let fieldsValue = rangeField.split(',');
|
||||
fieldsValue.forEach(item => {
|
||||
if (queryParamClone[item]) {
|
||||
let range = queryParamClone[item];
|
||||
queryParamClone[item + '_begin'] = range[0];
|
||||
queryParamClone[item + '_end'] = range[1];
|
||||
delete queryParamClone[item];
|
||||
} else {
|
||||
queryParamClone[item + '_begin'] = '';
|
||||
queryParamClone[item + '_end'] = '';
|
||||
}
|
||||
})
|
||||
}
|
||||
return queryParamClone;
|
||||
}
|
||||
|
||||
const showAudioModal = ref(false); // 控制音频模态框显示
|
||||
const audioUrl = ref(''); // 音频 URL
|
||||
|
||||
// 打开音频模态框
|
||||
const openAudioModal = (url) => {
|
||||
audioUrl.value = getFileAccessHttpUrl(url);
|
||||
showAudioModal.value = true;
|
||||
};
|
||||
|
||||
// 关闭音频模态框
|
||||
const closeAudioModal = () => {
|
||||
showAudioModal.value = false;
|
||||
audioUrl.value = '';
|
||||
};
|
||||
|
||||
const showVideoModal = ref(false); // 控制模态框显示
|
||||
const videoUrl = ref(''); // 视频 URL
|
||||
|
||||
// 打开视频模态框
|
||||
const openVideoModal = (url) => {
|
||||
videoUrl.value = getFileAccessHttpUrl(url);
|
||||
showVideoModal.value = true;
|
||||
};
|
||||
|
||||
// 关闭视频模态框
|
||||
const closeVideoModal = () => {
|
||||
showVideoModal.value = false;
|
||||
videoUrl.value = '';
|
||||
};
|
||||
|
||||
// 添加以下响应式变量
|
||||
const audioPlayer = ref<HTMLAudioElement | null>(null);
|
||||
const currentPlayingAudio = ref<string | null>(null);
|
||||
const isPlaying = ref(false);
|
||||
|
||||
const stopAudio = () => {
|
||||
if (audioPlayer.value) {
|
||||
audioPlayer.value.pause();
|
||||
audioPlayer.value.currentTime = 0;
|
||||
isPlaying.value = false;
|
||||
currentPlayingAudio.value = null;
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
// 添加音频结束监听
|
||||
if (audioPlayer.value) {
|
||||
audioPlayer.value.addEventListener('ended', () => {
|
||||
isPlaying.value = false;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.jeecg-basic-table-form-container {
|
||||
padding: 0;
|
||||
|
||||
.table-page-search-submitButtons {
|
||||
display: block;
|
||||
margin-bottom: 24px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.query-group-cust {
|
||||
min-width: 100px !important;
|
||||
}
|
||||
|
||||
.query-group-split-cust {
|
||||
width: 30px;
|
||||
display: inline-block;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.ant-form-item:not(.ant-form-item-with-help) {
|
||||
margin-bottom: 16px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
:deep(.ant-picker),
|
||||
:deep(.ant-input-number) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
audio::-webkit-media-controls-timeline {
|
||||
display: none;
|
||||
}
|
||||
|
||||
audio::-webkit-media-controls-current-time-display,
|
||||
audio::-webkit-media-controls-time-remaining-display {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.btnPrivate {
|
||||
height: 34px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue