量表页面初始化

This commit is contained in:
userName 2024-03-29 11:29:44 +08:00
parent 61e79de353
commit 690e72e589
4 changed files with 742 additions and 0 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.9 KiB

After

Width:  |  Height:  |  Size: 17 KiB

View File

@ -0,0 +1,63 @@
import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import { ScaleInfoVO, ScaleInfoForm, ScaleInfoQuery } from '@/api/scale/ScaleInfo/types';
/**
*
* @param query
* @returns {*}
*/
export const listScaleInfo = (query?: ScaleInfoQuery): AxiosPromise<ScaleInfoVO[]> => {
return request({
url: '/scale/ScaleInfo/list',
method: 'get',
params: query
});
};
/**
*
* @param id
*/
export const getScaleInfo = (id: string | number): AxiosPromise<ScaleInfoVO> => {
return request({
url: '/scale/ScaleInfo/' + id,
method: 'get'
});
};
/**
*
* @param data
*/
export const addScaleInfo = (data: ScaleInfoForm) => {
return request({
url: '/scale/ScaleInfo',
method: 'post',
data: data
});
};
/**
*
* @param data
*/
export const updateScaleInfo = (data: ScaleInfoForm) => {
return request({
url: '/scale/ScaleInfo',
method: 'put',
data: data
});
};
/**
*
* @param id
*/
export const delScaleInfo = (id: string | number | Array<string | number>) => {
return request({
url: '/scale/ScaleInfo/' + id,
method: 'delete'
});
};

View File

@ -0,0 +1,266 @@
export interface ScaleInfoVO {
/**
*
*/
id: string | number;
/**
*
*/
name: string;
/**
*
*/
code: string;
/**
*
*/
title: string;
/**
*
*/
subTitle: string;
/**
*
*/
tags: string;
/**
*
*/
ageRange: string;
/**
*
*/
evalNums: number;
/**
*
*/
coverImg: number;
/**
* /
*/
price: number;
/**
*
*/
note: string;
/**
*
*/
duration: number;
/**
* 0:单项单维1:多项单维型2:多项多维型
*/
dimensionType: number;
/**
* 0 1
*/
status: string;
/**
*
*/
type: number;
/**
*
*/
questionsNum: number;
/**
* 0:高分异常1
*/
selectDirection: number;
}
export interface ScaleInfoForm extends BaseEntity {
/**
*
*/
id?: string | number;
/**
*
*/
name?: string;
/**
*
*/
code?: string;
/**
*
*/
title?: string;
/**
*
*/
subTitle?: string;
/**
*
*/
tags?: string;
/**
*
*/
ageRange?: string;
/**
*
*/
evalNums?: number;
/**
*
*/
coverImg?: number;
/**
* /
*/
price?: number;
/**
*
*/
note?: string;
/**
*
*/
duration?: number;
/**
* 0:单项单维1:多项单维型2:多项多维型
*/
dimensionType?: number;
/**
* 0 1
*/
status?: string;
/**
*
*/
type?: number;
/**
*
*/
questionsNum?: number;
/**
* 0:高分异常1
*/
selectDirection?: number;
}
export interface ScaleInfoQuery extends PageQuery {
/**
*
*/
name?: string;
/**
*
*/
code?: string;
/**
*
*/
title?: string;
/**
*
*/
subTitle?: string;
/**
*
*/
tags?: string;
/**
*
*/
ageRange?: string;
/**
*
*/
evalNums?: number;
/**
*
*/
coverImg?: number;
/**
* /
*/
price?: number;
/**
*
*/
note?: string;
/**
*
*/
duration?: number;
/**
* 0:单项单维1:多项单维型2:多项多维型
*/
dimensionType?: number;
/**
* 0 1
*/
status?: string;
/**
*
*/
type?: number;
/**
*
*/
questionsNum?: number;
/**
* 0:高分异常1
*/
selectDirection?: number;
/**
*
*/
params?: any;
}

View File

