theluyuan/cha0yang
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
asd
2020-05-07 18:59:46 +08:00
commit dcbd58596c
156 changed files with 55326 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

674
src/views/InformationQuery.vue Normal file
View File

@@ -0,0 +1,674 @@
<template>
<div class="wrapper">
<header-nav :index_num="index_num"></header-nav>
<div id="box">
<!-- 搜索框 -->
<div class="search">
<input type="text" placeholder="请输入组织名称" v-model.trim="searchVal" @keyup.enter="getData()" />
<label @click="getData()" style="cursor:pointer">搜索</label>
</div>
<!-- 分类搜索 -->
<div class="select-box">
<select name="type" v-model="type_value" @change="scree()">
<option value="组织类型">组织类型</option>
<template v-for="(type, index) in types">
<option :key="index" :value="index">{{ type }}</option>
</template>
</select>
<select name="year" v-model="year_value" @change="scree()">
<option value="年检时间">年检时间</option>
<template v-for="(year, index) in years">
<option :key="index" :value="index">{{ year }}</option>
</template>
</select>
<select name="condition" v-model="year_status" @change="scree()">
<option value="年检结果">年检结果</option>
<option value="0">不合格</option>
<option value="1">合格</option>
</select>
</div>
<!-- 搜索记录 -->
<!-- <div class="record">
<template v-for="(item,index) in record">
<div class="list" :key="index" @click="searchRecord(item.nameOf)">
<span>{{item.category + '：' + item.nameOf}}</span>
<span class="iconfont icon-cuowu" @click="del(index)"></span>
</div>
</template>
</div>-->
<!-- 表格 -->
<div class="box-table">
<div class="caption">
<span
v-for="(list, index) in text"
:class="sub == index ? 'color' : ''"
:key="index"
@click="btn(index)"
>{{ list }}</span>
</div>
<table>
<tr>
<th>序号</th>
<th>社会组织名称</th>
<th>统一社会信用代码</th>
<th>社会组织类型</th>
<th>法定代表人</th>
<th>成立登记日期</th>
<th>状态</th>
</tr>
<template v-if="searchValue.length == 0">
<tr
v-for="(info, index) in conversion"
:key="index"
:class="index % 2 == 0 ? 'bgcbz' : 'bgcz'"
class="tr"
>
<td @click="$jP('socialcredit',{id:info.id})" class="orgname">{{ info.name }}</td>
<td>{{ info.unicode }}</td>
<td>{{ info.society_type }}</td>
<td>{{ info.legal_person }}</td>
<td>{{ info.reg_time }}</td>
<td v-if="info.status == '白名单'" style="color:#2fd63f">信用良好</td>
<td v-if="info.status == '黑名单'" style="color:#e13232">活动异常</td>
</tr>
</template>
<template v-if="searchValue.length > 0">
<tr
class="tr"
v-for="(info, index) in searchValue"
:key="index"
:class="index % 2 == 0 ? 'bgcbz' : 'bgcz'"
>
<td>{{ info.name }}</td>
<td>{{ info.unicode }}</td>
<td>{{ info.society_type }}</td>
<td>{{ info.legal_person }}</td>
<td>{{ info.reg_time }}</td>
<td v-if="info.status == '白名单'" style="color:#2fd63f">信用良好</td>
<td v-if="info.status == '黑名单'" style="color:#e13232">活动异常</td>
</tr>
</template>
</table>
</div>
<!-- 分页按钮 -->
<div class="page">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-size="pageSize"
:pager-count="5"
background
layout="prev, pager, next"
:total="totalCount"
></el-pagination>
</div>
</div>
<footer-nav class="footer"></footer-nav>
</div>
</template>
<script>
import HeaderNav from '../components/HeaderNav'
import FooterNav from '../components/FooterNav'
export default {
components: {
HeaderNav,
FooterNav
},
props: {},
data () {
return {
index_num: 1,
text: ['全部', '异常名录', '信用良好名录'],
sub: 0,
imgUrl: {
xa: require('../../static/img/xa.png')
},
searchVal: '',
searchValue: [],
record: [],
types: [],
years: '',
year_status: '年检结果',
type_value: '组织类型',
year_value: '年检时间',
bgData: [],
arr1: [],
arr0: [],
conversion: [],
pageSize: 1,
currentPage: 1,
totalCount: 1,
status: ''
}
},
computed: {},
watch: {
// record(newVal, oldVal) { }
},
methods: {
/** 筛选函数 */
scree () {
this.currentPage = 1
if (this.sub === 0) {
this.sub = ''
} else if (this.sub === 1) {
this.sub = 0
} else {
this.sub = 1
}
this.getData(
this.searchVal,
this.type_value,
this.years[this.year_value],
this.year_status,
this.sub,
this.currentPage
)
if (this.sub === '') {
this.sub = 0
} else if (this.sub === 0) {
this.sub = 1
} else {
this.sub = 2
}
},
/** 删除单条数据 */
// del(index) {
// let delArr = this.record.splice(index, 1)
// },
/** 调用搜索函数 */
// searchRecord(str) {
// this.getSearch(str)
// },
/** 名单切换 */
btn (index) {
let s = this.sub
s = index
this.sub = s
this.currentPage = 1
switch (this.sub) {
case 0:
this.getData(
this.searchVal,
this.type_value,
this.years[this.year_value],
this.year_status,
(this.status = '')
)
break
case 1:
this.getData(
this.searchVal,
this.type_value,
this.years[this.year_value],
this.year_status,
(this.status = 0)
)
break
case 2:
this.getData(
this.searchVal,
this.type_value,
this.years[this.year_value],
this.year_status,
(this.status = 1)
)
break
}
},
/** 获取后台数据 */
getData (
name = this.searchVal,
type = this.type_value,
year = this.years[this.year_value],
yearStatus = this.year_status,
status = this.status,
page = this.currentPage
) {
if (type === '组织类型') {
type = ''
// this.type_value = ''
}
if (year === '年检时间') {
year = ''
// this.years[this.year_value] = ''
}
if (yearStatus === '年检结果') {
yearStatus = ''
// this.year_status = ''
}
let _this = this
this.$http({
method: 'post',
url: 'v1/society/society',
data: {
name: name,
type: type,
year: year,
yearStatus: yearStatus,
status: status,
page: page
}
})
.then(res => {
if (res.data.data.code !== 200) {
return
}
// if (this.page == 1) {
if (res.data.data.data.info.length === 0) {
this.currentPage=1
alert('您所查询的数据暂时没有！')
return
} else {
_this.conversion = res.data.data.data.info
_this.totalCount = res.data.data.data.allPage
// console.log(_this.conversion);
}
_this.page++
})
.catch(err => {
console.log(err)
})
// console.log(this.type_value);
if (this.type_value === '') {
this.type_value = '组织类型'
}
if (this.years[this.year_value] === '') {
this.year_value = '年检时间'
}
if (this.year_status === '') {
this.year_status = '年检结果'
}
},
/** 获取类型 */
getDataG () {
let _this = this
this.$http({
method: 'get',
url: 'v1/society/get-type',
params: {}
})
.then(res => {
if (res.data.code !== 200) {
return
}
_this.types = res.data.data.type
_this.years = res.data.data.year
})
.catch(err => {
console.log(err)
})
},
handleSizeChange (val) {
this.pageSize = val
this.getPackData()
},
handleCurrentChange (val) {
this.currentPage = val
this.getData()
this.getPackData()
},
getPackData () { }
},
created () {
this.getDataG()
this.getData()
},
mounted () { }
}
</script>
<style lang="scss" scoped>
.wrapper {
min-width: 1280px;
box-sizing: border-box;
position: relative;
.orgname{
cursor: pointer;
}
#box {
width: 1200px;
background-color: #ffffff;
margin: 40px auto 80px;
box-sizing: border-box;
padding: 35px 30px 86px;
.page {
margin-top: 60px;
height: 36px;
display: flex;
justify-content: flex-end;
align-items: center;
/deep/ .el-pagination.is-background .el-pager li {
color: #333 !important;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
background-color: #e60012;
color: #fff !important;
}
/deep/ .el-icon.el-icon-arrow-left::before {
content: "上一页";
font-family: "MicrosoftYaHei";
font-size: 12px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 1px;
color: #666;
}
/deep/ .el-pagination .btn-prev {
width: 80px;
}
/deep/ .el-pagination .btn-next {
width: 80px;
}
/deep/ .el-icon.el-icon-arrow-right::before {
content: "下一页";
font-family: "MicrosoftYaHei";
font-size: 12px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 1px;
color: #666;
}
}
.box-table {
width: 100%;
margin-top: -25px;
table {
width: 1130px;
counter-reset: items 0; /* 0 可以省略 */
counter-increment: counter-name integer;
box-sizing: border-box;
.tr {
counter-increment: items 1; /* 1 同样可以省略 */
&:before {
content: counter(items);
font-family: "MicrosoftYaHei";
font-size: 16px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 0px;
color: #595959;
width: 86px;
height: 40px;
display: inline-block;
text-align: center;
line-height: 40px;
box-sizing: border-box;
}
}
th {
line-height: 40px;
text-align: center;
height: 40px;
font-family: "MicrosoftYaHei";
font-size: 16px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 0px;
color: #666666;
background-color: #f6fafd;
box-sizing: border-box;
&:nth-of-type(1) {
width: 86px;
}
&:nth-of-type(2) {
width: 160px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(3) {
width: 240px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(4) {
width: 160px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(5) {
width: 160px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(6) {
width: 160px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(7) {
width: 140px;
border-left: 1px solid #dcebf6 !important;
}
}
.bgcz {
background-color: #f6fafd;
}
.bgcbz {
background-color: #fff;
}
td {
border: none !important;
line-height: 40px;
text-align: center;
height: 40px;
font-family: "MicrosoftYaHei";
font-size: 16px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 0px;
box-sizing: border-box;
color: #595959;
&:nth-of-type(1) {
width: 160px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(2) {
width: 240px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(3) {
width: 160px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(4) {
width: 160px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(5) {
width: 160px;
border-left: 1px solid #dcebf6 !important;
}
&:nth-of-type(6) {
width: 140px;
border-left: 1px solid #dcebf6 !important;
}
/*
&:nth-of-type(7) {
width: 144px;
}
*/
}
}
.caption {
width: 1140px;
height: 38px;
border-bottom: 1px solid #dedede;
margin-top: 76px;
margin-bottom: 30px;
padding-left: 30px;
box-sizing: border-box;
span {
display: inline-block;
height: 38px;
text-align: center;
font-family: "MicrosoftYaHei";
font-size: 20px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 0px;
color: #333333;
margin-right: 49px;
&:nth-of-type(1) {
width: 60px;
}
&:nth-of-type(2) {
width: 110px;
}
&:nth-of-type(3) {
width: 121px;
}
}
.color {
color: #e60012;
position: relative;
&::after {
content: "";
width: 100%;
height: 2px;
background-image: linear-gradient(#e60012, #e60012),
linear-gradient(#ff7f7f, #ff7f7f);
background-blend-mode: normal, normal;
position: absolute;
left: 0%;
bottom: 0%;
}
}
}
}
.record {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
.list {
margin-right: 25px;
border-radius: 4px;
border: solid 1px #c7c7c7;
padding: 10px 24px;
font-family: "MicrosoftYaHei";
font-size: 18px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 0px;
color: #666666;
margin-bottom: 25px;
.iconfont {
margin-left: 10px;
}
}
}
.select-box {
display: flex;
align-items: center;
select {
color: #666 !important;
font-size: 18px;
&:nth-of-type(1) {
/* 清除默认的箭头样式 */
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
/* 右侧添加小箭头的背景图 */
background: url("../../static/img/xa.png") 90% center no-repeat;
background-size: 14px 8px;
// width: 170px;
padding: 0 30px;
height: 38px;
background-color: #f9f8f8;
border-radius: 4px;
border: solid 1px #c7c7c7;
}
/* 清除默认的箭头样式 */
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
/* 右侧添加小箭头的背景图 */
background: url("../../static/img/xa.png") 126px center no-repeat;
background-size: 14px 8px;
width: 170px;
height: 38px;
background-color: #f9f8f8;
border-radius: 4px;
border: solid 1px #c7c7c7;
margin-right: 55px;
padding-left: 30px;
box-sizing: border-box;
outline: none;
margin-bottom: 30px;
}
}
.search {
width: 100%;
height: 50px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
input {
font-family: "MicrosoftYaHei";
font-size: 18px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 2px;
color: #666666;
padding: 0 18px;
box-sizing: border-box;
width: 1025px;
height: 50px;
border: solid 1px #c7c7c7;
outline: none;
}
label {
width: 96px;
height: 50px;
background-color: #e60012;
font-family: "MicrosoftYaHei";
font-size: 18px;
font-weight: normal;
font-stretch: normal;
line-height: 50px;
letter-spacing: 0px;
color: #ffffff;
text-align: center;
}
}
}
}
</style>