|
@@ -1,172 +1,258 @@
|
|
|
- <template>
|
|
|
- <div style="width: 100%">
|
|
|
- <el-breadcrumb separator-class="el-icon-arrow-right">
|
|
|
- <el-breadcrumb-item>首页</el-breadcrumb-item>
|
|
|
- <el-breadcrumb-item>主体信息管理</el-breadcrumb-item>
|
|
|
- <el-breadcrumb-item>检测机构</el-breadcrumb-item>
|
|
|
- </el-breadcrumb>
|
|
|
- <el-form ref="form" :model="form" label-width="80px">
|
|
|
-
|
|
|
- <div class="card">
|
|
|
- <!-- 检索信息 -->
|
|
|
- <el-form-item label="所属行业">
|
|
|
- <el-checkbox-group v-model="form.properties" class="querybox">
|
|
|
- <el-checkbox label="不限" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="种植业" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="畜牧业" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="渔业" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="其他" name="type"></el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
- </el-form-item>
|
|
|
+<template>
|
|
|
+ <div style="width: 100%">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <el-breadcrumb separator-class="el-icon-arrow-right">
|
|
|
+ <el-breadcrumb-item >首页</el-breadcrumb-item>
|
|
|
+ <el-breadcrumb-item>主体信息管理</el-breadcrumb-item>
|
|
|
+ <el-breadcrumb-item>检测机构</el-breadcrumb-item>
|
|
|
+ </el-breadcrumb>
|
|
|
+ </div>
|
|
|
|
|
|
- <el-form-item label="机构级别">
|
|
|
- <el-checkbox-group v-model="form.certificate" class="querybox">
|
|
|
- <el-checkbox label="不限" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="部级" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="省级" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="市级" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="县级" name="type"></el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
- </el-form-item>
|
|
|
+ <!-- 头部查询栏 -->
|
|
|
+ <div class="headSearch" >
|
|
|
+ <el-row :gutter="120" style="margin-right: 0px;">
|
|
|
+ <el-form :inline="true">
|
|
|
+ <el-form-item label="组别" size="small">
|
|
|
+ <el-select v-model="queryInfo.groupname" style="width: 150px;" clearable>
|
|
|
+ <el-option v-for="item in groupList" :key="item.value" :label="item.label" :value="item.value" ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
|
|
|
- <el-form-item label="主体状态">
|
|
|
- <el-checkbox-group v-model="form.type" class="querybox">
|
|
|
- <el-checkbox label="不限" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="正常" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="已注销" name="type"></el-checkbox>
|
|
|
- <el-checkbox label="已撤销" name="type"></el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
- </el-form-item>
|
|
|
- <!-- 地区和机构名称 -->
|
|
|
- <el-row :gutter="50" style="margin-right: 0px;">
|
|
|
- <el-form style="display: flex; flex-direction: row;" size="mini">
|
|
|
+ <!-- <el-form-item label="机构性质" size="small">
|
|
|
+ <el-select v-model="queryInfo.jgxz" style="width: 150px;" clearable>
|
|
|
+ <el-option v-for="item in jxgzList" :key="item.value" :label="item.label" :value="item.value" ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item> -->
|
|
|
|
|
|
- <el-form-item prop="address" label="地区" class="select" >
|
|
|
- <el-cascader :options="region" v-model="sample_address"
|
|
|
- @change="handleChange" size="small">
|
|
|
- </el-cascader>
|
|
|
+ <el-form-item label="机构名称" size="small">
|
|
|
+ <el-input v-model="queryInfo.name"></el-input>
|
|
|
</el-form-item>
|
|
|
+ <!-- 查询 -->
|
|
|
+ <el-button size="mini" style="height: 40px;margin-left: 10px;" type="success" @click="searchData()">查询</el-button>
|
|
|
+ <!-- 重置 -->
|
|
|
+ <el-button size="mini" style="height: 40px;margin-left: 5px;" type="success" @click="reset()">重置</el-button>
|
|
|
+ </el-form>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
|
|
|
- <el-form-item prop="name" label="机构名称" class="select" >
|
|
|
- <el-input v-model="form.name" size="small"></el-input>
|
|
|
- </el-form-item>
|
|
|
+ <!-- 表格区域 -->
|
|
|
+ <el-table ref="multipleTable" :data="tableData" border stripe highlight-current-row style="width: 100%" :row-style="rowStyle" :cell-style="cellStyle" >
|
|
|
+ <el-table-column label="序号" width="50px">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.$index+1 }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column :key="table.label" v-for="table in tableHeader" :label="table.label" :prop="table.prop" align="center" :width="table.width" :fixed="table.fixed" />
|
|
|
+ <el-table-column prop="properties" label="机构性质" width="155" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div v-if="scope.row.properties==1">政府部门</div>
|
|
|
+ <div v-if="scope.row.properties==2">事业单位</div>
|
|
|
+ <div v-if="scope.row.properties==3">企业</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" fixed="right">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button style="margin:5px 0" type="success" size="small" @click="readDialogVisible1(scope.row)">查看详情</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!--分页器区域-->
|
|
|
+ <el-pagination class="fenYeQi" @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
|
+ :current-page="queryInfo.pageNum" :page-sizes="[10, 15, 20]" :page-size="queryInfo.pageSize"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper" :total="total" background />
|
|
|
|
|
|
- <el-form-item prop="name" label="机构负责人" class="select" >
|
|
|
- <el-input v-model="form.person" size="small"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-button type="success" size="mini" style="height: 40px;margin-left: 10px;" @click="searchData()" >查询</el-button>
|
|
|
- <el-button type="success" size="mini" style="height: 40px;margin-left: 10px;" @click="searchData()" >重置</el-button>
|
|
|
- </el-form>
|
|
|
-
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
-
|
|
|
- <!-- 表格数据区域-->
|
|
|
- <el-table ref="multipleTable" :data="testList" row-key="id" @selection-change="handleSelectionChange1"
|
|
|
- border stripe highlight-current-row style="width: 100%;margin-top:30px">
|
|
|
- <el-table-column type="selection" :reserve-selection="true" width="50"></el-table-column>
|
|
|
- <el-table-column label="序号" width="50px">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ scope.$index+1 }}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column :key="table.prop" v-for="table in tableHeader" :label="table.label"
|
|
|
- :prop="table.prop" align="center" :width="table.width" :fixed="table.fixed" />
|
|
|
- <!-- 分页器区域-->
|
|
|
- <!-- <div class="footer">
|
|
|
- <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
|
- :current-page="queryInfo1.pageNum" :page-sizes="[1,10, 15, 20]" :page-size="queryInfo1.pageSize"
|
|
|
- layout="total, sizes, prev, pager, next, jumper" :total="total" background />
|
|
|
- <el-button type="success" @click="choseTest1()">提交</el-button>
|
|
|
- </div> -->
|
|
|
+ <!-- 任务详情对话框-->
|
|
|
+ <el-dialog title="查看详情" :visible.sync="readDialogVisible" width="30%" :close-on-click-modal="false" class="dialogItem">
|
|
|
+ <el-form v-if="readDialogVisible" :model="readForm" label-width="150px">
|
|
|
|
|
|
- <!-- 操作按钮区域的作用域插槽 -->
|
|
|
- <el-table-column label="操作" align="center" fixed="right">
|
|
|
- <template>
|
|
|
- <el-col style="margin-bottom: 5px;">
|
|
|
- <el-button type="text" size="mini" @click="readDetails()" style="margin-top:5px">详情</el-button>
|
|
|
- <el-button type="text" size="mini" plain @click="reVoke()" style="margin-top:5px">撤销</el-button>
|
|
|
- </el-col>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
-
|
|
|
+ <el-form-item label="机构名称:" prop="name" class="labelItem">
|
|
|
+ <div>{{readForm.name}}</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="机构性质:" prop="jgxz" class="labelItem">
|
|
|
+ <div v-if="readForm.jgxz=='1'">政府部分</div>
|
|
|
+ <div v-else-if="readForm.level=='2'">事业单位</div>
|
|
|
+ <div v-else>企业</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="组别:" prop="jgxz" class="labelItem">
|
|
|
+ <div v-if="readForm.groupname=='1'">省级监管单位</div>
|
|
|
+ <div v-else-if="readForm.groupname=='2'">市级监管单位</div>
|
|
|
+ <div v-else>县级监管单位</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="企业代码:" prop="qydm" class="labelItem">
|
|
|
+ <div>{{readForm.qydm}}</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系人:" prop="contact_name" class="labelItem">
|
|
|
+ <div>{{readForm.contact_name}}</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系电话:" prop="contact_phone" class="labelItem">
|
|
|
+ <div>{{readForm.contact_phone}}</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系人邮箱:" prop="contact_mail" class="labelItem">
|
|
|
+ <div>{{readForm.contact_mail}}</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系人QQ:" prop="contact_qq" class="labelItem">
|
|
|
+ <div>{{readForm.contact_qq}}</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系人邮箱:" prop="contact_mail" class="labelItem">
|
|
|
+ <div>{{readForm.contact_mail}}</div>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ </el-form>
|
|
|
+ </el-dialog>
|
|
|
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
-<script>
|
|
|
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- form: {
|
|
|
- properties:[],
|
|
|
- certificate:[],
|
|
|
- type:[],
|
|
|
- address:'',
|
|
|
- name:''
|
|
|
- },
|
|
|
- tableHeader: [{
|
|
|
- label: '机构名称',
|
|
|
- prop: 'name',
|
|
|
- width: 240
|
|
|
- },{
|
|
|
- label: '机构类别',
|
|
|
- prop: 'properties',
|
|
|
- width: 160
|
|
|
- },{
|
|
|
- label: '机构级别',
|
|
|
- prop: 'level',
|
|
|
- width: 160
|
|
|
- },{
|
|
|
- label: '所属区域',
|
|
|
- prop: 'address',
|
|
|
- width: 240
|
|
|
- },{
|
|
|
- label: '机构负责人',
|
|
|
- prop: 'person',
|
|
|
- width: 150
|
|
|
- },{
|
|
|
- label: '创建时间',
|
|
|
- prop: 'create_time',
|
|
|
- width: 200
|
|
|
- },{
|
|
|
- label: '修改时间',
|
|
|
- prop: 'update_time',
|
|
|
- width: 200
|
|
|
- },
|
|
|
- ]}
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data(){
|
|
|
+ return{
|
|
|
+ queryInfo:{
|
|
|
+ pageSize:10,
|
|
|
+ pageNum:1,
|
|
|
+ groupname:'',
|
|
|
+ jgxz:'',
|
|
|
+ name:''
|
|
|
+ },
|
|
|
+ // 查看任务详情
|
|
|
+ readDialogVisible: false,
|
|
|
+ readForm: {},
|
|
|
+ total:0,
|
|
|
+ cellStyle: {
|
|
|
+ padding: 2 + 'px'
|
|
|
+ },
|
|
|
+ rowStyle: {
|
|
|
+ height: 35 + 'px'
|
|
|
+ },
|
|
|
+ tableData:[],
|
|
|
+ //表格区域
|
|
|
+ tableHeader: [
|
|
|
+ {
|
|
|
+ label: '机构名称',
|
|
|
+ prop: 'name',
|
|
|
+ width: 280
|
|
|
+ },{
|
|
|
+ label: '组别名称',
|
|
|
+ prop: 'groupname',
|
|
|
+ width: 200
|
|
|
+ },{
|
|
|
+ label: '企业代码',
|
|
|
+ prop: 'qydm',
|
|
|
+ width: 200
|
|
|
+ },{
|
|
|
+ label: '地址',
|
|
|
+ prop: 'address',
|
|
|
+ width: 180
|
|
|
+ },{
|
|
|
+ label: '联系人',
|
|
|
+ prop: 'contact_name',
|
|
|
+ width: 150
|
|
|
+ },{
|
|
|
+ label: '联系电话',
|
|
|
+ prop: 'contact_phone',
|
|
|
+ width: 150
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ // 任务状态选项
|
|
|
+ groupList: [
|
|
|
+ {
|
|
|
+ value: '1',
|
|
|
+ label: '省级监管单位'
|
|
|
+ }, {
|
|
|
+ value: '2',
|
|
|
+ label: '市级监管单位'
|
|
|
+ }, {
|
|
|
+ value: '3',
|
|
|
+ label: '县级监管单位'
|
|
|
+ }],
|
|
|
+ jxgzList: [
|
|
|
+ {
|
|
|
+ value: '1',
|
|
|
+ label: '政府部门'
|
|
|
+ }, {
|
|
|
+ value: '2',
|
|
|
+ label: '事业单位'
|
|
|
+ }, {
|
|
|
+ value: '3',
|
|
|
+ label: '企业'
|
|
|
+ }],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getJgOrgs()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async getJgOrgs(){
|
|
|
+ const {data: res} = await this.$http.post("getJgOrgs", this.queryInfo);
|
|
|
+ this.tableData = res.data.rows
|
|
|
+ this.total = res.data.total
|
|
|
},
|
|
|
- created() {
|
|
|
- this.getOrganization()
|
|
|
- },
|
|
|
- mounted() {
|
|
|
-
|
|
|
- },
|
|
|
- methods: {
|
|
|
- async getOrganization() {
|
|
|
- const result = await this.$http.post('getOrganization')
|
|
|
- console.log(result.data.data)
|
|
|
- this.form = result.data.data
|
|
|
- }
|
|
|
- }
|
|
|
+ //查询
|
|
|
+ async searchData(){
|
|
|
+ this.queryInfo.pageNum = 1
|
|
|
+ this.getJgOrgs()
|
|
|
+ },
|
|
|
+ //重置
|
|
|
+ reset(){
|
|
|
+ this.queryInfo={
|
|
|
+ pageSize:10,
|
|
|
+ pageNum:1,
|
|
|
+ groupname:'',
|
|
|
+ jgxz:'',
|
|
|
+ name:''
|
|
|
+ }
|
|
|
+ this.getJgOrgs()
|
|
|
+ },
|
|
|
+ //分页器
|
|
|
+ handleSizeChange(val) {
|
|
|
+ console.log(`每页 ${val} 条`);
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.queryInfo.pageNum = val;
|
|
|
+ console.log(`当前页: ${val}`);
|
|
|
+ this.getJgOrgs()
|
|
|
+ },
|
|
|
+ /** 监听页码的改变 */
|
|
|
+ handleCurrentChange(newPage) {
|
|
|
+ this.queryInfo.pageNum = newPage
|
|
|
+ this.getJgOrgs()
|
|
|
+ },
|
|
|
+ /** 监听每页显示多少数据的改变 */
|
|
|
+ handleSizeChange(newSize) {
|
|
|
+ this.queryInfo.pageSize = newSize
|
|
|
+ this.getJgOrgs()
|
|
|
+ },
|
|
|
+ // 查看主体信息详情
|
|
|
+ async readDialogVisible1(row) {
|
|
|
+ this.readForm.name = row.name
|
|
|
+ this.readForm.name_other = row.name_other
|
|
|
+ this.readForm.groupname = row.groupname
|
|
|
+ this.readForm.address = row.address
|
|
|
+ this.readForm.properties = row.properties
|
|
|
+ this.readForm.contact_name = row.contact_name
|
|
|
+ this.readForm.contact_phone = row.contact_phone
|
|
|
+ this.readForm.contact_mail = row.contact_mail
|
|
|
+ this.readForm.contact_qq = row.contact_qq
|
|
|
+ this.readForm.qydm = row.qydm
|
|
|
+ this.readForm.create_time = row.create_time
|
|
|
+ this.readForm.update_time = row.update_time
|
|
|
+ this.readForm.cpfw = row.cpfw
|
|
|
+ this.readForm.delete_time = row.delete_time
|
|
|
+ this.readDialogVisible = true
|
|
|
+
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
</script>
|
|
|
|
|
|
<style>
|
|
|
- /* .querybox{
|
|
|
- padding: -20px;
|
|
|
- } */
|
|
|
- .select {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- margin-left: 38px;
|
|
|
-
|
|
|
- }
|
|
|
- .card{
|
|
|
- box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
|
|
|
- background: rgb(249, 255, 250);
|
|
|
- }
|
|
|
+.headSearch{
|
|
|
+ margin-left: 60px;
|
|
|
+}
|
|
|
+.fenYeQi{
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
</style>
|