@ -0,0 +1,413 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter"
:leave-active-class="proxy?.animate.searchAnimate.leave">
<div class="search" v-show="showSearch">
<el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
<el-form-item label="量表名称" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入量表名称" clearable style="width: 240px"
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="量表编码" prop="code">
<el-input v-model="queryParams.code" placeholder="请输入量表编码" clearable style="width: 240px"
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="测评项" prop="ageRange">
<el-input v-model="queryParams.title" placeholder="请输入标题" clearable style="width: 240px"
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="适应人群" prop="subTitle">
<el-input v-model="queryParams.subTitle" placeholder="请输入子标题" clearable style="width: 240px"
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="量表类型" prop="tags">
<el-input v-model="queryParams.tags" placeholder="请输入标签" clearable style="width: 240px"
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</div>
</transition>
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd"
v-hasPermi="['scale:ScaleInfo:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()"
v-hasPermi="['scale:ScaleInfo:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()"
v-hasPermi="['scale:ScaleInfo:remove']">删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="Download" @click="handleExport"
v-hasPermi="['scale:ScaleInfo:export']">导出</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<el-table v-loading="loading" :data="ScaleInfoList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="封面" align="center" prop="converImg" width="100">
<template #default="scope">
<image-preview :src="scope.row.coverImgUrl" :width="50" :height="50" />
</template>
</el-table-column>
<el-table-column label="量表名称" align="center" prop="name" />
<el-table-column label="量表编码" align="center" prop="code" />
<el-table-column label="标题" align="center" prop="title" />
<el-table-column label="标签" align="center" prop="tags" />
<el-table-column label="测评次数" align="center" prop="evalNums" />
<el-table-column label="分钟" align="center" prop="duration" />
<el-table-column label="状态" align="center" prop="status" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['scale:ScaleInfo:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
v-hasPermi="['scale:ScaleInfo:remove']"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 添加或修改心理测评量对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="800px" append-to-body>
<el-form ref="ScaleInfoFormRef" :model="form" :rules="rules" label-width="100px">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="量表名称" prop="name">
<el-input v-model="form.name" placeholder="请输入量表名称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="量表编码" prop="code">
<el-input v-model="form.code" placeholder="请输入量表编码" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="价格/单次" prop="price">
<el-input v-model="form.price" placeholder="请输入价格/单次" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="标签" prop="tags">
<el-input v-model="form.tags" placeholder="请输入标签" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="标题" prop="title">
<el-input v-model="form.title" placeholder="请输入标题" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="子标题" prop="subTitle">
<el-input v-model="form.subTitle" type="textarea" placeholder="请输入内容" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="测评时长" prop="duration">
<el-input v-model="form.duration" placeholder="请输入测评时长" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="题量" prop="questionsNum">
<el-input v-model="form.questionsNum" placeholder="请输入题量" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="类型" prop="ageRange">
<el-input v-model="form.ageRange" placeholder="请输入类型" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="适合年龄段" prop="ageRange">
<el-input v-model="form.ageRange" placeholder="请输入适合年龄段" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="量表维度" prop="evalNums">
<el-input v-model="form.evalNums" placeholder="请输入量表维度" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="适应人群" prop="evalNums">
<el-input v-model="form.evalNums" placeholder="请输入适应人群" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="描述" prop="note">
<el-input v-model="form.note" type="textarea" placeholder="请输入内容" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="封面" prop="converImg">
<image-upload v-model="form.coverImg" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="ScaleInfo" lang="ts">
import { listScaleInfo, getScaleInfo, delScaleInfo, addScaleInfo, updateScaleInfo } from '@/api/scale/ScaleInfo';
import { ScaleInfoVO, ScaleInfoQuery, ScaleInfoForm } from '@/api/scale/ScaleInfo/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const ScaleInfoList = ref<ScaleInfoVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const ScaleInfoFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: ScaleInfoForm = {
id: undefined,
name: undefined,
code: undefined,
title: undefined,
subTitle: undefined,
tags: undefined,
ageRange: undefined,
evalNums: undefined,
converImg: undefined,
price: undefined,
note: undefined,
duration: undefined,
dimensionType: undefined,
status: undefined,
type: undefined,
questionsNum: undefined,
selectDirection: undefined,
}
const data = reactive<PageData<ScaleInfoForm, ScaleInfoQuery>>({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
name: undefined,
code: undefined,
title: undefined,
subTitle: undefined,
tags: undefined,
ageRange: undefined,
evalNums: undefined,
converImg: undefined,
price: undefined,
note: undefined,
duration: undefined,
dimensionType: undefined,
status: undefined,
type: undefined,
questionsNum: undefined,
selectDirection: undefined,
params: {
}
},
rules: {
id: [
{ required: true, message: "主键不能为空", trigger: "blur" }
],
name: [
{ required: true, message: "量表名称不能为空", trigger: "blur" }
],
code: [
{ required: true, message: "量表编码不能为空", trigger: "blur" }
],
title: [
{ required: true, message: "标题不能为空", trigger: "blur" }
],
subTitle: [
{ required: true, message: "子标题不能为空", trigger: "blur" }
],
tags: [
{ required: true, message: "标签不能为空", trigger: "blur" }
],
ageRange: [
{ required: true, message: "适合年龄段不能为空", trigger: "blur" }
],
evalNums: [
{ required: true, message: "测评次数不能为空", trigger: "blur" }
],
converImg: [
{ required: true, message: "封面不能为空", trigger: "blur" }
],
price: [
{ required: true, message: "价格/单次不能为空", trigger: "blur" }
],
note: [
{ required: true, message: "描述不能为空", trigger: "blur" }
],
duration: [
{ required: true, message: "分钟不能为空", trigger: "blur" }
],
dimensionType: [
{ required: true, message: "维度类型0:单项单维1:多项单维型2:多项多维型不能为空", trigger: "change" }
],
status: [
{ required: true, message: "状态不能为空", trigger: "change" }
],
type: [
{ required: true, message: "量表类别:如情感,字典不能为空", trigger: "change" }
],
questionsNum: [
{ required: true, message: "题量不能为空", trigger: "blur" }
],
selectDirection: [
{ required: true, message: "0:高分异常1低分异常不能为空", trigger: "blur" }
],
}
});
const { queryParams, form, rules } = toRefs(data);
/** 查询心理测评量列表 */
const getList = async () => {
loading.value = true;
const res = await listScaleInfo(queryParams.value);
ScaleInfoList.value = res.rows;
total.value = res.total;
loading.value = false;
}
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
}
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
ScaleInfoFormRef.value?.resetFields();
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
}
/** 多选框选中数据 */
const handleSelectionChange = (selection: ScaleInfoVO[]) => {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
}
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = "添加心理测评量";
}
/** 修改按钮操作 */
const handleUpdate = async (row?: ScaleInfoVO) => {
reset();
const _id = row?.id || ids.value[0]
const res = await getScaleInfo(_id);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = "修改心理测评量";
}
/** 提交按钮 */
const submitForm = () => {
ScaleInfoFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateScaleInfo(form.value).finally(() => buttonLoading.value = false);
} else {
await addScaleInfo(form.value).finally(() => buttonLoading.value = false);
}
proxy?.$modal.msgSuccess("修改成功");
dialog.visible = false;
await getList();
}
});
}
/** 删除按钮操作 */
const handleDelete = async (row?: ScaleInfoVO) => {
const _ids = row?.id || ids.value;
await proxy?.$modal.confirm('是否确认删除心理测评量编号为"' + _ids + '"的数据项?').finally(() => loading.value = false);
await delScaleInfo(_ids);
proxy?.$modal.msgSuccess("删除成功");
await getList();
}
/** 导出按钮操作 */
const handleExport = () => {
proxy?.download('scale/ScaleInfo/export', {
...queryParams.value
}, `ScaleInfo_${new Date().getTime()}.xlsx`)
}
onMounted(() => {
getList();
});
</script>