Files
2022-03-23 17:30:25 +08:00

381 lines
11 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<el-form
v-if="is_super"
:model="queryParams"
ref="queryForm"
:inline="true"
label-width="85px"
@submit.prevent
>
<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"
@tab-click="handleClick"
>
<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="area" />
<el-table-column
v-if="queryParams.activeName == 2"
label="申领经纪人"
align="center"
prop="area"
/>
<el-table-column label="所属经纪人" align="center" prop="address" />
<el-table-column label="经纪人电话" align="center" prop="address" />
<el-table-column
v-if="queryParams.activeName == 2"
label="浏览量"
align="center"
prop="area"
/>
<el-table-column label="站点" align="center" prop="address" />
<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="handleExamine(scope.row.id)"
v-if="queryParams.activeName == 1"
>
审核
</el-button>
<el-button
size="mini"
type="text"
@click="handleExamine(scope.row.id)"
v-if="queryParams.activeName == 3"
>
查看
</el-button>
<!-- <el-button
size="mini"
type="text"
@click="handleClaim(scope.row.id)"
v-if="queryParams.activeName == 2"
>
下架
</el-button> -->
<el-button
size="mini"
type="text"
@click="handleDelete(scope.row.id)"
v-if="queryParams.activeName == 3"
>
删除
</el-button>
<div v-if="queryParams.activeName == 2">
<div>
<el-button
size="mini"
type="text"
@click="handleAdd(scope.row.id)"
>
指派经纪人
</el-button>
</div>
<div>
<el-button size="mini" type="text" @click="openStatus = true">
查看状态
</el-button>
</div>
</div>
</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="指派经纪人"
:visible.sync="open"
width="520px"
append-to-body
>
<el-form ref="form" :model="form" :rules="rules" label-width="115px">
<el-form-item label="经纪人姓名">
<el-select
v-model="form.phone"
filterable
remote
placeholder="请选择,支持搜索"
:remote-method="remoteMethod"
:loading="dialogLoading"
>
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="经纪人手机号:" prop="phone">
<el-input v-model="form.phone" disabled placeholder="自动获取" />
</el-form-item>
<div
style="
font-size: 12px;
text-align: center;
color: #f56c6c;
margin-top: -3px;
"
>
提示改手机号为经纪人入驻时填写的手机号为确保指派准确请提前电话沟通
</div>
</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>
<!-- 需求状态对话框 -->
<el-dialog
title="需求状态"
:visible.sync="openStatus"
width="77%"
append-to-body
>
<div style="width: 80%; margin: 0 auto">
<el-steps
finish-status="finish"
simple
:active="formStatus.findIndex((e) => e.status == true)"
>
<el-step title="合作备忘录"></el-step>
<el-step title="客户确认技术解决方案"></el-step>
<el-step title="签署服务合同(合同额)"></el-step>
<el-step title="结题"></el-step>
<el-step title="未结题"></el-step>
</el-steps>
<el-form ref="formStatus">
<section v-for="item in formStatus" :key="item.id">
<h2 style="font-size: 16px; font-weight: 700; color: #0054ff">
{{ item.id + "." + item.title }}
</h2>
<el-form-item label="上传文件:">
<FileUpload
v-model="item.file"
:isShowTip="false"
:fileType="['doc', 'xls', 'ppt', 'txt', 'pdf', 'jpg', 'png']"
/>
</el-form-item>
<h2 style="font-size: 14px; text-align: right" v-if="item.status">
上传日期{{ new Date().toLocaleDateString() }}
</h2>
<el-divider></el-divider>
</section>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: right">
<el-button type="primary" @click="openStatus = false"
> </el-button
>
<el-button @click="openStatus = false"> </el-button>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
is_super: this.$store.getters.is_super,
// 遮罩层
loading: true,
// 总条数
total: 0,
// 实验室表格数据
dataList: null,
// 查询参数
queryParams: {
page_num: 1,
page_size: 10,
activeName: "1",
},
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
dialogLoading: false,
// 表单参数
form: {},
options: [],
rules: {
phone: [
{
required: true,
message: "经纪人手机号不能为空",
trigger: "blur",
},
],
},
openStatus: false,
// 表单 todo...
formStatus: [
// http://192.168.0.149:8000/upload/20220322/b6cd9a9cdd2ec9cbf2654cce62a8638a.jpg
{
id: 1,
title: "合作备忘录",
file: "",
status: false,
},
// {
// id: 2,
// title: "客户确认技术解决方案",
// file: "",
// status: false,
// },
// {
// id: 3,
// title: "签署服务合同(合同额)",
// file: "",
// status: false,
// },
// {
// id: 4,
// title: "结题",
// file: "",
// status: false,
// },
// {
// id: 5,
// title: "未结题",
// file: "",
// status: false,
// },
],
};
},
methods: {
/** 查询机构列表 */
getList() {
this.loading = true;
this.dataList = [1];
this.total = 15;
this.loading = false;
// expertList(this.queryParams).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: "/dataAudit/demandExamine",
query: { id },
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
/** 新增按钮操作 */
handleAdd(row) {
this.reset();
this.open = true;
this.title = "";
},
// 表单重置
reset() {
this.form = {
name: undefined,
phone: undefined,
};
this.resetForm("form");
},
remoteMethod(query) {
if (query !== "") {
this.dialogLoading = true;
setTimeout(() => {
this.dialogLoading = false;
this.options = [
{ label: "label-1", value: "001" },
{ label: "label-2", value: "002" },
];
}, 200);
} else {
this.options = [];
}
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
// aboutAdd(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>