Commit 52665ae9 by amateur
2 parents e245e3ec 719d9bc9
...@@ -28,6 +28,7 @@ ...@@ -28,6 +28,7 @@
.icon-message { width: 50px; height: 50px; background-position: -1770px -981px; } .icon-message { width: 50px; height: 50px; background-position: -1770px -981px; }
.icon-more { width: 10px; height: 18px; background-position: -2050px -775px; } .icon-more { width: 10px; height: 18px; background-position: -2050px -775px; }
.icon-password { width: 36px; height: 36px; background-position: -1864px -1169px; } .icon-password { width: 36px; height: 36px; background-position: -1864px -1169px; }
.icon-pdf-icon { width: 46px; height: 28px; background-position: -1297px -670px; }
.icon-pdf { width: 46px; height: 60px; background-position: -1696px -1055px; } .icon-pdf { width: 46px; height: 60px; background-position: -1696px -1055px; }
.icon-photo-default { width: 124px; height: 124px; background-position: -1232px -526px; } .icon-photo-default { width: 124px; height: 124px; background-position: -1232px -526px; }
.icon-progress-act { width: 36px; height: 36px; background-position: -1920px -1169px; } .icon-progress-act { width: 36px; height: 36px; background-position: -1920px -1169px; }
...@@ -42,6 +43,7 @@ ...@@ -42,6 +43,7 @@
.icon-user { width: 36px; height: 36px; background-position: -1808px -1225px; } .icon-user { width: 36px; height: 36px; background-position: -1808px -1225px; }
.icon-verification { width: 36px; height: 36px; background-position: -1864px -1225px; } .icon-verification { width: 36px; height: 36px; background-position: -1864px -1225px; }
.icon-wechat { width: 80px; height: 78px; background-position: -1940px -847px; } .icon-wechat { width: 80px; height: 78px; background-position: -1940px -847px; }
.icon-wechat { width: 80px; height: 78px; background-position: -1940px -847px; }
.icon-all { width: 8px; height: 8px; background-position: -1403px -670px; } .icon-all { width: 8px; height: 8px; background-position: -1403px -670px; }
.icon-pdf-icon { width: 46px; height: 28px; background-position: -1297px -670px; } .icon-pdf-icon { width: 46px; height: 28px; background-position: -1297px -670px; }
.icon-up-arrow { width: 20px; height: 14px; background-position: -1363px -670px; }
\ No newline at end of file \ No newline at end of file
.icon-up-arrow { width: 20px; height: 14px; background-position: -1363px -670px; }
...@@ -4,7 +4,7 @@ const qulificationRouter = [{ ...@@ -4,7 +4,7 @@ const qulificationRouter = [{
meta: { meta: {
title: '资质查询' title: '资质查询'
}, },
component: () => import( /* webpackChunkName: "qulificationSearch" */ '@/views/qulification/search.vue') // 资质查询 component: () => import( /* webpackChunkName: "qulificationSearch" */ '@/views/qulification/searchHistory.vue') // 资质查询
}, { }, {
path: '/qulification/list', path: '/qulification/list',
name: 'QulificationList', name: 'QulificationList',
......
...@@ -51,12 +51,7 @@ export default { ...@@ -51,12 +51,7 @@ export default {
this.loading = false this.loading = false
}, },
jumpDetail(id) { jumpDetail(id) {
this.$router.push({ // todo pdf
name: 'RegIssueDetail',
query: {
id
}
})
} }
} }
} }
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</template> </template>
</van-field> </van-field>
<p class="wraning_tip"> <p class="wraning_tip">
<span v-show="isLogin">{{$t('mlogin.warningTip')}}</span> <span v-show="warningShow">{{$t('mlogin.warningTip')}}</span>
</p> </p>
<div> <div>
<van-button :class="isLogin ? 'login_btn' : 'act_btn login_btn'" block type="info" native-type="submit" @click="loginSubmit">登录</van-button> <van-button :class="isLogin ? 'login_btn' : 'act_btn login_btn'" block type="info" native-type="submit" @click="loginSubmit">登录</van-button>
...@@ -46,6 +46,9 @@ export default { ...@@ -46,6 +46,9 @@ export default {
computed: { computed: {
isLogin() { isLogin() {
return !this.code || this.code === '' || !this.password || this.password === '' || !this.checkCode || this.checkCode === '' return !this.code || this.code === '' || !this.password || this.password === '' || !this.checkCode || this.checkCode === ''
},
warningShow() {
return !(this.code || this.password || this.checkCode)
} }
}, },
methods: { methods: {
...@@ -84,7 +87,7 @@ export default { ...@@ -84,7 +87,7 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
.login_form { .login_form {
width: 330px; width: 340px;
padding: 20px 0; padding: 20px 0;
background-color: #ffffff; background-color: #ffffff;
::v-deep .van-cell:not(:last-child)::after { ::v-deep .van-cell:not(:last-child)::after {
...@@ -113,6 +116,7 @@ export default { ...@@ -113,6 +116,7 @@ export default {
} }
.wraning_tip { .wraning_tip {
min-height: 17px; min-height: 17px;
line-height: 17px;
color: #ea5c6d; color: #ea5c6d;
font-size: 12px; font-size: 12px;
margin-top: 16px; margin-top: 16px;
......
<template>
<div class="qulification_search_container">
<div v-if="isSearch" class="search_bar">
<van-field v-model="searchName" :placeholder="placeholdTxt" @input="inputChange">
<template #label>
<div class="select" :style="searchName && searchName!== '' ? 'opacity: 1' : 'opacity: 0.6'" @click="showSheet = true">
<van-icon name="search" />
<span class="qulification_type">{{qulificationType}}</span>
<van-icon name="play" />
</div>
</template>
</van-field>
</div>
<section v-else class="search_box">
<span class="select" @click="showSheet = true">
<van-icon name="search" />
<span class="qulification_type">{{qulificationType}}</span>
<van-icon name="play" />
</span>
<div class="visual_input" @click="toListSearch">
<span>{{placeholdTxt}}</span>
</div>
</section>
<van-action-sheet v-model="showSheet" :actions="actions" :cancel-text="$t('button.cancel')" close-on-click-action @select="onSelect" />
</div>
</template>
<script>
export default {
name: 'QulificationSearch',
props: {
isSearch: {
type: Boolean,
default: () => {
return false
}
}
},
computed: {
actions() {
return [this.$t('qulification.searchAction').org, this.$t('qulification.searchAction').product ]
}
},
data() {
return {
qulificationType: '',
placeholdTxt: '',
showSheet: false,
searchName: ''
}
},
created() {
this.defaultInput()
},
methods: {
defaultInput() {
this.qulificationType = this.$t('qulification.searchAction').org.name
this.placeholdTxt = this.$t('qulification.searchAction').org.placeholder
},
onSelect(item) {
this.show = false;
this.qulificationType = item.name;
this.placeholdTxt = this.$t('qulification.searchAction')[item.key].placeholder
this.$emit('select', item)
},
toListSearch() {
this.$router.push({name: 'QulificationList'})
},
inputChange() {
this.$emit('input', this.searchName)
}
}
}
</script>
<style lang="less" scoped>
.search_box {
width: 384px;
margin: 30px auto 25px;
border-radius: 16px;
background-color: rgba(246, 246, 246, 1);
display: flex;
font-size: 12px;
.select {
color: #999999;
display: flex;
align-items: center;
padding: 10px 10px 10px 5px;
.van-icon-search {
margin: 0 11px;
font-size: 12px;
}
.qulification_type {
color: #333333;
margin-right: 5px;
}
.van-icon-play {
transform: rotate(90deg);
-ms-transform: rotate(90deg); /* IE 9 */
-moz-transform: rotate(90deg); /* Firefox */
-webkit-transform: rotate(90deg); /* Safari 和 Chrome */
-o-transform: rotate(90deg);
}
}
.visual_input {
// width: 285px;
color: #999999;
padding: 10px 0;
overflow: hidden; /*超出部分隐藏*/
white-space: nowrap; /*不换行*/
text-overflow: ellipsis; /*超出部分文字以...显示*/
span {
padding-left: 15px;
border-left: 0.5px solid #999999;
}
}
}
.search_bar {
width: 384px;
padding: 10px 15px;
.van-cell {
border-radius: 50px;
background-color: rgba(255, 255, 255, 0.3);
padding: 5px;
line-height: 17px;
::v-deep .van-field__control {
font-size: 12px;
color: #ffffff;
}
::v-deep input::-webkit-input-placeholder {
color: rgba(255, 255, 255, 0.6);
}
::v-deep input::-moz-input-placeholder {
color: rgba(255, 255, 255, 0.6);
}
::v-deep input::-ms-input-placeholder {
color: rgba(255, 255, 255, 0.6);
}
}
::v-deep .van-field__label {
width: auto;
}
.select {
color: #ffffff;
padding: 0 10px 0 5px;
font-size: 12px;
border-right: 0.5px solid #ffffff;
.van-icon-search {
margin: 0 11px;
}
.qulification_type {
margin-right: 5px;
}
.van-icon-play {
transform: rotate(90deg);
-ms-transform: rotate(90deg); /* IE 9 */
-moz-transform: rotate(90deg); /* Firefox */
-webkit-transform: rotate(90deg); /* Safari 和 Chrome */
-o-transform: rotate(90deg);
}
}
}
</style>
...@@ -2,17 +2,7 @@ ...@@ -2,17 +2,7 @@
<div class="list_container"> <div class="list_container">
<NafmHeader navClass="nafmii-head-bg3" title="资质查询"> <NafmHeader navClass="nafmii-head-bg3" title="资质查询">
<template slot="bottom"> <template slot="bottom">
<div class="search_bar"> <search :isSearch="true" v-model="searchName"></search>
<van-field v-model="searchName" placeholder="请输入机构名称">
<template #label>
<div class="select" :style="searchName && searchName!== '' ? 'opacity: 1' : 'opacity: 0.6'">
<van-icon name="search" />
<span class="qulification_type">{{qulificationType}}</span>
<van-icon name="play" />
</div>
</template>
</van-field>
</div>
</template> </template>
</NafmHeader> </NafmHeader>
<main class="list_content"> <main class="list_content">
...@@ -20,9 +10,7 @@ ...@@ -20,9 +10,7 @@
<van-cell-group> <van-cell-group>
<van-cell v-for="item in searchList" :key="item.id" icon="search"> <van-cell v-for="item in searchList" :key="item.id" icon="search">
<template slot="title"> <template slot="title">
<!-- <van-icon name="search" /> --> <span v-html="highligntTxt(item.name)"></span>
<!-- <span>{{item.name.replace(new RegExp(searchName, 'g'), '<span></span>')}}</span> -->
<span>{{item.name}}</span>
</template> </template>
</van-cell> </van-cell>
</van-cell-group> </van-cell-group>
...@@ -33,57 +21,20 @@ ...@@ -33,57 +21,20 @@
<script> <script>
export default { export default {
name: 'QulificationList', name: 'QulificationList',
components: {
search: ()=>import('./components/search.vue')
},
data() { data() {
return { return {
searchName: 'aaa', searchName: '',
qulificationType: '机构', qulificationType: '机构',
searchList: [{name: 'aaaaaaabbbbb', id: 111}] searchList: []
}
}
}
</script>
<style lang="less" scoped>
.search_bar {
width: 384px;
padding: 10px 15px;
.van-cell {
border-radius: 50px;
background-color: rgba(255, 255, 255, 0.3);
padding: 0px;
::v-deep .van-field__control {
font-size: 12px;
color: #ffffff;
}
::v-deep input::-webkit-input-placeholder {
color: rgba(255, 255, 255, 0.6);
} }
::v-deep input::-moz-input-placeholder { },
color: rgba(255, 255, 255, 0.6); methods: {
highligntTxt(txt) {
return txt.replace(this.searchName, `<font color='#2861AC'>${this.searchName}</font>`)
} }
::v-deep input::-ms-input-placeholder {
color: rgba(255, 255, 255, 0.6);
}
}
}
.select {
color: #ffffff;
display: flex;
align-items: center;
padding: 0 10px 0 5px;
font-size: 12px;
.van-icon-search {
margin: 0 11px;
}
.qulification_type {
margin-right: 5px;
}
.van-icon-play {
transform: rotate(90deg);
-ms-transform: rotate(90deg); /* IE 9 */
-moz-transform: rotate(90deg); /* Firefox */
-webkit-transform: rotate(90deg); /* Safari 和 Chrome */
-o-transform: rotate(90deg);
} }
} }
</style> </script>
...@@ -5,16 +5,7 @@ ...@@ -5,16 +5,7 @@
<section class="logo"> <section class="logo">
</section> </section>
<h3 class="search_title">{{$t('qulification.title')}}</h3> <h3 class="search_title">{{$t('qulification.title')}}</h3>
<section class="search_box"> <search @select="searchSelect"></search>
<span class="select" @click="showSheet = true">
<van-icon name="search" />
<span class="qulification_type">{{qulificationType}}</span>
<van-icon name="play" />
</span>
<div class="visual_input" @click="toListSearch">
<span>{{placeholdTxt}}</span>
</div>
</section>
<section class="search_history"> <section class="search_history">
<div class="history_header"> <div class="history_header">
<span>{{$t('qulification.history')}}</span> <span>{{$t('qulification.history')}}</span>
...@@ -27,26 +18,16 @@ ...@@ -27,26 +18,16 @@
</div> </div>
</section> </section>
</main> </main>
<van-action-sheet v-model="showSheet" :actions="actions" :cancel-text="$t('button.cancel')" close-on-click-action @select="onSelect" />
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: 'QulificationSearch', name: 'QulificationSearch',
computed: { components: {
actions() { search: ()=>import('./components/search.vue')
return [this.$t('qulification.searchAction').org, this.$t('qulification.searchAction').product ]
}
}, },
data() { data() {
return { return {
// actions: [
// {name:'机构', type: 'org' },
// {name:'非法人产品', type: 'pro'}
// ],
qulificationType: '',
placeholdTxt: '',
showSheet: false,
historyItems: [{ historyItems: [{
name: 'jdnskjfnjkds', name: 'jdnskjfnjkds',
id:11111 id:11111
...@@ -62,23 +43,18 @@ export default { ...@@ -62,23 +43,18 @@ export default {
} }
}, },
created() { created() {
this.defaultInput() this.searchSelect()
}, },
methods: { methods: {
defaultInput() { defaultInput() {
this.qulificationType = this.$t('qulification.searchAction').org.name this.qulificationType = this.$t('qulification.searchAction').org.name
this.placeholdTxt = this.$t('qulification.searchAction').org.placeholder this.placeholdTxt = this.$t('qulification.searchAction').org.placeholder
}, },
onSelect(item) {
this.show = false;
this.qulificationType = item.name;
this.placeholdTxt = this.$t('qulification.searchAction')[item.key].placeholder
},
toListSearch() {
this.$router.push({name: 'QulificationList'})
},
toDetail() { toDetail() {
this.$router.push({name: 'QulificationDetail'}) this.$router.push({name: 'QulificationDetail'})
},
searchSelect(seachType) {
} }
} }
} }
...@@ -101,47 +77,6 @@ export default { ...@@ -101,47 +77,6 @@ export default {
color: #333333; color: #333333;
text-align: center; text-align: center;
} }
.search_box {
width: 384px;
margin: 30px auto 25px;
border-radius: 16px;
background-color: rgba(246, 246, 246, 1);
display: flex;
font-size: 12px;
.select {
color: #999999;
display: flex;
align-items: center;
padding: 10px 10px 10px 5px;
.van-icon-search {
margin: 0 11px;
font-size: 12px;
}
.qulification_type {
color: #333333;
margin-right: 5px;
}
.van-icon-play {
transform: rotate(90deg);
-ms-transform: rotate(90deg); /* IE 9 */
-moz-transform: rotate(90deg); /* Firefox */
-webkit-transform: rotate(90deg); /* Safari 和 Chrome */
-o-transform: rotate(90deg);
}
}
.visual_input {
// width: 285px;
color: #999999;
padding: 10px 0;
overflow: hidden; /*超出部分隐藏*/
white-space: nowrap; /*不换行*/
text-overflow: ellipsis; /*超出部分文字以...显示*/
span {
padding-left: 15px;
border-left: 0.5px solid #999999;
}
}
}
.search_history { .search_history {
.history_header { .history_header {
line-height: 25px; line-height: 25px;
......
<template> <template>
<div class="list_container"> <div class="list_container">
<!-- {{type}} --> <div class="item" v-for="(item,index) in list" :key="index" v-show="type==1">
<div class="item" v-for="(item,index) in list" :key="index">
<h2>{{item.title}}</h2> <h2>{{item.title}}</h2>
<div class="item_child"> <div class="item_child">
<div class="child" v-for="(childItem,childIndex) in item.arr" :key="childIndex" @click="jumpPdfDetail(childItem)"> <div class="child" v-for="(childItem,childIndex) in item.arr" :key="childIndex" @click="jumpPdfDetail(childItem)">
...@@ -10,8 +9,19 @@ ...@@ -10,8 +9,19 @@
</div> </div>
</div> </div>
</div> </div>
<div class="item-other"> <div class="item-other" v-show="type!=1">
1 <div class="file-item" v-for="(item,index) in fileList" :key="index" @click="jumpPdfDetail(item)">
<div class="file-title">
<img :src="pdfIcon2">
<span>{{item.title}}</span>
</div>
<div class="file-time">
<div class="file-item-right">
<img :src="timeUpdateIcon" alt="">
<span>更新日期:{{item.time}}</span>
</div>
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
...@@ -21,12 +31,13 @@ export default { ...@@ -21,12 +31,13 @@ export default {
props: { props: {
type: { type: {
type: String, type: String,
default: '1'
} }
}, },
data() { data() {
return { return {
pdfIcon: require('@/assets/icon/pdf_icon.png'), pdfIcon: require('@/assets/icon/pdf_icon.png'),
pdfIcon2: require('@/assets/icon/pdf.png'),
timeUpdateIcon: require('@/assets/icon/time_update.png'),
list: [ list: [
{ {
title: '无锡产业发展集团有限公司2020年三季度财务报表', title: '无锡产业发展集团有限公司2020年三季度财务报表',
...@@ -49,6 +60,23 @@ export default { ...@@ -49,6 +60,23 @@ export default {
{ time: '2021.4.13', title: '终稿' }, { time: '2021.4.13', title: '终稿' },
] ]
} }
],
fileList: [
{
id: 1,
title: '【初稿】无锡产业发展集团有限公司2020年三季度财务报表',
time: '2021-4-12 '
},
{
id: 2,
title: '【初稿】无锡产业发展集团有限公司2020年三季度财务报表',
time: '2021-4-13 '
},
{
id: 3,
title: '【初稿】无锡产业发展集团有限公司2020年三季度财务报表',
time: '2021-4-14 '
}
] ]
} }
}, },
...@@ -124,4 +152,47 @@ export default { ...@@ -124,4 +152,47 @@ export default {
} }
} }
} }
.file-item {
border-radius: 8px;
background-color: #fff;
box-shadow: 0px 0px 6px 0px rgba(2, 15, 41, 0.06);
.file-title {
padding: 10px 15px 10px 0;
margin-left: 15px;
border-bottom: 1px solid #efefef;
display: flex;
justify-content: space-between;
align-items: center;
img {
width: 22px;
height: 29px;
margin-right: 10px;
}
span {
font-size: 13px;
color: #388de2;
text-decoration: underline;
flex: 1;
}
}
}
.file-time {
padding: 10px 0;
display: flex;
justify-content: flex-end;
.file-item-right {
display: flex;
align-items: center;
img {
width: 15px;
height: 15px;
margin-right: 7px;
}
span {
font-size: 12px;
color: #888d8d;
margin-right: 15px;
}
}
}
</style> </style>
\ No newline at end of file \ No newline at end of file
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!