321 lines
12 KiB
Vue
321 lines
12 KiB
Vue
<template>
|
||
<div class="table-box">
|
||
<ProTable
|
||
ref="proTable"
|
||
title="用户列表"
|
||
:columns="columns"
|
||
:requestApi="getTableList"
|
||
:initParam="initParam"
|
||
:dataCallback="dataCallback"
|
||
:tool-button="false"
|
||
:pagination="true"
|
||
background
|
||
:isShowSearch="false"
|
||
>
|
||
<!-- <template #formButton="scope">
|
||
<el-button type="primary" @click="handleAddItem()">新增</el-button>
|
||
</template> -->
|
||
<template #state="{ row }">
|
||
{{ row.state === 1 ? "已审核" : "待审核" }}
|
||
</template>
|
||
<!-- 表格操作 -->
|
||
<template #operation="scope">
|
||
<div style="text-align: left">
|
||
<el-button type="primary" link @click="handleEditItem(scope.row)">
|
||
<img src="@/assets/images/tableIcon/look.png" alt="" class="configureIcon" />
|
||
<span>查看</span>
|
||
</el-button>
|
||
<el-button v-if="scope.row.state === 0" type="primary" link @click="deleteAccount(scope.row)"
|
||
><img src="@/assets/images/tableIcon/seal.png" alt="" class="configureIcon" /><span>审批</span></el-button
|
||
>
|
||
</div>
|
||
</template>
|
||
</ProTable>
|
||
<el-dialog id="lookDialog" v-model="visible" title="查看企业信息" width="66%" show-close>
|
||
<div>
|
||
<div class="littleTitle">企业基本信息</div>
|
||
<el-form ref="ruleFormRef" :model="ruleForm" label-width="150px" class="basic-form">
|
||
<div class="items">
|
||
<div class="left">
|
||
<el-form-item label="企业名称:" prop="enterpriseName">
|
||
<el-input disabled v-model="ruleForm.enterpriseName" placeholder="厦门市湖里科技有限公司" />
|
||
</el-form-item>
|
||
<el-form-item label="法人代表:" prop="legalperson">
|
||
<el-input disabled v-model="ruleForm.legalPerson" placeholder="周某" />
|
||
</el-form-item>
|
||
<el-form-item label="注册资本(万元):" prop="registeredCapital">
|
||
<el-input disabled v-model.number="ruleForm.registeredCapital" placeholder="1000" />
|
||
</el-form-item>
|
||
<el-form-item label="所属住建局:" prop="governmentSn">
|
||
<el-select disabled style="width: 100%" v-model="ruleForm.governmentName" placeholder="选择住建局">
|
||
<el-option
|
||
v-for="item in governNameList"
|
||
:key="item.governmentSn"
|
||
:label="item.governmentName"
|
||
:value="item.governmentSn"
|
||
/>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="企业地址:" prop="registerPlace">
|
||
<el-input disabled v-model="ruleForm.registerPlace" placeholder="福建省厦门市">
|
||
<template #append>
|
||
<el-icon color="#fff" size="22"><Location /></el-icon>
|
||
</template>
|
||
</el-input>
|
||
</el-form-item>
|
||
</div>
|
||
|
||
<div class="right">
|
||
<el-form-item label="统一社会信用代码:" prop="creditCode">
|
||
<el-input disabled v-model="ruleForm.creditCode" placeholder="123456789123456789" />
|
||
</el-form-item>
|
||
<el-form-item label="法人代表手机号:" prop="legalPersonTel">
|
||
<el-input disabled v-model.number="ruleForm.legalPersonTel" placeholder="13670780605" />
|
||
</el-form-item>
|
||
<el-form-item label="营业执照:" prop="businessLicense">
|
||
<el-button
|
||
class="ellipsisText"
|
||
v-if="ruleForm.businessLicenseOriginalName"
|
||
type="primary"
|
||
plain
|
||
link
|
||
@click="onPreview"
|
||
>
|
||
{{ ruleForm.businessLicenseOriginalName }}
|
||
</el-button>
|
||
</el-form-item>
|
||
<!-- 占位 -->
|
||
<el-form-item class="placeholder">
|
||
<el-input></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="经纬度:" prop="position">
|
||
<el-input disabled v-model="ruleForm.position" placeholder="经度：118.138 纬度：24.517808" />
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="items">
|
||
<el-form-item class="full-item" label="详细地址:" prop="businessAddress">
|
||
<el-input disabled v-model="ruleForm.businessAddress" placeholder="福建省厦门市湖里区" />
|
||
</el-form-item>
|
||
</div>
|
||
|
||
<div class="items">
|
||
<div class="left">
|
||
<el-form-item label="是否市属国企:" prop="isAuthority">
|
||
<el-radio-group disabled v-model="ruleForm.isAuthority">
|
||
<el-radio :label="1" size="large">是</el-radio>
|
||
<el-radio :label="0" size="large">否</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item label="企业负责人:" prop="realName">
|
||
<el-input disabled v-model="ruleForm.realName" placeholder="黄某" />
|
||
</el-form-item>
|
||
<el-form-item label="手机绑定账号:" prop="account">
|
||
<el-input disabled v-model="ruleForm.account" placeholder="admin" />
|
||
</el-form-item>
|
||
<el-form-item label="邮箱:" prop="email">
|
||
<el-input disabled v-model="ruleForm.email" placeholder="123456789@qq.com" />
|
||
</el-form-item>
|
||
</div>
|
||
|
||
<div class="right">
|
||
<el-form-item label="所属国企:" prop="authorityEnterprise">
|
||
<el-input disabled style="width: 100%" v-model="ruleForm.authorityEnterprise" placeholder="国企所属集团">
|
||
</el-input>
|
||
</el-form-item>
|
||
<el-form-item label="手机号码:" prop="phone">
|
||
<el-input disabled v-model.number="ruleForm.phone" placeholder="13670780605" />
|
||
</el-form-item>
|
||
<el-form-item label="密码:" prop="password">
|
||
<el-input disabled v-model="ruleForm.password" placeholder="123456" />
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="items">
|
||
<el-form-item class="full-item" label="公司简介:">
|
||
<el-input disabled type="textarea" :rows="6" v-model="ruleForm.profile" placeholder="1234567890" />
|
||
</el-form-item>
|
||
</div>
|
||
<!-- <AMap v-model="isOpen" @get-address="getAddress" /> -->
|
||
</el-form>
|
||
</div>
|
||
<div class="littleTitle">选择企业主体</div>
|
||
<div class="bottom-table">
|
||
<unit-table
|
||
class="unit-table"
|
||
v-for="(item, i) in modelUnitList"
|
||
:divide="{ index: i + 1, title: item.dictValue }"
|
||
v-model="modelUnitList[i]"
|
||
/>
|
||
</div>
|
||
<template #footer>
|
||
<span class="dialog-footer">
|
||
<el-button type="primary" @click="visible = false">关闭</el-button>
|
||
</span>
|
||
</template>
|
||
</el-dialog>
|
||
<el-dialog title="审批" width="26%" v-model="aproveVisible" show-close>
|
||
<div style="display: flex; align-items: center">
|
||
<el-icon style="color: #e6a23c; margin: 0 12px; font-size: 20px"><WarningFilled /></el-icon>
|
||
<span>是否通过审批?</span>
|
||
</div>
|
||
|
||
<template #footer>
|
||
<span class="dialog-footer">
|
||
<el-button style="background: rgba(0, 0, 0, 0.1); opacity: 1; color: #333; margin-right: 25%" @click="reject"
|
||
>驳回</el-button
|
||
>
|
||
<el-button type="primary" @click="onSubmit">通过</el-button>
|
||
</span>
|
||
</template>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="tsx" name="governMentCompanyApprove">
|
||
import { ref, reactive } from "vue";
|
||
import { ElMessage, ElMessageBox } from "element-plus";
|
||
import { useRouter } from "vue-router";
|
||
import { User } from "@/api/interface";
|
||
import { ColumnProps } from "@/components/ProTable/interface";
|
||
import { ruleForm } from "./index";
|
||
import ProTable from "@/components/ProTable/index.vue";
|
||
import UnitTable from "./components/unit-table.vue";
|
||
import { getDicList } from "@/api/modules/jxjview";
|
||
import { getCompanyApproveList, getIdCompanyList, getIdCompanyDetail, editCompanyApprove } from "@/api/modules/goverment";
|
||
import { Base64 } from "js-base64";
|
||
|
||
const router = useRouter();
|
||
|
||
const visible = ref(false);
|
||
const aproveVisible = ref(false);
|
||
const title = ref("");
|
||
// 获取 ProTable 元素，调用其获取刷新数据方法（还能获取到当前查询参数，方便导出携带参数）
|
||
const proTable = ref();
|
||
const governNameList = ref([]);
|
||
// const title = import.meta.env.VITE_API_URL;
|
||
const isOpen = ref(false);
|
||
const filelist = ref([]);
|
||
const modelUnitList = ref([]);
|
||
const DicMainList = ref([]);
|
||
const fileUrl = ref("");
|
||
const fileName = ref("");
|
||
const baseUrl = import.meta.env.VITE_API_URL;
|
||
const uplUrl = import.meta.env.VITE_ULD_API_URL;
|
||
|
||
const getDicMainList = async () => {
|
||
const { result } = await getDicList({ dictType: "enterprise_main" });
|
||
DicMainList.value.length = 0;
|
||
DicMainList.value.push(...result);
|
||
};
|
||
getDicMainList();
|
||
|
||
// 修改数据按钮
|
||
const handleEditItem = async (row: any) => {
|
||
visible.value = true;
|
||
const res = await getIdCompanyDetail({ enterpriseId: row.enterpriseId });
|
||
ruleForm.value = res.result;
|
||
modelUnitList.value = res.result.enterpriseMains;
|
||
fileUrl.value = res.result.businessLicense;
|
||
fileName.value = res.result.businessLicenseOriginalName;
|
||
};
|
||
|
||
// 表格配置项
|
||
const columns: ColumnProps[] = [
|
||
{ type: "index", label: "序号", width: 80 },
|
||
{ prop: "enterpriseName", label: "企业名称", search: { el: "input" } },
|
||
{
|
||
prop: "creditCode",
|
||
label: "社会信用代码",
|
||
search: { el: "input" }
|
||
},
|
||
|
||
// 多级 prop
|
||
|
||
{
|
||
prop: "mainType",
|
||
label: "企业类型",
|
||
// search: { el: "input" }
|
||
isShow: false,
|
||
enum: DicMainList.value,
|
||
search: { el: "select", props: { filterable: true } },
|
||
fieldNames: { label: "dictValue", value: "dictLabel" }
|
||
},
|
||
{
|
||
prop: "mainTypeName",
|
||
label: "企业类型"
|
||
},
|
||
{ prop: "legalPerson", label: "法人代表" },
|
||
{ prop: "legalPersonTel", label: "法人代表手机" },
|
||
{ prop: "createTime", label: "登记时间" },
|
||
{ prop: "state", label: "审核状态" },
|
||
{ prop: "operation", label: "操作", fixed: "right", width: 150 }
|
||
];
|
||
|
||
// 如果表格需要初始化请求参数，直接定义传给 ProTable(之后每次请求都会自动带上该参数，此参数更改之后也会一直带上，改变此参数会自动刷新表格数据)
|
||
const initParam = reactive({
|
||
// state: 0
|
||
});
|
||
|
||
// dataCallback 是对于返回的表格数据做处理，如果你后台返回的数据不是 list && total && pageNum && pageSize 这些字段，那么你可以在这里进行处理成这些字段
|
||
// 或者直接去 hooks/useTable.ts 文件中把字段改为你后端对应的就行
|
||
const dataCallback = (data: any) => {
|
||
// console.log(data);
|
||
return {
|
||
list: data.records,
|
||
total: Number(data.total),
|
||
pageNo: Number(data.current),
|
||
pageSize: Number(data.size)
|
||
};
|
||
};
|
||
|
||
// 如果你想在请求之前对当前请求参数做一些操作，可以自定义如下函数：params 为当前所有的请求参数（包括分页），最后返回请求列表接口
|
||
// 默认不做操作就直接在 ProTable 组件上绑定 :requestApi="getUserList"
|
||
const getTableList = (params: any) => {
|
||
let newParams = JSON.parse(JSON.stringify(params));
|
||
return getCompanyApproveList(newParams);
|
||
};
|
||
|
||
const onPreview = () => {
|
||
const url = Base64.encode(baseUrl + "/xmgl/file/preview?fileUrl=" + fileUrl.value + "&fullfilename=" + fileName.value);
|
||
// 标记打包
|
||
// const url1 = "http://182.90.224.147:8012/onlinePreview?url=";
|
||
// const url1 = "http://192.168.34.155:8012/onlinePreview?url=";
|
||
window.open(uplUrl + url);
|
||
};
|
||
|
||
const reject = async () => {
|
||
await editCompanyApprove({ enterpriseId: enterPriseId.value, suggest: 0 });
|
||
ElMessage.success("已驳回");
|
||
aproveVisible.value = false;
|
||
proTable.value.getTableList();
|
||
};
|
||
const onSubmit = async () => {
|
||
await editCompanyApprove({ enterpriseId: enterPriseId.value, suggest: 1 });
|
||
ElMessage.success("通过成功");
|
||
aproveVisible.value = false;
|
||
proTable.value.getTableList();
|
||
};
|
||
|
||
// 删除用户信息
|
||
const enterPriseId = ref("");
|
||
const deleteAccount = async (row: any) => {
|
||
enterPriseId.value = row.enterpriseId;
|
||
aproveVisible.value = true;
|
||
};
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
@import "./index.scss";
|
||
:deep(td .el-table-fixed-column--right) {
|
||
.cell {
|
||
text-align: left;
|
||
}
|
||
}
|
||
:deep(#lookDialog .el-dialog__body) {
|
||
height: 700px;
|
||
overflow: auto;
|
||
}
|
||
</style>
|