yangjun
/
nursing_unit_vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

服务指令包样式调整

This commit is contained in:
1378012178@qq.com 2025-09-04 16:22:31 +08:00
parent e75de1efde
commit 8e7ce5f40b
8 changed files with 620 additions and 429 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
.env.development2
View File

@ -25,11 +25,11 @@ VITE_DEFAULT_ELDER_TAG_BODY_PIC = 'https://www.focusnu.com/media/default/bodyDef
# 长者标签-情绪标签默认图片
VITE_DEFAULT_ELDER_TAG_EMO_PIC = 'https://www.focusnu.com/media/default/emoDefault.png'
# 服务指令-服务指令图片（大）默认图片
VITE_DEFAULT_DIRECTIVE_PRE_PIC = 'https://www.focusnu.com/media/default/default.png'
VITE_DEFAULT_DIRECTIVE_PRE_PIC = 'https://www.focusnu.com/media/default/predefault.png'
# 服务指令-服务指令图片（小）默认图片
VITE_DEFAULT_DIRECTIVE_PRESMALL_PIC = 'https://www.focusnu.com/media/default/default.png'
VITE_DEFAULT_DIRECTIVE_PRESMALL_PIC = 'https://www.focusnu.com/media/default/presmalldefault.png'
# 服务指令-即时指令图标默认图片
VITE_DEFAULT_DIRECTIVE_IM_PIC = 'https://www.focusnu.com/media/default/default.png'
VITE_DEFAULT_DIRECTIVE_IM_PIC = 'https://www.focusnu.com/media/default/imdefault.png'
# 填写后将作为乾坤子应用启动，主应用注册时AppName需保持一致（放开 VITE_GLOB_QIANKUN_MICRO_APP_NAME 参数表示jeecg-vue3将以乾坤子应用模式启动）
#VITE_GLOB_QIANKUN_MICRO_APP_NAME=jeecg-vue3

6
.env.development3
View File

@ -25,11 +25,11 @@ VITE_DEFAULT_ELDER_TAG_BODY_PIC = 'https://www.focusnu.com/media/default/bodyDef
# 长者标签-情绪标签默认图片
VITE_DEFAULT_ELDER_TAG_EMO_PIC = 'https://www.focusnu.com/media/default/emoDefault.png'
# 服务指令-服务指令图片（大）默认图片
VITE_DEFAULT_DIRECTIVE_PRE_PIC = 'https://www.focusnu.com/media/default/default.png'
VITE_DEFAULT_DIRECTIVE_PRE_PIC = 'https://www.focusnu.com/media/default/predefault.png'
# 服务指令-服务指令图片（小）默认图片
VITE_DEFAULT_DIRECTIVE_PRESMALL_PIC = 'https://www.focusnu.com/media/default/default.png'
VITE_DEFAULT_DIRECTIVE_PRESMALL_PIC = 'https://www.focusnu.com/media/default/presmalldefault.png'
# 服务指令-即时指令图标默认图片
VITE_DEFAULT_DIRECTIVE_IM_PIC = 'https://www.focusnu.com/media/default/default.png'
VITE_DEFAULT_DIRECTIVE_IM_PIC = 'https://www.focusnu.com/media/default/imdefault.png'
# 填写后将作为乾坤子应用启动，主应用注册时AppName需保持一致（放开 VITE_GLOB_QIANKUN_MICRO_APP_NAME 参数表示jeecg-vue3将以乾坤子应用模式启动）
#VITE_GLOB_QIANKUN_MICRO_APP_NAME=jeecg-vue3

6
.env.production
View File

@ -26,11 +26,11 @@ VITE_DEFAULT_ELDER_TAG_BODY_PIC = 'https://www.focusnu.com/media/default/bodyDef
# 长者标签-情绪标签默认图片
VITE_DEFAULT_ELDER_TAG_EMO_PIC = 'https://www.focusnu.com/media/default/emoDefault.png'
# 服务指令-服务指令图片（大）默认图片
VITE_DEFAULT_DIRECTIVE_PRE_PIC = 'https://www.focusnu.com/media/default/default.png'
VITE_DEFAULT_DIRECTIVE_PRE_PIC = 'https://www.focusnu.com/media/default/predefault.png'
# 服务指令-服务指令图片（小）默认图片
VITE_DEFAULT_DIRECTIVE_PRESMALL_PIC = 'https://www.focusnu.com/media/default/default.png'
VITE_DEFAULT_DIRECTIVE_PRESMALL_PIC = 'https://www.focusnu.com/media/default/presmalldefault.png'
# 服务指令-即时指令图标默认图片
VITE_DEFAULT_DIRECTIVE_IM_PIC = 'https://www.focusnu.com/media/default/default.png'
VITE_DEFAULT_DIRECTIVE_IM_PIC = 'https://www.focusnu.com/media/default/imdefault.png'
# 填写后将作为乾坤子应用启动，主应用注册时AppName需保持一致（放开 VITE_GLOB_QIANKUN_MICRO_APP_NAME 参数表示jeecg-vue3将以乾坤子应用模式启动）
#VITE_GLOB_QIANKUN_MICRO_APP_NAME=jeecg-vue3

7
src/views/services/directivePackage/DirectivePackageList.vue
View File

