Files
2022-03-03 11:55:25 +08:00

343 lines
9.2 KiB
Vue

<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryRef"
v-show="showSearch"
:inline="true"
@submit.prevent
>
<el-form-item label="科研项目名称" prop="researchName">
<el-input
v-model="queryParams.researchName"
placeholder="请输入科研项目名称"
clearable
size="small"
style="width: 240px"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" size="mini" @click="handleQuery"
>搜索</el-button
>
<el-button icon="Refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="Plus"
size="mini"
@click="handleAdd"
>新增</el-button
>
</el-col>
<right-toolbar
v-model:showSearch="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<!-- 表格数据 -->
<el-table v-loading="loading" :data="dataList">
<el-table-column label="数据编号" prop="researchId" />
<el-table-column
label="科研项目名称"
prop="researchName"
:show-overflow-tooltip="true"
/>
<el-table-column
label="类型"
prop="roleKey"
:show-overflow-tooltip="true"
/>
<el-table-column label="课题角色" prop="roleSort" />
<el-table-column label="课题负责人" prop="roleSort" />
<el-table-column label="发布日期" align="center" prop="createTime">
<template #default="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template #default="scope">
<el-button
size="mini"
type="text"
icon="Edit"
@click="handleEdit(scope.row)"
>下架</el-button
>
<!-- <el-button
size="mini"
type="text"
icon="Edit"
@click="handleUpdate(scope.row)"
>修改</el-button
> -->
<el-button
size="mini"
type="text"
icon="Delete"
@click="handleDelete(scope.row)"
>删除</el-button
>
</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-dialog :title="title" v-model="open" width="720px" append-to-body>
<el-form ref="roleRef" :model="form" :rules="rules" label-width="120px">
<el-form-item label="科研项目名称:" prop="researchName">
<el-input
v-model="form.researchName"
placeholder="请输入科研项目名称"
/>
</el-form-item>
<el-form-item label="课题角色:" prop="company">
<el-radio v-model="form.company" label="1">承担单位</el-radio>
<el-radio v-model="form.company" label="2">参与单位</el-radio>
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item label="资助经费:" prop="funding">
<el-input v-model="form.funding" placeholder="请输入资助经费" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="资助来源:" prop="sources">
<el-input v-model="form.sources" placeholder="请输入资助来源" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="开始日期:" prop="beginTime">
<el-date-picker
v-model="form.beginTime"
type="date"
value-format="YYYY-MM-DD"
placeholder="请选择开始日期"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="结束日期:" prop="endTime">
<el-date-picker
v-model="form.endTime"
type="date"
value-format="YYYY-MM-DD"
placeholder="请选择结束日期"
></el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="项目类型:" prop="projectType">
<el-input
v-model="form.projectType"
placeholder="请输入项目类型"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="课题负责人:" prop="projectLeader">
<el-input
v-model="form.projectLeader"
placeholder="请输入课题负责人"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import {
addRole,
changeRoleStatus,
dataScope,
delRole,
getRole,
listRole,
updateRole,
} from "@/api/system/role";
import {
roleMenuTreeselect,
treeselect as menuTreeselect,
} from "@/api/system/menu";
import {
treeselect as deptTreeselect,
roleDeptTreeselect,
} from "@/api/system/dept";
const router = useRouter();
const { proxy } = getCurrentInstance();
const dataList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const total = ref(0);
const title = ref("");
const data = reactive({
form: {},
queryParams: {
pageNum: 1,
pageSize: 10,
researchName: undefined,
},
rules: {
researchName: [
{ required: true, message: "科研项目名称不能为空", trigger: "blur" },
],
funding: [{ required: true, message: "资助经费不能为空", trigger: "blur" }],
sources: [{ required: true, message: "资助来源不能为空", trigger: "blur" }],
beginTime: [
{
required: true,
message: "请选择开始日期",
trigger: ["blur", "change"],
},
],
endTime: [
{
required: true,
message: "请选择结束日期",
trigger: ["blur", "change"],
},
],
projectType: [
{ required: true, message: "项目类型不能为空", trigger: "blur" },
],
projectLeader: [
{ required: true, message: "课题负责人不能为空", trigger: "blur" },
],
},
});
const { queryParams, form, rules } = toRefs(data);
/** 查询数据列表 */
function getList() {
loading.value = true;
dataList.value = [1];
total.value = 15;
loading.value = false;
// listRole(queryParams.value).then(
// (response) => {
// dataList.value = response.rows;
// total.value = response.total;
// loading.value = false;
// }
// );
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef");
handleQuery();
}
/** 删除按钮操作 */
function handleDelete(row) {
proxy.$modal
.confirm('是否确认删除数据编号为"' + row.id + '"的数据项?')
.then(function () {
return delRole(researchIds);
})
.then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
})
.catch(() => {});
}
/** 重置新增的表单以及其他数据 */
function reset() {
form.value = {
researchId: undefined,
researchName: undefined,
company: "1",
funding: undefined,
sources: undefined,
beginTime: undefined,
endTime: undefined,
projectType: undefined,
projectLeader: undefined,
};
proxy.resetForm("roleRef");
}
/** 添加数据 */
function handleAdd() {
reset();
open.value = true;
title.value = "添加数据";
}
/** 修改数据 */
function handleUpdate(row) {
reset();
form.value = Object.assign({}, row);
open.value = true;
title.value = "修改数据";
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["roleRef"].validate((valid) => {
if (valid) {
console.log(form.value);
// if (form.value.researchId != undefined) {
// updateRole(form.value).then((response) => {
// proxy.$modal.msgSuccess("修改成功");
// open.value = false;
// getList();
// });
// } else {
// addRole(form.value).then((response) => {
// proxy.$modal.msgSuccess("新增成功");
// open.value = false;
// getList();
// });
// }
}
});
}
/** 取消按钮 */
function cancel() {
open.value = false;
reset();
}
getList();
</script>