Files
2022-03-25 13:48:20 +08:00

259 lines
7.4 KiB
Vue

<template>
<div class="app-container">
<el-form
v-if="is_super"
:model="queryParams"
ref="queryForm"
:inline="true"
label-width="85px"
>
<el-form-item label="需求名称" prop="title">
<el-input
v-model="queryParams.title"
placeholder="请输入需求名称"
clearable
size="small"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="需求类别" prop="type">
<el-select
v-model="queryParams.type"
placeholder="用户状态"
clearable
size="small"
style="width: 240px"
@clear="delete queryParams.type"
>
<el-option label="企业服务需求" :value="1" />
<el-option label="专家服务需求" :value="2" />
</el-select>
</el-form-item>
<el-form-item label="时间查询" prop="time">
<el-date-picker
v-model="dateRange"
size="small"
style="width: 240px"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item label="所属站点" prop="tenant_id">
<SiteOptions v-model="queryParams" />
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-tabs type="card" size="mini" v-model="queryParams.activeName">
<el-tab-pane label="待受理" name="1"></el-tab-pane>
<el-tab-pane label="已受理" name="3"></el-tab-pane>
<el-tab-pane label="已结束" name="2"></el-tab-pane>
</el-tabs>
<el-table v-loading="loading" :data="dataList" ref="tableRef">
<el-table-column label="数据编号" align="center" prop="id" />
<el-table-column label="需求名称" align="center" prop="name" />
<el-table-column label="需求类别" align="center" prop="research_name" />
<el-table-column label="类型" align="center" prop="laboratory_name" />
<el-table-column label="状态" align="center" prop="laboratory_name" />
<el-table-column label="站点" align="center" prop="address" />
<el-table-column label="申请时间" align="center" prop="address" />
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
@click="handleAdd"
v-if="queryParams.activeName == 1"
>
受理
</el-button>
<el-button
size="mini"
type="text"
@click=""
v-if="queryParams.activeName == 1"
>
取消
</el-button>
<el-button
size="mini"
type="text"
@click="handleExamine(scope.row.id)"
>
查看
</el-button>
<el-button
size="mini"
type="text"
@click="handleDelete(scope.row.id)"
v-if="queryParams.activeName != 1"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.page_num"
:limit.sync="queryParams.page_size"
@pagination="getList"
/>
<!-- 对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px">
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="受理单位:" prop="name">
<el-input v-model="form.name" placeholder="请输入受理单位" />
</el-form-item>
<el-form-item label="联系人:" prop="key">
<el-input v-model="form.key" placeholder="请输入联系人" />
</el-form-item>
<el-form-item label="联系电话:" prop="value">
<el-input v-model="form.value" placeholder="请输入联系电话" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
is_super: this.$store.getters.is_super,
// 日期范围
dateRange: [],
// 遮罩层
loading: true,
// 总条数
total: 0,
// 实验室表格数据
dataList: null,
// 查询参数
queryParams: {
page_num: 1,
page_size: 10,
activeName: "1",
},
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 表单参数
form: {},
// 表单校验
rules: {
name: [
{ required: true, message: "受理单位不能为空", trigger: "blur" },
],
key: [{ required: true, message: "联系人不能为空", trigger: "blur" }],
value: [
{ required: true, message: "联系电话不能为空", trigger: "blur" },
],
},
};
},
methods: {
/** 查询机构列表 */
getList() {
this.loading = true;
this.dataList = [1];
this.total = 15;
this.loading = false;
// 时间参数合并
// expertList(this.addDateRange(this.queryParams, this.dateRange)).then((response) => {
// this.dataList = response.data.data;
// this.total = response.data.count;
// this.loading = false;
// });
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.page_num = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// handleClick() {
// this.$nextTick(() => {
// this.$refs["tableRef"].doLayout();
// });
// },
handleExamine(id) {
this.$router.push({
path: "/innovateDemand/demandDetail",
query: { id },
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
name: undefined,
key: undefined,
value: undefined,
};
this.resetForm("form");
},
handleAdd() {
this.reset();
this.open = true;
this.title = "受理";
},
/** 提交按钮 - 修改名称普通数据 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
// configAdd(this.form).then((response) => {
// this.$modal.msgSuccess("新增成功");
// this.open = false;
// this.getList();
// });
}
});
},
/** 删除按钮操作 */
handleDelete(id) {
this.$modal
.confirm('是否确认删除产品编号为"' + id + '"的数据项?')
.then(function () {
return tenantDelete({ id });
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
},
},
created() {
this.getList();
},
};
</script>