@ -188,10 +188,11 @@ onMounted(() => {
<style lang="less" scoped>
.jeecg-basic-table-form-container {
padding: 0;
margin-bottom: 14px;
.table-page-search-submitButtons {
display: block;
margin-bottom: 24px;
margin-bottom: 14px;
white-space: nowrap;
}
@ -206,7 +207,7 @@ onMounted(() => {
}
.ant-form-item:not(.ant-form-item-with-help) {
margin-bottom: 16px;
margin-bottom: 14px;
height: 32px;
}
@ -217,7 +218,7 @@ onMounted(() => {
}
.bjclass{
text-align: center;
margin-top: 24px;
margin-top: 14px;
border-radius: 50%;
width: 60px;
height: 60px;

122
src/views/services/directivePackage/components/ConfigServiceDirective.data.ts
View File

@ -5,6 +5,7 @@ export const columns: BasicColumn[] = [
title: '分类标签',
align: 'center',
dataIndex: 'instructionTagId_dictText',
width: 120,
},
{
title: '服务类别',
@ -21,36 +22,43 @@ export const columns: BasicColumn[] = [
align: 'center',
dataIndex: 'directiveName',
},
{
title: '体型标签',
align: 'center',
dataIndex: 'bodyTagList',
ellipsis: false,
format(text, record, index) {
if (!!text) {
return text.map((item) => item.tagName).join('、');
} else {
return '-';
}
},
},
{
title: '情绪标签',
align: 'center',
dataIndex: 'emotionTagList',
ellipsis: false,
format(text, record, index) {
if (!!text) {
return text.map((item) => item.tagName).join('、');
} else {
return '-';
}
},
},
// {
// title: '体型标签',
// align: 'center',
// dataIndex: 'bodyTagList',
// ellipsis: false,
// format(text, record, index) {
// if (!!text) {
// return text.map((item) => item.tagName).join('、');
// } else {
// return '-';
// }
// },
// },
// {
// title: '情绪标签',
// align: 'center',
// dataIndex: 'emotionTagList',
// ellipsis: false,
// format(text, record, index) {
// if (!!text) {
// return text.map((item) => item.tagName).join('、');
// } else {
// return '-';
// }
// },
// },
{
title: '周期类型',
align: 'center',
dataIndex: 'cycleType_dictText',
width: 90,
},
{
title: '服务时长',
align: 'center',
dataIndex: 'serviceDuration',
width: 90,
},
];
@ -66,6 +74,7 @@ export const selectedColumns: BasicColumn[] = [
title: '分类标签',
align: 'center',
dataIndex: 'instructionTagName',
width: 120,
},
{
title: '服务类别',
@ -82,36 +91,43 @@ export const selectedColumns: BasicColumn[] = [
align: 'center',
dataIndex: 'directiveName',
},
{
title: '指令标签',
align: 'center',
dataIndex: 'bodyTagList',
ellipsis: false,
format(text, record, index) {
if (!!text) {
return text.map((item) => item.tagName).join('、');
} else {
return '-';
}
},
},
{
title: '指令标签',
align: 'center',
dataIndex: 'emotionTagList',
ellipsis: false,
format(text, record, index) {
if (!!text) {
return text.map((item) => item.tagName).join('、');
} else {
return '-';
}
},
},
// {
// title: '指令标签',
// align: 'center',
// dataIndex: 'bodyTagList',
// ellipsis: false,
// format(text, record, index) {
// if (!!text) {
// return text.map((item) => item.tagName).join('、');
// } else {
// return '-';
// }
// },
// },
// {
// title: '指令标签',
// align: 'center',
// dataIndex: 'emotionTagList',
// ellipsis: false,
// format(text, record, index) {
// if (!!text) {
// return text.map((item) => item.tagName).join('、');
// } else {
// return '-';
// }
// },
// },
{
title: '周期类型',
align: 'center',
dataIndex: 'cycleType',
width: 90,
},
{
title: '服务时长',
align: 'center',
dataIndex: 'serviceDuration',
width: 90,
},
{
title: '操作',
@ -119,6 +135,6 @@ export const selectedColumns: BasicColumn[] = [
slots: { customRender: 'action' },
fixed: 'right', // 如果需要固定在右侧
align: 'center',
width: 100,
width: 80,
},
];

302
src/views/services/directivePackage/components/ConfigServiceDirectiveList.vue
View File

@ -5,116 +5,147 @@
<a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol"
:wrapper-col="wrapperCol">
<a-row :gutter="24">
<a-col :lg="4">
<a-form-item name="categoryId">
<template #label><span title="服务类别">分类标签</span></template>
<j-dict-select-tag type="list" v-model:value="queryParam.instructionTagId"
<a-col :lg="5">
<a-form-item name="instructionTagId">
<template #label><span title="分类标签">分类标签</span></template>
<j-dict-select-tag v-model:value="queryParam.instructionTagId"
:dictCode="`nu_config_service_instruction_tag,instruction_name,id,del_flag = 0 and iz_enabled = 0 order by sort asc`"
:ignoreDisabled="true" placeholder="请选择服务类别" allow-clear :disabled="queryParam.instructionTagId" />
placeholder="请选择分类标签" allowClear :ignoreDisabled="true"
@change="onInstructionTagChange" />
</a-form-item>
</a-col>
<a-col :lg="4">
<a-col :lg="5">
<a-form-item name="categoryId">
<template #label><span title="服务类别">服务类别</span></template>
<j-dict-select-tag type="list" v-model:value="queryParam.categoryId"
:dictCode="`nu_config_service_category,category_name,id,del_flag = 0 and iz_enabled = 0 order by sort asc`"
:ignoreDisabled="true" placeholder="请选择服务类别" allow-clear />
:dictCode="`nu_config_service_category,category_name,id,del_flag = 0 and iz_enabled = 0 and instruction_id = '${queryParam.instructionTagId || ''}' order by sort asc`"
placeholder="请选择服务类别" allowClear :ignoreDisabled="true"
@change="onCategoryChange" />
</a-form-item>
</a-col>
<a-col :lg="4">
<a-col :lg="5">
<a-form-item name="typeId">
<template #label><span title="服务类型">服务类型</span></template>
<j-dict-select-tag type="list" v-model:value="queryParam.typeId"
:dictCode="`nu_config_service_type,type_name,id,del_flag = 0 and iz_enabled = 0 and category_id = ${queryParam.categoryId || -1} order by sort asc`"
placeholder="请选择服务类型" :ignoreDisabled="true" allowClear />
:dictCode="`nu_config_service_type,type_name,id,del_flag = 0 and iz_enabled = 0 and category_id = '${queryParam.categoryId || ''}' order by sort asc`"
placeholder="请选择服务类型" allowClear :ignoreDisabled="true" />
</a-form-item>
</a-col>
<a-col :lg="4">
<a-col :lg="5">
<a-form-item name="directiveName">
<template #label><span title="服务指令">服务指令</span></template>
<JInput v-model:value="queryParam.directiveName" placeholder="请输入服务指令名称" allowClear />
</a-form-item>
</a-col>
<a-col :xl="4" :lg="7" :md="8" :sm="24">
<span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
<a-col :lg="6">
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset"
style="margin-left: 8px">重置</a-button>
</a-col>
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button>
</span>
</a-col>
</a-row>
</a-form>
</div>
<!--引用表格-->
<BasicTable @register="registerTable" :scroll="{ x: '100%', y: '32vh' }">
<!--插槽:table标题-->
<template #tableTitle>
</template>
<!--操作栏-->
<template #action="{ record }">
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
</template>
<template v-slot:bodyCell="{ column, record, index, text }">
</template>
</BasicTable>
<a-table :columns="selectedColumns" :data-source="directiveList" :scroll="{ x: '100%', y: '32vh' }"
:pagination="false" size="small">
<template v-slot:bodyCell="{ column, record, index, text }">
<span v-if="column.dataIndex === 'index'">
{{ parseInt(index) + 1 }}
</span>
<span v-if="column.dataIndex === 'instructionTagName'">
{{ text || record.instructionTagId_dictText }}
</span>
<span v-if="column.dataIndex === 'categoryName'">
{{ text || record.categoryId_dictText }}
</span>
<span v-if="column.dataIndex === 'typeName'">
{{ text || record.typeId_dictText }}
</span>
<span v-if="column.dataIndex === 'bodyTagList'">
{{ handleTags('', text, '') }}
</span>
<span v-if="column.dataIndex === 'emotionTagList'">
{{ handleTags('', text, '') }}
</span>
<span v-if="column.dataIndex === 'cycleType'">
{{ filterDictTextByCache('period_type', text) }}
</span>
</template>
<template #action="{ record }">
<a @click="removeDirective(record.id)">移除</a>
</template>
</a-table>
<div style="text-align: right;margin-top: 10px;margin-right: 10px;">
共 {{ directiveList.length }} 条记录
</div>
<!-- 表单区域 -->
<ConfigServiceDirectiveModal ref="registerModal" @success="handleSuccess"></ConfigServiceDirectiveModal>
<!--左右布局：左侧指令列表，右侧已选列表-->
<a-row>
<!-- 左侧：指令列表 -->
<a-col :span="12">
<div style="margin-left: 14px; padding: 1px; background-color: white; border-radius: 10px;">
<a-tag color="blue" style="margin-top: 8px; margin-left: 14px;">全部指令</a-tag>
<BasicTable @register="registerTable" :scroll="{ x: '100%', y: '58vh' }">
<!--操作栏-->
<template #action="{ record }">
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
</template>
</BasicTable>
</div>
</a-col>
<!-- 右侧：已选择指令 -->
<a-col :span="12">
<div style="margin-left: 14px; padding: 8px 14px; background-color: white; border-radius: 10px;">
<a-tag color="green" style="margin-bottom: 10px;">已选择 {{ directiveList.length }} 条</a-tag>
<a-table :columns="selectedColumns" :data-source="directiveList" :scroll="{ x: '100%', y: '67vh' }"
:pagination="false" size="small" bordered>
<template v-slot:bodyCell="{ column, record, index, text }">
<span v-if="column.dataIndex === 'index'">
{{ index + 1 }}
</span>
<span v-else-if="column.dataIndex === 'instructionTagName'">
{{ text || record.instructionTagId_dictText }}
</span>
<span v-else-if="column.dataIndex === 'categoryName'">
{{ text || record.categoryId_dictText }}
</span>
<span v-else-if="column.dataIndex === 'typeName'">
{{ text || record.typeId_dictText }}
</span>
<span v-else-if="column.dataIndex === 'bodyTagList'">
{{ handleTags('', text, '') }}
</span>
<span v-else-if="column.dataIndex === 'emotionTagList'">
{{ handleTags('', text, '') }}
</span>
<span v-else-if="column.dataIndex === 'cycleType'">
{{ filterDictTextByCache('period_type', text) }}
</span>
<span v-else>{{ text }}</span>
</template>
<template #action="{ record }">
<a @click="removeDirective(record.id)">移除</a>
</template>
</a-table>
</div>
</a-col>
</a-row>
<!-- 表单弹窗 -->
<ConfigServiceDirectiveModal ref="registerModal" @success="handleSuccess" />
</div>
</template>
<script lang="ts" name="serviceDirective-configServiceDirective" setup>
import { ref, reactive, computed, defineExpose } from 'vue';
import { ref, reactive, defineEmits, defineProps, computed } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage';
import { columns, selectedColumns } from './ConfigServiceDirective.data';
import { list, deleteOne, batchDelete, getImportUrl, getExportUrl } from './ConfigServiceDirective.api';
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
import JInput from '/@/components/Form/src/jeecg/components/JInput.vue';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import { cloneDeep } from "lodash-es";
import ConfigServiceDirectiveModal from './ConfigServiceDirectiveModal.vue'
import { cloneDeep } from 'lodash-es';
import ConfigServiceDirectiveModal from './ConfigServiceDirectiveModal.vue';
import { filterDictTextByCache } from '/@/utils/dict/JDictSelectUtil';
const emit = defineEmits(['deleteDirective', 'addDirective']);
const formRef = ref();
const queryParam = reactive<any>({});
const registerModal = ref();
const directiveInfo = ref<any>({});
//注册table数据
// 接收已选择的指令列表
const props = defineProps({
directiveList: {
type: Array,
default: () => []
}
});
// 判断是否已被选中（用于高亮）
const isDirectiveSelected = (id) => {
return props.directiveList.some(item => item.id === id);
};
// 表单布局
const labelCol = reactive({ xs: 24, sm: 8, xl: 8, xxl: 8 });
const wrapperCol = reactive({ xs: 24, sm: 16 });
// 注册表格
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
tableProps: {
title: '服务指令',
@ -126,58 +157,42 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
showIndexColumn: true,
showTableSetting: false,
actionColumn: {
width: 90,
width: 80,
fixed: 'center',
},
// 👉 关键：通过 customRow 设置背景色
customRow: (record) => {
return {
style: isDirectiveSelected(record.id) ? 'background-color: #E6F7FF;' : ''
};
},
beforeFetch: async (params) => {
params.column = 'createTime'
params.order = 'desc'
params.column = 'createTime';
params.order = 'desc';
let rangerQuery = await setRangeQuery();
return Object.assign(params, rangerQuery);
},
},
});
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
const props = defineProps({
directiveList: [],
});
const labelCol = reactive({
xs: 24,
sm: 8,
xl: 8,
xxl: 8
});
const wrapperCol = reactive({
xs: 24,
sm: 16,
});
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
/**
* 成功回调
*/
function handleSuccess() {
(selectedRowKeys.value = []) && reload();
}
function getInstructionName(record) {
console.log("🚀 ~ getInstructionName ~ record:", record)
return "";
}
/**
* 选择
* @param directive_
*/
function handleSelect(directive_) {
console.log("🚀 ~ handleSelect ~ directive_:", directive_)
queryParam.instructionTagId = directive_.instructionTagId
reload();
emit('addDirective', directive_)
}
/**
* 操作栏
* 选择指令
*/
function handleSelect(record) {
emit('addDirective', record);
}
/**
* 操作栏：选择按钮
*/
function getTableAction(record) {
return [
@ -188,37 +203,44 @@ function getTableAction(record) {
];
}
/**
* 下拉操作栏
*/
function getDropDownAction(record) {
return [
]
return [];
}
/**
* 查询
* 查询 / 重置
*/
function searchQuery() {
reload();
}
/**
* 重置
*/
function searchReset() {
formRef.value.resetFields();
queryParam.instructionTagId = undefined;
queryParam.categoryId = undefined;
queryParam.typeId = undefined;
selectedRowKeys.value = [];
//刷新数据
reload();
}
let rangeField = 'tollPrice,comPrice,'
/**
* 联动更新：分类标签变化时清空下级
*/
function onInstructionTagChange() {
queryParam.categoryId = undefined;
queryParam.typeId = undefined;
reload();
}
function onCategoryChange() {
queryParam.typeId = undefined;
reload();
}
/**
* 设置范围查询条件
* 范围查询处理
*/
let rangeField = 'tollPrice,comPrice,';
async function setRangeQuery() {
let queryParamClone = cloneDeep(queryParam);
if (rangeField) {
@ -233,67 +255,57 @@ async function setRangeQuery() {
queryParamClone[item + '_begin'] = '';
queryParamClone[item + '_end'] = '';
}
})
});
}
return queryParamClone;
}
/**
* 移除
* @param directiveId
* 移除已选指令
*/
function removeDirective(directiveId) {
emit('deleteDirective', directiveId)
emit('deleteDirective', directiveId);
}
/**
* 处理服务指令标签翻译
* 标签处理
*/
function handleTags(prefix, tagList, suffix) {
if (!!tagList && tagList.length > 0) {
if (Array.isArray(tagList) && tagList.length > 0) {
let str = tagList.map(item => item.tagName).join('、 ');
return prefix + str + suffix
return prefix + str + suffix;
} else {
return ' - '
return ' - ';
}
}
function edit(record) {
console.log("🚀 ~ edit ~ record:", record)
directiveInfo.value = record
console.log("🚀 ~ edit ~ directiveInfo:", directiveInfo)
queryParam.instructionTagId = record.instructionTagId
}
defineExpose({
edit
});
/**
* 编辑方法（供父组件调用）
*/
function edit(record) {
directiveInfo.value = record;
queryParam.instructionTagId = record.instructionTagId;
}
defineExpose({ edit });
</script>
<style lang="less" scoped>
.jeecg-basic-table-form-container {
padding: 0;
margin-bottom: 14px;
.table-page-search-submitButtons {
display: block;
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) {
height: 0px;
:deep(.ant-form-item) {
margin-bottom: 8px;
}
:deep(.ant-picker),
:deep(.ant-input-number) {
:deep(.ant-input-number),
:deep(.ant-select-selector) {
width: 100%;
}
}

269
src/views/services/directivePackage/components/DirectivePackageForm.vue
View File

@ -1,40 +1,112 @@
<template>
<a-spin :spinning="confirmLoading">
<JFormContainer :disabled="disabled">
<template #detail>
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol"
name="DirectivePackageForm">
<a-row>
<a-col :span="8">
<a-form-item label="包名称" v-bind="validateInfos.packageName" id="DirectivePackageForm-packageName" name="packageName">
<a-input v-model:value="formData.packageName" placeholder="请输入服务指令包名称" allow-clear></a-input>
</a-form-item>
</a-col>
<a-col :span="6">
<a-form-item label="是否启用" v-bind="validateInfos.izEnabled" id="DirectivePackageForm-izEnabled"
name="izEnabled">
<j-dict-select-tag type='radio' v-model:value="formData.izEnabled" dictCode="iz_enabled"
placeholder="是否启用" allow-clear />
</a-form-item>
</a-col>
<a-col :span="10">
<a-form-item label="时间" v-bind="validateInfos.startTimeStr" id="DirectivePackageForm-startTimeStr"
name="startTimeStr">
<a-time-picker v-model:value="formData.startTimeStr" format="HH:mm" />
-
<a-time-picker v-model:value="formData.endTimeStr" format="HH:mm" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="说明" v-bind="validateInfos.description" id="DirectivePackageForm-description"
name="description" :labelCol="labelCol2" :wrapperCol="wrapperCol2">
<a-textarea v-model:value="formData.description" :rows="1" placeholder="请输入说明" />
</a-form-item>
</a-col>
</a-row>
</a-form>
</template>
</JFormContainer>
<div class="card-style">
<JFormContainer :disabled="disabled">
<template #detail>
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol"
name="DirectivePackageForm">
<!-- <a-row>
<a-col :span="12">
<a-form-item label="指令包名称" v-bind="validateInfos.packageName" id="DirectivePackageForm-packageName"
name="packageName">
<a-input v-model:value="formData.packageName" placeholder="请输入服务指令包名称" allow-clear :maxlength="20"
:showCount="true"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="是否启用" v-bind="validateInfos.izEnabled" id="DirectivePackageForm-izEnabled"
name="izEnabled" :labelCol="labelCol2" :wrapperCol="wrapperCol2">
<j-dict-select-tag type='radio' v-model:value="formData.izEnabled" dictCode="iz_enabled"
placeholder="是否启用" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="服务总时长" v-bind="validateInfos.totalDuration" id="DirectivePackageForm-totalDuration"
name="totalDuration">
<a-input-number v-model:value="formData.totalDuration" :min="1" :step="5" addon-after="分钟"
placeholder="请输入服务时长（分钟）" allow-clear @keydown="onDurationKeydown" :disabled="disabled" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="服务包说明" v-bind="validateInfos.description" id="DirectivePackageForm-description"
name="description" :labelCol="labelCol2" :wrapperCol="wrapperCol2">
<a-textarea v-model:value="formData.description" :maxlength="200" :autosize="{ minRows: 2 }"
:showCount="true" placeholder="请输入说明" />
</a-form-item>
</a-col>
</a-row> -->
<!-- <a-row>
<a-col :span="8">
<a-form-item label="指令包名称" v-bind="validateInfos.packageName" id="DirectivePackageForm-packageName"
name="packageName">
<a-input v-model:value="formData.packageName" placeholder="请输入服务指令包名称" allow-clear :maxlength="20"
:showCount="true"></a-input>
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="服务总时长" v-bind="validateInfos.totalDuration" id="DirectivePackageForm-totalDuration"
name="totalDuration">
<a-input-number v-model:value="formData.totalDuration" :min="1" :step="5" addon-after="分钟"
placeholder="请输入服务时长（分钟）" allow-clear @keydown="onDurationKeydown" :disabled="disabled" />
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="是否启用" v-bind="validateInfos.izEnabled" id="DirectivePackageForm-izEnabled"
name="izEnabled">
<j-dict-select-tag type='radio' v-model:value="formData.izEnabled" dictCode="iz_enabled"
placeholder="是否启用" allow-clear />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="指令包说明" v-bind="validateInfos.description" id="DirectivePackageForm-description"
name="description" :labelCol="labelCol2" :wrapperCol="wrapperCol2">
<a-textarea v-model:value="formData.description" :maxlength="200" :autosize="{ minRows: 1 }"
:showCount="true" placeholder="请输入说明" />
</a-form-item>
</a-col>
</a-row> -->
<a-row>
<a-col :span="12">
<a-row>
<a-col :span="24">
<a-form-item label="指令包名称" v-bind="validateInfos.packageName" id="DirectivePackageForm-packageName"
name="packageName">
<a-input v-model:value="formData.packageName" placeholder="请输入服务指令包名称" allow-clear :maxlength="20"
:showCount="true"></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="服务总时长" v-bind="validateInfos.totalDuration"
id="DirectivePackageForm-totalDuration" name="totalDuration">
<a-input-number v-model:value="formData.totalDuration" :min="1" :step="5" addon-after="分钟"
placeholder="请输入服务时长（分钟）" allow-clear @keydown="onDurationKeydown" :disabled="disabled" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="是否启用" v-bind="validateInfos.izEnabled" id="DirectivePackageForm-izEnabled"
name="izEnabled">
<j-dict-select-tag type='list' v-model:value="formData.izEnabled" dictCode="iz_enabled"
placeholder="是否启用" allow-clear />
</a-form-item>
</a-col>
</a-row>
</a-col>
<a-col :span="12">
<a-row>
<a-col :span="24">
<a-form-item label="说明" v-bind="validateInfos.description" id="DirectivePackageForm-description"
name="description" :labelCol="labelCol2" :wrapperCol="wrapperCol2">
<a-textarea v-model:value="formData.description" :maxlength="200" :autosize="{ minRows: 5 }"
:showCount="true" placeholder="请输入说明" />
</a-form-item>
</a-col>
</a-row>
</a-col>
</a-row>
</a-form>
</template>
</JFormContainer>
</div>
</a-spin>
</template>
@ -65,20 +137,47 @@ const formData = reactive<Record<string, any>>({
startTimeStr: '',
endTimeStr: '',
instructionTagId: '',
totalDuration: 0,
});
const { createMessage } = useMessage();
const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 6 } });
const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
const labelCol2 = ref<any>({ xs: { span: 24 }, sm: { span: 2 } });
const wrapperCol2 = ref<any>({ xs: { span: 24 }, sm: { span: 21 } });
const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 6 } });
const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
const labelCol2 = ref<any>({ xs: { span: 24 }, sm: { span: 2 } });
const wrapperCol2 = ref<any>({ xs: { span: 24 }, sm: { span: 21 } });
const confirmLoading = ref<boolean>(false);
//表单验证
const validatorRules = reactive({
// packageName: [{ required: true, message: '请输入服务指令包名称!' },],
// sort: [{ required: true, message: '请输入排序!' }, { pattern: /^\d+$/, message: '请输入整数!' },],
packageName: [{ required: true, message: '请输入服务指令包名称!' },],
totalDuration: [{ required: true, message: '请输入服务总时长（分钟）!' }, {
validator: (_, value) => {
if (value <= 0) {
return Promise.reject('请输入服务总时长!');
}
return Promise.resolve();
},
},],
izEnabled: [{ required: true, message: '请选择是否启用!' },],
});
const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: false });
const onDurationKeydown = (e: KeyboardEvent) => {
const key = e.key;
// 放行控制键
if (['Backspace', 'Delete', 'ArrowLeft', 'ArrowRight', 'Tab'].includes(key)) return;
// 只能输数字和点
if (!/[\d.]/.test(key)) {
e.preventDefault();
return;
}
const input = e.target as HTMLInputElement;
const { value, selectionStart: s, selectionEnd: t } = input;
const next = value.slice(0, s!) + key + value.slice(t!);
// 整数最多5位，小数最多2位
if (!/^\d{0,3}$/.test(next)) {
e.preventDefault();
}
};
// 表单禁用
const disabled = computed(() => {
if (props.formBpm === true) {
@ -115,11 +214,11 @@ function edit(record) {
//赋值
Object.assign(formData, tmpData);
if(formData.startTimeStr){
formData.startTimeStr = dayjs(formData.startTimeStr,"YYYY-MM-DD hh:mm:ss")
if (formData.startTimeStr) {
formData.startTimeStr = dayjs(formData.startTimeStr, "YYYY-MM-DD hh:mm:ss")
}
if(formData.endTimeStr){
formData.endTimeStr = dayjs(formData.endTimeStr,"YYYY-MM-DD hh:mm:ss")
if (formData.endTimeStr) {
formData.endTimeStr = dayjs(formData.endTimeStr, "YYYY-MM-DD hh:mm:ss")
}
console.log("🚀 ~ nextTick ~ formData:", formData)
});
@ -162,43 +261,43 @@ async function submitForm(directives) {
if (directives.length > 0) {
model.directives = directives
}
if(!model.packageName){
createMessage.warning('请填写服务指令包名称');
// if (!model.packageName) {
// createMessage.warning('请填写服务指令包名称');
// confirmLoading.value = false;
// return;
// }
// if (!model.startTimeStr) {
// createMessage.warning('请选择开始时间');
// confirmLoading.value = false;
// return;
// }
// if (!model.endTimeStr) {
// createMessage.warning('请选择结束时间');
// confirmLoading.value = false;
// return;
// }
var directivesList = model.directives;
if (!directivesList || directivesList.length == 0) {
createMessage.warning('请选择服务指令');
confirmLoading.value = false;
return;
} else {
model.instructionTagId = directivesList[0].instructionTagId;
}
if(!model.startTimeStr){
createMessage.warning('请选择开始时间');
confirmLoading.value = false;
return;
}
if(!model.endTimeStr){
createMessage.warning('请选择结束时间');
confirmLoading.value = false;
return;
}
var directivesList = model.directives;
if(directivesList.length == 0){
createMessage.warning('请选择服务指令');
console.log('model', model);
// confirmLoading.value = false;
await saveOrUpdate(model, isUpdate.value)
.then((res) => {
if (res.success) {
createMessage.success(res.message);
emit('ok');
} else {
createMessage.warning(res.message);
}
})
.finally(() => {
confirmLoading.value = false;
return;
}else{
model.instructionTagId = directivesList[0].instructionTagId;
}
console.log('model', model);
// confirmLoading.value = false;
await saveOrUpdate(model, isUpdate.value)
.then((res) => {
if (res.success) {
createMessage.success(res.message);
emit('ok');
} else {
createMessage.warning(res.message);
}
})
.finally(() => {
confirmLoading.value = false;
});
});
}
@ -213,4 +312,18 @@ defineExpose({
.antd-modal-form {
padding: 14px;
}
.card-style {
padding-top: 14px;
padding-left: 14px;
padding-right: 14px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
margin-bottom: 14px;
}
:deep .ant-input-number-group-wrapper {
width: 100%;
}
</style>

325
src/views/services/directivePackage/components/DirectivePackageModal.vue
View File

@ -3,132 +3,154 @@
<DirectivePackageForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"></DirectivePackageForm>
</j-modal> -->
<a-drawer v-model:open="visible" v-if="visible" :title="title" width="80vw" :closable="false"
:footer-style="{ textAlign: 'right' }" @close="handleCancel">
:footer-style="{ textAlign: 'right' }" @close="handleCancel" :bodyStyle="{ padding: '14px' }">
<a-row>
<a-col :span="18">
<DirectivePackageForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false">
</DirectivePackageForm>
</a-col>
<a-col :span="6" style="padding-top: 19px;">
<a-button type="primary" style="margin-left:10px;" @click="handleQuoteDirectives"><Icon icon="ant-design:reconciliation-outlined" />引用服务指令包</a-button>
<a-button type="primary" style="margin-left:10px;" @click="handleAddDirectives"><Icon icon="ant-design:file-add-outlined" />选择服务指令</a-button>
<a-col :span="24">
<DirectivePackageForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false">
</DirectivePackageForm>
</a-col>
</a-row>
<a-row>
<a-col :span="6" v-for="directive of seletedRecord.directives" :key="directive.id" style="padding: 8px;" @click="directiveInfo(directive)" >
<div class="directiveClass" :class="{ 'selected': selectedDirective === directive.id }">
<div class="fenleiClass">
<a-row>
<a-col :span="12" class="ellipsis-two-lines">
{{directive.instructionTagName||directive.instructionTagId_dictText}}
<div class="card-style" style="min-height: 60vh;">
<a-row>
<a-col :span="24">
<div style="float: right;">
<a-button type="primary" @click="handleQuoteDirectives">
<Icon icon="ant-design:reconciliation-outlined" />引用服务指令包
</a-button>
<a-button type="primary" style="margin-left:10px;" @click="handleAddDirectives">
<Icon icon="ant-design:file-add-outlined" />选择服务指令
</a-button>
</div>
</a-col>
<a-col :span="6" v-for="directive of seletedRecord.directives" :key="directive.id" style="padding: 8px;"
@click="directiveInfo(directive)">
<div class="directiveClass" :class="{ 'selected': selectedDirective === directive.id }">
<div class="fenleiClass">
<a-row>
<a-col :span="12" class="ellipsis-two-lines">
{{ directive.instructionTagName || directive.instructionTagId_dictText }}
</a-col>
<a-col :span="12" style="text-align: right;padding-right: 10px;"
v-show="selectedDirective === directive.id">
<span
style="background-color: #67b4eb;border-radius: 50%;padding: 3px;color: white;width:27px;cursor: pointer;">
<a-popconfirm title="是否确认移除？" ok-text="确认" cancel-text="取消"
@confirm="deleteDirective(directive.id)">
<Icon icon="ant-design:delete-outlined" size="18" />
</a-popconfirm>
</span>
</a-col>
</a-row>
</div>
<!-- <div class="fwsjClass">10:00 - 10:10</div> -->
<div class="imgClass" style="margin-top: 10px;">
<img :src="getImgPath(directive.previewFile)" style="width: 100px;height:100px" />
</div>
<a-row style="margin-top: 10px;">
<a-col :span="14">
<span class="ellipsis-two-lines" style="margin-left:10px;font-size:20px;">{{ directive.directiveName
}}</span>
</a-col>
<a-col :span="12" style="text-align: right;padding-right: 10px;" v-show="selectedDirective === directive.id">
<span style="background-color: #67b4eb;border-radius: 50%;padding: 3px;color: white;width:27px;cursor: pointer;">
<a-popconfirm title="是否确认移除？" ok-text="确认" cancel-text="取消"
@confirm="deleteDirective(directive.id)">
<Icon icon="ant-design:delete-outlined" size="18"/>
</a-popconfirm>
<a-col :span="10" style="text-align: right;">
<span class="yuanClass">
<a-popover title="服务说明">
<template #content>
<p v-if="directive.serviceContent">{{ directive.serviceContent }}</p>
<p v-else>暂无</p>
</template>
<img style="width: 15px;height: 15px;" src="/src/assets/wlb/edit.png"></img>
</a-popover>
</span>
<span class="yuanClass">
<a-popover title="音频介绍">
<template #content>
<audio controls disabled="false" v-if="directive.mp3File">
<source :src="getFileAccessHttpUrl(directive.mp3File)">
</audio>
<span v-else>暂无</span>
</template>
<img style="width: 15px;height: 15px;" src="/src/assets/wlb/mp3.png"></img>
</a-popover>
</span>
<span class="yuanClass">
<a-popover title="视频介绍">
<template #content>
<video controls v-if="directive.mp4File">
<source :src="getFileAccessHttpUrl(directive.mp4File)">
</video>
<span v-else>暂无</span>
</template>
<img style="width: 15px;height: 15px;" src="/src/assets/wlb/mp4.png"></img>
</a-popover>
</span>
</a-col>
</a-row>
</div>
<!-- <div class="fwsjClass">10:00 - 10:10</div> -->
<div class="imgClass" style="margin-top: 10px;">
<img :src="getImgPath(directive.previewFile)" style="width: 100px;height:100px"/>
</div>
<a-row style="margin-top: 10px;">
<a-col :span="14">
<span class="ellipsis-two-lines" style="margin-left:10px;font-size:20px;">{{ directive.directiveName }}</span>
</a-col>
<a-col :span="10" style="text-align: right;">
<span class="yuanClass">
<a-popover title="服务说明">
<template #content>
<p v-if="directive.serviceContent">{{directive.serviceContent}}</p>
<p v-else>暂无</p>
</template>
<img style="width: 15px;height: 15px;" src="/src/assets/wlb/edit.png"></img>
</a-popover>
</span>
<span class="yuanClass">
<a-popover title="音频介绍">
<template #content>
<audio controls disabled="false" v-if="directive.mp3File">
<source :src="getFileAccessHttpUrl(directive.mp3File)">
</audio>
<span v-else>暂无</span>
</template>
<img style="width: 15px;height: 15px;" src="/src/assets/wlb/mp3.png"></img>
</a-popover>
</span>
<span class="yuanClass">
<a-popover title="视频介绍">
<template #content>
<video controls v-if="directive.mp4File">
<source :src="getFileAccessHttpUrl(directive.mp4File)">
</video>
<span v-else>暂无</span>
</template>
<img style="width: 15px;height: 15px;" src="/src/assets/wlb/mp4.png"></img>
</a-popover>
</span>
</a-col>
</a-row>
<div style="margin-top: 10px;">
<div style="display: flex; width:100% ;height: 50rpx;">
<view style="background-color: rgb(240,240,240);width: 100px;height: 25px;border-radius: 5px;position: relative;margin-left: 10px;">
<view style="position: absolute;top: 0;left: 0;width: 50%;height: 100%;">
<img style="width: 100%;height: 100%;position: absolute;top: 0;left: 0;" src="/src/assets/wlb/wlb-type1.png"></img>
<div style="color: #fff;z-index: 999;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 12px;">
医保
</div>
<div style="margin-top: 10px;">
<div style="display: flex; width:100% ;height: 50rpx;">
<view
style="background-color: rgb(240,240,240);width: 100px;height: 25px;border-radius: 5px;position: relative;margin-left: 10px;">
<view style="position: absolute;top: 0;left: 0;width: 50%;height: 100%;">
<img style="width: 100%;height: 100%;position: absolute;top: 0;left: 0;"
src="/src/assets/wlb/wlb-type1.png"></img>
<div
style="color: #fff;z-index: 999;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 12px;">
医保
</div>
</view>
<view style="position: absolute;top: 0;left: 40%;width: 70%;height: 100%;">
<div
style="z-index: 999;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 12px;margin-left: -2px;">
{{ directive.izReimbursement == '1' ? '报销' : '不报销' }}
</div>
</view>
</view>
<view style="position: absolute;top: 0;left: 40%;width: 70%;height: 100%;">
<div style="z-index: 999;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 12px;margin-left: -2px;">
{{directive.izReimbursement=='1'?'报销':'不报销'}}
</div>
</view>
</view>
<view style="background-color: rgb(240,240,240);width: 100px;height: 25px;border-radius: 5px;position: relative;margin-left: 10px;">
<view style="position: absolute;top: 0;left: 0;width: 50%;height: 100%;">
<img style="width: 100%;height: 100%;position: absolute;top: 0;left: 0;" src="/src/assets/wlb/wlb-type2.png"></img>
<div style="color: #fff;z-index: 999;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 12px;">
优惠
</div>
<view
style="background-color: rgb(240,240,240);width: 100px;height: 25px;border-radius: 5px;position: relative;margin-left: 10px;">
<view style="position: absolute;top: 0;left: 0;width: 50%;height: 100%;">
<img style="width: 100%;height: 100%;position: absolute;top: 0;left: 0;"
src="/src/assets/wlb/wlb-type2.png"></img>
<div
style="color: #fff;z-index: 999;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 12px;">
优惠
</div>
</view>
<view style="position: absolute;top: 0;left: 40%;width: 70%;height: 100%;">
<div
style="z-index: 999;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 12px;margin-left: -2px;">
{{ directive.izPreferential == '1' ? '参与' : '不参与' }}
</div>
</view>
</view>
<view style="position: absolute;top: 0;left: 40%;width: 70%;height: 100%;">
<div style="z-index: 999;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 12px;margin-left: -2px;">
{{directive.izPreferential=='1'?'参与':'不参与'}}
</div>
</view>
</view>
</div>
</div>
</div>
<a-divider />
<a-row>
<a-col :span="16" style="padding-left: 5px;">
<span class="typeClass" v-if="directive.typeName">{{ directive.typeName }}</span>
<span class="typeClass" v-if="handleBodyTags('', directive, '')">{{ handleBodyTags('', directive, '') }}</span>
<span class="typeClass" v-if="handleEmotionTags('', directive, '')">{{ handleEmotionTags('', directive, '') }}</span>
</a-col>
<a-col :span="8" style="text-align: right;padding-right: 5px;">
<span class="rchlClass" v-if="directive.cycleType=='1'">日常护理</span>
<span class="zqhlClass" v-if="directive.cycleType=='2'">周期护理</span>
<span class="jshlClass" v-if="directive.cycleType=='3'">即时护理</span>
</a-col>
</a-row>
<a-divider />
<a-row>
<a-col :span="16" style="padding-left: 5px;">
<span class="typeClass" v-if="directive.typeName">{{ directive.typeName }}</span>
<span class="typeClass" v-if="handleBodyTags('', directive, '')">{{ handleBodyTags('', directive, '')
}}</span>
<span class="typeClass" v-if="handleEmotionTags('', directive, '')">{{ handleEmotionTags('', directive,
'')
}}</span>
</a-col>
<a-col :span="8" style="text-align: right;padding-right: 5px;">
<span class="rchlClass" v-if="directive.cycleType == '1'">日常护理</span>
<span class="zqhlClass" v-if="directive.cycleType == '2'">周期护理</span>
<span class="jshlClass" v-if="directive.cycleType == '3'">即时护理</span>
</a-col>
</a-row>
</div>
</a-col>
</a-row>
</div>
</a-col>
</a-row>
</div>
<!-- 服务指令列表编辑页 -->
<a-drawer v-model:open="directiveEditDrawer" title="选择服务指令" width="70vw" :closable="false"
<a-drawer v-model:open="directiveEditDrawer" title="选择服务指令" width="100vw" :closable="false"
:footer-style="{ textAlign: 'right' }" :body-style="{ padding: 0 }">
<ConfigServiceDirectiveList ref="configServiceDirectiveListRef"
:directiveList="seletedRecord.directives"
<ConfigServiceDirectiveList ref="configServiceDirectiveListRef" :directiveList="seletedRecord.directives"
@deleteDirective="deleteDirective" @addDirective="addDirective">
</ConfigServiceDirectiveList>
<template #footer>
@ -139,8 +161,8 @@
<!-- 引用 -->
<a-drawer v-model:open="directiveQuoteDrawer" title="引用服务指令包" width="80vw" :closable="false"
:footer-style="{ textAlign: 'right'}" :body-style="{ background: '#dfdfdf' }" >
<PackageList ref="directivePackageListRef" ></PackageList>
:footer-style="{ textAlign: 'right' }" :body-style="{ background: '#dfdfdf' }">
<PackageList ref="directivePackageListRef"></PackageList>
<template #footer>
<a-button style="margin-right: 8px" @click="handleQuoteDrawCancel">关闭</a-button>
<a-button type="primary" @click="handleQuoteDrawOk">确定</a-button>
@ -203,10 +225,10 @@ function handleEmotionTags(prefix, directive_, suffix) {
}
}
function getImgPath(pathUrl){
if(pathUrl && pathUrl.length>0){
function getImgPath(pathUrl) {
if (pathUrl && pathUrl.length > 0) {
return getFileAccessHttpUrl(pathUrl);
}else{
} else {
return '../../resource/img/logo.png';
}
}
@ -320,7 +342,7 @@ function addDirective(directive_) {
createMessage.success('选择成功');
seletedRecord.value.directives.push(directive_)
}
console.log('seletedRecord.value--->',seletedRecord.value);
console.log('seletedRecord.value--->', seletedRecord.value);
}
/**
@ -375,7 +397,7 @@ defineExpose({
}
.directiveInfoClass {
margin-top: 10px;
margin-top: 14px;
}
.scrollable-content {
@ -389,7 +411,7 @@ defineExpose({
.directiveClass{
.directiveClass {
transition: all 0.3s ease;
position: relative;
border-radius: 8px;
@ -399,17 +421,20 @@ defineExpose({
box-shadow: 4px 4px 6px rgba(0, 0, 0, 0.1);
}
.directiveClass:hover{
.directiveClass:hover {
background: linear-gradient(to bottom, #e1f3ff, #ffffff);
border-radius: 8px;
height: 320px;
box-shadow:
0 0 0 1px #59bffe, /* 描边 */
0 4px 8px rgba(0, 0, 0, 0.1); /* 阴影 */
transform: translate(-2px , -2px); /* 轻微上浮效果 */
0 0 0 1px #59bffe,
/* 描边 */
0 4px 8px rgba(0, 0, 0, 0.1);
/* 阴影 */
transform: translate(-2px, -2px);
/* 轻微上浮效果 */
}
.fenleiClass{
.fenleiClass {
background-image: url('/src/assets/wlb/wlb-title.png');
background-size: 100% 100%;
height: 36px;
@ -417,16 +442,18 @@ defineExpose({
padding: 7px 0 0 20px;
}
.fwsjClass{
.fwsjClass {
text-align: center;
font-weight: 700;
font-size: 20px;
margin: 7px;
}
.imgClass{
.imgClass {
text-align: center;
}
.ybClass{
.ybClass {
// background: #f0f0f0;padding:5px;margin:5px;
// border-radius: 5px;
// color: #ffffff;
@ -437,54 +464,76 @@ defineExpose({
padding-left: 10px;
color: #fff;
}
.jgyhClass{
background: #f0f0f0;padding:5px;margin:5px;
.jgyhClass {
background: #f0f0f0;
padding: 5px;
margin: 5px;
border-radius: 5px;
// color: #ffffff;
}
.typeClass{
.typeClass {
margin-left: 10px;
padding: 5px;
border-radius: 5px;
background: #f0f0f0;
}
.rchlClass{
.rchlClass {
margin-left: 10px;
padding: 5px;
border-radius: 5px;
background: #f5fafe;
border: 1px solid #59bffe;
color: #59bffe;
margin-right:5px;
margin-right: 5px;
}
.zqhlClass{
.zqhlClass {
margin-left: 10px;
padding: 5px;
border-radius: 5px;
background: #fff2df;
border: 1px solid #fb9f65;
color: #fb9f65;
margin-right:5px;
margin-right: 5px;
}
.jshlClass{
.jshlClass {
margin-left: 10px;
padding: 5px;
border-radius: 5px;
background: #e9e5fe;
border: 1px solid #9986fc;
color: #9986fc;
margin-right:5px;
margin-right: 5px;
}
.yuanClass{
margin-right:10px;background-color: #e3e6e8; border-radius: 50%; padding: 0px 5px 5px 5px;
.yuanClass {
margin-right: 10px;
background-color: #e3e6e8;
border-radius: 50%;
padding: 0px 5px 5px 5px;
cursor: pointer;
}
.ellipsis-two-lines {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1; /* 限制文本为2行 */
-webkit-line-clamp: 1;
/* 限制文本为2行 */
overflow: hidden;
text-overflow: ellipsis;
}
.card-style {
padding-top: 14px;
padding-left: 14px;
padding-right: 14px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
margin-bottom: 14px;
}
</style>