@@ -170,6 +170,9 @@ const whiteList = [ | |||||
'/agriculturalTrusteeship/societyProjectList',//社会化产品列表 | '/agriculturalTrusteeship/societyProjectList',//社会化产品列表 | ||||
'/agriculturalTrusteeship/societyProjectDetail',//社会化产品详情 | '/agriculturalTrusteeship/societyProjectDetail',//社会化产品详情 | ||||
'/agriculturalTrusteeship/shopList',//保险列表首页 | '/agriculturalTrusteeship/shopList',//保险列表首页 | ||||
'/agriculturalTrusteeship/shopNeedsList',//保险列表首页 | |||||
'/agriculturalTrusteeship/shopOrganizationDetail',//保险列表首页 | |||||
'/agriculturalTrusteeship/shopDepositDetail',//保险列表首页 | |||||
'/agriculturalTrusteeship/shopDetail',//保险列表详情 | '/agriculturalTrusteeship/shopDetail',//保险列表详情 | ||||
'/agriculturalTrusteeship/shopEdit',//保险列表详情 | '/agriculturalTrusteeship/shopEdit',//保险列表详情 | ||||
'/agriculturalTrusteeship/shopAdd',//保险列表首页 | '/agriculturalTrusteeship/shopAdd',//保险列表首页 | ||||
@@ -5137,6 +5137,33 @@ export const constantRoutes = [ | |||||
}, | }, | ||||
component: (resolve) => require(['@/views/agriculturalTrusteeship/shop/shopList'], resolve) | component: (resolve) => require(['@/views/agriculturalTrusteeship/shop/shopList'], resolve) | ||||
}, | }, | ||||
{ | |||||
path: '/agriculturalTrusteeship/shopNeedsList', | |||||
name: 'agriculturalTrusteeshipShopNeedsList', | |||||
meta: { | |||||
title: '贷款需求', | |||||
hidden: true, | |||||
}, | |||||
component: (resolve) => require(['@/views/agriculturalTrusteeship/shop/shopNeedsList'], resolve) | |||||
}, | |||||
{ | |||||
path: '/agriculturalTrusteeship/shopOrganizationDetail', | |||||
name: 'agriculturalTrusteeshipShopOrganizationDetail', | |||||
meta: { | |||||
title: '服务组织', | |||||
hidden: true, | |||||
}, | |||||
component: (resolve) => require(['@/views/agriculturalTrusteeship/shop/shopOrganizationDetail'], resolve) | |||||
}, | |||||
{ | |||||
path: '/agriculturalTrusteeship/shopDepositDetail', | |||||
name: 'agriculturalTrusteeshipShopDepositDetail', | |||||
meta: { | |||||
title: '托管主体', | |||||
hidden: true, | |||||
}, | |||||
component: (resolve) => require(['@/views/agriculturalTrusteeship/shop/shopDepositDetail'], resolve) | |||||
}, | |||||
{ | { | ||||
path: '/agriculturalTrusteeship/serviceEdit', | path: '/agriculturalTrusteeship/serviceEdit', | ||||
name: 'agriculturalTrusteeshipServiceEdit', | name: 'agriculturalTrusteeshipServiceEdit', | ||||
@@ -0,0 +1,394 @@ | |||||
<template> | |||||
<div class="home_wrapper"> | |||||
<!-- 头部开始 --> | |||||
<div class="header"> | |||||
<div class="header_left" @click="onClickLeft"> | |||||
<img src="../../../../static/images/agriculturalTrusteeship/return.png"> | |||||
<p>需求详情</p> | |||||
</div> | |||||
</div> | |||||
<!-- 头部结束 --> | |||||
<!-- 内容开始 --> | |||||
<div class="main"> | |||||
<div class="main_content_right_list"> | |||||
<div class="main_tit"> | |||||
<i></i> | |||||
<p>家家加加加加加加加就爱简爱家合作社</p> | |||||
</div> | |||||
<p class="main_content">村口需要水牛石头诚招水牛贷款联系电话165822本人人品优良绝不拖欠还款。</p> | |||||
<div class="main_money"> | |||||
<p><span>需求金额</span><span>¥</span>512,000.00</p> | |||||
</div> | |||||
<van-divider /> | |||||
<van-field | |||||
readonly | |||||
label="负责人" | |||||
input-align="right" | |||||
:border="false" | |||||
placeholder="负责人" | |||||
/> | |||||
<van-field | |||||
readonly | |||||
label="联系方式" | |||||
input-align="right" | |||||
:border="false" | |||||
placeholder="联系方式" | |||||
/> | |||||
<van-field | |||||
readonly | |||||
label="地址" | |||||
input-align="right" | |||||
:border="false" | |||||
placeholder="地址" | |||||
/> | |||||
</div> | |||||
<div class="main_content_right_list2"> | |||||
<div> | |||||
<p>托管农户数(户)</p> | |||||
<p>366</p> | |||||
</div> | |||||
<div> | |||||
<p>托管面积(亩)</p> | |||||
<p>366</p> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
<!-- 内容结束 --> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import Cookies from "js-cookie"; | |||||
import {productList, productOut, productIn, serviceGet, treeselect} from "@/api/agriculturalTrusteeship"; | |||||
export default { | |||||
name: "shopOrganizationDetail", | |||||
data() { | |||||
return { | |||||
}; | |||||
}, | |||||
created() { | |||||
}, | |||||
methods: { | |||||
}, | |||||
} | |||||
</script> | |||||
<style scoped lang="scss"> | |||||
.home_wrapper{ | |||||
background: #f9f9f9; | |||||
height: 100vh; | |||||
overflow: hidden; | |||||
} | |||||
/*头部*/ | |||||
.header{ | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: space-between; | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
padding: 2vh 4% 2vh; | |||||
.header_left{ | |||||
display: flex; | |||||
align-items: center; | |||||
p{ | |||||
font-size: .4rem; | |||||
color: #ffffff; | |||||
line-height: 1; | |||||
margin-left: 10PX; | |||||
} | |||||
} | |||||
.header_right{ | |||||
font-size: .35rem; | |||||
background: #334281; | |||||
padding: 2PX 10PX; | |||||
border-radius: 50PX; | |||||
/deep/ .van-checkbox__icon--checked .van-icon{ | |||||
color: #334281; | |||||
} | |||||
/deep/ .van-checkbox__label{ | |||||
color: #ffffff; | |||||
} | |||||
/deep/ .van-checkbox__icon .van-icon{ | |||||
width: .9em; | |||||
height: .9em; | |||||
line-height: .9em; | |||||
} | |||||
/deep/ .van-icon-success::before{ | |||||
width: .9em; | |||||
height: .9em; | |||||
} | |||||
/deep/ .van-checkbox__icon{ | |||||
height: auto; | |||||
} | |||||
} | |||||
} | |||||
.main_btn{ | |||||
display: flex; | |||||
background: #ffffff; | |||||
border-top-left-radius: 25PX; | |||||
border-top-right-radius: 25PX; | |||||
overflow: hidden; | |||||
padding: 4vw 4% 0; | |||||
justify-content: space-between; | |||||
.btn_box_01{ | |||||
width: 48%; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
border: 1Px dashed #4E7FFF; | |||||
color: #4E7FFF; | |||||
font-size: .35rem; | |||||
line-height: 15vw; | |||||
border-radius: 10Px; | |||||
p:first-child{ | |||||
font-weight: bold; | |||||
margin-right: 5PX; | |||||
} | |||||
} | |||||
.btn_box_02{ | |||||
width: 48%; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
background: rgba(78,127,255,0.17); | |||||
color: #1E49BB; | |||||
font-size: .35rem; | |||||
line-height: 15vw; | |||||
border-radius: 10Px; | |||||
p{ | |||||
margin-left: 5PX; | |||||
} | |||||
} | |||||
} | |||||
.serviceName{ | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: space-between; | |||||
span{ | |||||
background: #E8E8E8; | |||||
padding: 0 8PX; | |||||
border-radius: 5PX; | |||||
color: #7A7A7A; | |||||
margin-right: 5PX; | |||||
} | |||||
.active{ | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
color: #ffffff; | |||||
} | |||||
} | |||||
.nav{ | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
padding-bottom: 15PX; | |||||
.tt{ | |||||
font-size: .45rem; | |||||
color: #334281; | |||||
} | |||||
.content{ | |||||
background: #ffffff; | |||||
width: 92%; | |||||
margin: 0 auto; | |||||
box-shadow: 0px 0px 10PX rgba(0,0,0,0.1); | |||||
border-radius: 25PX; | |||||
padding: 1.5vh 4%; | |||||
} | |||||
/deep/ .van-cell{ | |||||
padding: 0; | |||||
margin-bottom: 10PX; | |||||
&:last-child{ | |||||
margin: 0; | |||||
} | |||||
} | |||||
} | |||||
/* 内容 */ | |||||
.main{ | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
background-size: 100% 20PX; | |||||
background-repeat: no-repeat; | |||||
/deep/ .van-tabs__nav{ | |||||
border-top-left-radius: 25PX; | |||||
border-top-right-radius: 25PX; | |||||
overflow: hidden; | |||||
background: #f9f9f9; | |||||
} | |||||
/deep/ .van-tabs__line{ | |||||
background: #334281!important; | |||||
} | |||||
/deep/ .van-tab--active{ | |||||
color: #334281; | |||||
} | |||||
/deep/ .van-tabs__content{ | |||||
background: #f9f9f9; | |||||
padding-top: 2vh; | |||||
} | |||||
.search{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
width: 92%; | |||||
margin: 0PX auto; | |||||
border: 1px solid #6E93F3; | |||||
padding: 1PX 1PX 1PX 12PX ; | |||||
border-radius: 50PX; | |||||
input{ | |||||
flex: 1; | |||||
background: transparent; | |||||
margin-left: 10PX; | |||||
} | |||||
} | |||||
.content{ | |||||
width: 92%; | |||||
margin: 0 auto; | |||||
margin-top: 2vh; | |||||
.content_tt{ | |||||
font-size: .35rem; | |||||
} | |||||
.content_con{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
margin-top: 1.5vh; | |||||
.content_con_left{ | |||||
display: flex; | |||||
flex-direction:column; | |||||
justify-content: space-between; | |||||
p{ | |||||
font-size: .35rem; | |||||
padding-left: 18PX; | |||||
&:nth-child(1){ | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_project.png") no-repeat left center; | |||||
} | |||||
&:nth-child(2){ | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_name.png") no-repeat left center; | |||||
} | |||||
&:nth-child(3){ | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_iphone.png") no-repeat left center; | |||||
} | |||||
} | |||||
} | |||||
.content_con_right{ | |||||
display: flex; | |||||
justify-content: end; | |||||
align-items: center; | |||||
img{ | |||||
border-radius: 10PX; | |||||
width: 40%; | |||||
margin-left: 5%; | |||||
box-shadow: 0px 5PX 10PX rgba(0,0,0,0.2); | |||||
&:last-child{ | |||||
width: auto; | |||||
box-shadow: none; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
} | |||||
.main_content_right_list{ | |||||
margin: 0 auto; | |||||
margin-bottom: 2vh; | |||||
width: 92%; | |||||
background: #ffffff; | |||||
padding: 15PX 3%; | |||||
border-radius: 10Px; | |||||
box-shadow: 0px 5PX 10PX rgba(0,0,0,0.1); | |||||
text-align: center; | |||||
/deep/ .van-cell{ | |||||
padding: 0; | |||||
margin-bottom: 10PX; | |||||
&:last-child{ | |||||
margin: 0; | |||||
} | |||||
} | |||||
.main_content{ | |||||
font-size: .35rem; | |||||
line-height: .7rem; | |||||
margin-top: 10PX; | |||||
text-align: left; | |||||
} | |||||
.main_tit{ | |||||
color: #4E7FFF; | |||||
font-size: .38rem; | |||||
display: flex; | |||||
align-items: center; | |||||
i{ | |||||
display: block; | |||||
width: 16PX; | |||||
height: 16PX; | |||||
margin-right: 5PX; | |||||
flex-shrink: 0; | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/shop_needs_icon01.png"); | |||||
} | |||||
p{ | |||||
display: -webkit-box; | |||||
-webkit-box-orient: vertical; | |||||
-webkit-line-clamp: 1; | |||||
word-break: break-all; | |||||
overflow: hidden; | |||||
} | |||||
span{ | |||||
font-size: .3rem; | |||||
color: #8B8B8B; | |||||
flex-shrink: 0; | |||||
} | |||||
} | |||||
.main_money{ | |||||
background: rgba(255,94,0,0.15); | |||||
display: inline-block; | |||||
padding: 5PX 15PX; | |||||
border-radius: 8PX; | |||||
margin: 10PX auto; | |||||
p{ | |||||
&:nth-child(1){ | |||||
color: #FF5E00; | |||||
font-size: .4rem; | |||||
span{ | |||||
font-size: .3rem; | |||||
} | |||||
} | |||||
&:nth-child(2){ | |||||
color: #8B8B8B; | |||||
font-size: .35rem; | |||||
} | |||||
} | |||||
span:nth-child(1){ | |||||
margin-right: 5PX; | |||||
} | |||||
} | |||||
} | |||||
.main_content_right_list2{ | |||||
margin: 0 auto; | |||||
margin-bottom: 2vh; | |||||
width: 92%; | |||||
display: flex; | |||||
justify-content: space-between; | |||||
div{ | |||||
box-shadow: 0px 5PX 10PX rgba(0,0,0,0.1); | |||||
width: 48%; | |||||
background: #ffffff; | |||||
text-align: center; | |||||
padding: 10PX 0; | |||||
border-radius: 10Px; | |||||
p{ | |||||
&:nth-child(1){ | |||||
font-size: .38rem; | |||||
color: #8B8B8B; | |||||
} | |||||
&:nth-child(2){ | |||||
font-size: .4rem; | |||||
color: #4E7FFF; | |||||
margin-top: 10PX; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
} | |||||
</style> |
@@ -75,11 +75,31 @@ | |||||
<!-- 内容开始 --> | <!-- 内容开始 --> | ||||
<div class="main"> | <div class="main"> | ||||
<van-tabs v-model="active" sticky animated> | |||||
<van-tab title="服务中"> | |||||
<img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_add.png" style="margin: 0 auto;display: block;width: 94%;" @click="$router.push({name:'agriculturalTrusteeshipShopAdd'})"> | |||||
<div class="main_btn" v-if="serviceForm.financialType == '1'"> | |||||
<div class="btn_box_01" @click="$router.push({name:'agriculturalTrusteeshipShopAdd'})"> | |||||
<p>+</p> | |||||
<p>发布新产品</p> | |||||
</div> | |||||
<div class="btn_box_02" @click="$router.push({name:'agriculturalTrusteeshipShopNeedsList'})"> | |||||
<img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_see2.png" alt=""> | |||||
<p>查看贷款需求</p> | |||||
</div> | |||||
<!-- <img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_add2.png" style="margin: 0 auto;display: block;" @click="$router.push({name:'agriculturalTrusteeshipShopAdd'})">--> | |||||
<!-- <img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_see.png" style="margin: 0 auto;display: block;" @click="$router.push({name:'agriculturalTrusteeshipShopAdd'})">--> | |||||
</div> | |||||
<div class="main_btn" v-else> | |||||
<div class="btn_box_01" style="width: 100%;" @click="$router.push({name:'agriculturalTrusteeshipShopAdd'})"> | |||||
<p>+</p> | |||||
<p>发布新产品</p> | |||||
</div> | |||||
</div> | |||||
<van-tabs v-model="active" sticky animated> | |||||
<van-tab title="服务中"> | |||||
<van-list | <van-list | ||||
v-model="loading" | v-model="loading" | ||||
:finished="finished" | :finished="finished" | ||||
@@ -139,6 +159,7 @@ | |||||
<script> | <script> | ||||
import Cookies from "js-cookie"; | import Cookies from "js-cookie"; | ||||
import {productList, productOut, productIn, serviceGet, treeselect} from "@/api/agriculturalTrusteeship"; | import {productList, productOut, productIn, serviceGet, treeselect} from "@/api/agriculturalTrusteeship"; | ||||
import {Dialog} from "vant"; | |||||
export default { | export default { | ||||
name: "agriculturalTrusteeshipShopList", | name: "agriculturalTrusteeshipShopList", | ||||
data() { | data() { | ||||
@@ -178,7 +199,19 @@ | |||||
methods: { | methods: { | ||||
getDetail(){ | getDetail(){ | ||||
serviceGet(Cookies.get('ACCESS-SESSION-ID')).then(response => { | serviceGet(Cookies.get('ACCESS-SESSION-ID')).then(response => { | ||||
this.serviceForm = response.data; | |||||
if (response.code == 200){ | |||||
this.serviceForm = response.data; | |||||
}else{ | |||||
Dialog.confirm({ | |||||
title: '系统提示', | |||||
message: '登录状态已过期,请重新登录', | |||||
confirmButtonText: '重新登录', | |||||
cancelButtonText: '取消' | |||||
}).then(() => { | |||||
window.location.href = '/agriculturalTrusteeship/login'; | |||||
}); | |||||
} | |||||
}); | }); | ||||
}, | }, | ||||
getList(){ | getList(){ | ||||
@@ -260,6 +293,45 @@ | |||||
} | } | ||||
} | } | ||||
.main_btn{ | |||||
display: flex; | |||||
background: #ffffff; | |||||
border-top-left-radius: 25PX; | |||||
border-top-right-radius: 25PX; | |||||
overflow: hidden; | |||||
padding: 4vw 4% 0; | |||||
justify-content: space-between; | |||||
.btn_box_01{ | |||||
width: 48%; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
border: 1Px dashed #4E7FFF; | |||||
color: #4E7FFF; | |||||
font-size: .35rem; | |||||
line-height: 15vw; | |||||
border-radius: 10Px; | |||||
p:first-child{ | |||||
font-weight: bold; | |||||
margin-right: 5PX; | |||||
} | |||||
} | |||||
.btn_box_02{ | |||||
width: 48%; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
background: rgba(78,127,255,0.17); | |||||
color: #1E49BB; | |||||
font-size: .35rem; | |||||
line-height: 15vw; | |||||
border-radius: 10Px; | |||||
p{ | |||||
margin-left: 5PX; | |||||
} | |||||
} | |||||
} | |||||
.serviceName{ | .serviceName{ | ||||
display: flex; | display: flex; | ||||
align-items: center; | align-items: center; | ||||
@@ -305,9 +377,9 @@ | |||||
.main{ | .main{ | ||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | ||||
/deep/ .van-tabs__nav{ | /deep/ .van-tabs__nav{ | ||||
border-top-left-radius: 25PX; | |||||
border-top-right-radius: 25PX; | |||||
overflow: hidden; | |||||
/*border-top-left-radius: 25PX;*/ | |||||
/*border-top-right-radius: 25PX;*/ | |||||
/*overflow: hidden;*/ | |||||
} | } | ||||
/deep/ .van-tabs__line{ | /deep/ .van-tabs__line{ | ||||
background: #334281!important; | background: #334281!important; | ||||
@@ -0,0 +1,416 @@ | |||||
<template> | |||||
<div class="home_wrapper"> | |||||
<!-- 头部开始 --> | |||||
<div class="header"> | |||||
<div class="header_left" @click="onClickLeft"> | |||||
<img src="../../../../static/images/agriculturalTrusteeship/return.png"> | |||||
<p>贷款需求</p> | |||||
</div> | |||||
<p class="header_right"> | |||||
<van-checkbox v-model="checked" checked-color="#ffffff">只显示有资金需求</van-checkbox> | |||||
</p> | |||||
</div> | |||||
<!-- 头部结束 --> | |||||
<!-- 内容开始 --> | |||||
<div class="main"> | |||||
<van-tabs v-model="active" sticky animated> | |||||
<van-tab title="服务组织(312)"> | |||||
<van-list | |||||
v-model="loading" | |||||
:finished="finished" | |||||
finished-text="没有更多了" | |||||
> | |||||
<!-- @load="getList" @load="onLoad"--> | |||||
<div class="main_content_right_list" v-for="(item,index) in 5" :key="index" @click="$router.push({name:'agriculturalTrusteeshipShopOrganizationDetail'})"> | |||||
<div class="main_tit"> | |||||
<i></i> | |||||
<p>家家加加加加加加加就爱简爱家合作社</p> | |||||
</div> | |||||
<div class="main_money"> | |||||
<p><span>¥</span>512,000.00</p> | |||||
<p>查看详情 ></p> | |||||
</div> | |||||
</div> | |||||
</van-list> | |||||
</van-tab> | |||||
<van-tab title="托管主体(201)"> | |||||
<van-list | |||||
v-model="loading" | |||||
:finished="finished" | |||||
finished-text="没有更多了" | |||||
> | |||||
<!-- @load="getList" @load="onLoad"--> | |||||
<div class="main_content_right_list" v-for="(item,index) in 5" :key="index" @click="$router.push({name:'agriculturalTrusteeshipShopDepositDetail'})"> | |||||
<div class="main_tit"> | |||||
<i></i> | |||||
<p>家家加加加加加加加就爱简爱家合作社</p> | |||||
</div> | |||||
<div class="main_money"> | |||||
<p><span>¥</span>512,000.00</p> | |||||
<p>查看详情 ></p> | |||||
</div> | |||||
</div> | |||||
</van-list> | |||||
</van-tab> | |||||
</van-tabs> | |||||
</div> | |||||
<!-- 内容结束 --> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import Cookies from "js-cookie"; | |||||
import {productList, productOut, productIn, serviceGet, treeselect} from "@/api/agriculturalTrusteeship"; | |||||
export default { | |||||
name: "agriculturalTrusteeshipShopList", | |||||
data() { | |||||
return { | |||||
activeKey: 0, | |||||
active: 0, | |||||
loading: false, | |||||
finished: false, | |||||
checked: false, | |||||
productList:[], | |||||
productListYes:[], | |||||
productListNo:[], | |||||
query:{ | |||||
financialServiceId:Cookies.get('ACCESS-SESSION-ID'), | |||||
pageNum:1, | |||||
pageSize:'10', | |||||
}, | |||||
serviceForm:{}, | |||||
deptOptions:[], | |||||
deptName:'张村', | |||||
showDeptId:false, | |||||
villageValue : '', | |||||
hcAreaInfoFieldName: { | |||||
text: "label", | |||||
value: "value", | |||||
children: "children", | |||||
}, | |||||
}; | |||||
}, | |||||
created() { | |||||
this.getDetail(); | |||||
treeselect().then(res=>{ | |||||
if (res.code == 200) { | |||||
this.deptOptions = res.data; | |||||
} | |||||
}) | |||||
}, | |||||
methods: { | |||||
getDetail(){ | |||||
serviceGet(Cookies.get('ACCESS-SESSION-ID')).then(response => { | |||||
this.serviceForm = response.data; | |||||
}); | |||||
}, | |||||
getList(){ | |||||
productList(this.query).then(response => { | |||||
response.rows.map(res=>{ | |||||
if (res.mainImg){ | |||||
let supplyMasterMap = res.mainImg.split( "," ) | |||||
res.mainImg = '/api'+supplyMasterMap[0] | |||||
} | |||||
if(res.sysYesNo == 'Y'){ | |||||
this.productListYes.push(res); | |||||
} | |||||
if(res.sysYesNo == 'N'){ | |||||
this.productListNo.push(res); | |||||
} | |||||
this.productList.push(res); | |||||
}) | |||||
if(this.productList.length >= response.total){ | |||||
this.finished = true; | |||||
return; | |||||
}else{ | |||||
this.loading = false; | |||||
this.query.pageNum += 1 ; | |||||
} | |||||
}); | |||||
}, | |||||
productIn(id){ | |||||
productIn(id).then(response => { | |||||
this.$notify({ type: 'success', message: '上架成功' }); | |||||
location.reload() | |||||
}); | |||||
}, | |||||
productOut(id){ | |||||
productOut(id).then(response => { | |||||
this.$notify({ type: 'success', message: '下架成功' }); | |||||
location.reload() | |||||
}); | |||||
}, | |||||
//选择案件属地 | |||||
onConfirmDept({ selectedOptions }){ | |||||
this.query.deptId = selectedOptions[selectedOptions.length-1].value; | |||||
this.deptName = selectedOptions[selectedOptions.length-1].label; | |||||
this.showDeptId = false | |||||
this.productListYes = []; | |||||
this.productListNo = []; | |||||
this.getList(); | |||||
}, | |||||
}, | |||||
} | |||||
</script> | |||||
<style scoped lang="scss"> | |||||
.home_wrapper{ | |||||
background: #f9f9f9; | |||||
height: 100vh; | |||||
overflow: hidden; | |||||
} | |||||
/*头部*/ | |||||
.header{ | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: space-between; | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
padding: 2vh 4% 2vh; | |||||
.header_left{ | |||||
display: flex; | |||||
align-items: center; | |||||
p{ | |||||
font-size: .4rem; | |||||
color: #ffffff; | |||||
line-height: 1; | |||||
margin-left: 10PX; | |||||
} | |||||
} | |||||
.header_right{ | |||||
font-size: .35rem; | |||||
background: #334281; | |||||
padding: 2PX 10PX; | |||||
border-radius: 50PX; | |||||
/deep/ .van-checkbox__icon--checked .van-icon{ | |||||
color: #334281; | |||||
} | |||||
/deep/ .van-checkbox__label{ | |||||
color: #ffffff; | |||||
} | |||||
/deep/ .van-checkbox__icon .van-icon{ | |||||
width: .9em; | |||||
height: .9em; | |||||
line-height: .9em; | |||||
} | |||||
/deep/ .van-icon-success::before{ | |||||
width: .9em; | |||||
height: .9em; | |||||
} | |||||
/deep/ .van-checkbox__icon{ | |||||
height: auto; | |||||
} | |||||
} | |||||
} | |||||
.main_btn{ | |||||
display: flex; | |||||
background: #ffffff; | |||||
border-top-left-radius: 25PX; | |||||
border-top-right-radius: 25PX; | |||||
overflow: hidden; | |||||
padding: 4vw 4% 0; | |||||
justify-content: space-between; | |||||
.btn_box_01{ | |||||
width: 48%; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
border: 1Px dashed #4E7FFF; | |||||
color: #4E7FFF; | |||||
font-size: .35rem; | |||||
line-height: 15vw; | |||||
border-radius: 10Px; | |||||
p:first-child{ | |||||
font-weight: bold; | |||||
margin-right: 5PX; | |||||
} | |||||
} | |||||
.btn_box_02{ | |||||
width: 48%; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
background: rgba(78,127,255,0.17); | |||||
color: #1E49BB; | |||||
font-size: .35rem; | |||||
line-height: 15vw; | |||||
border-radius: 10Px; | |||||
p{ | |||||
margin-left: 5PX; | |||||
} | |||||
} | |||||
} | |||||
.serviceName{ | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: space-between; | |||||
span{ | |||||
background: #E8E8E8; | |||||
padding: 0 8PX; | |||||
border-radius: 5PX; | |||||
color: #7A7A7A; | |||||
margin-right: 5PX; | |||||
} | |||||
.active{ | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
color: #ffffff; | |||||
} | |||||
} | |||||
.nav{ | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
padding-bottom: 15PX; | |||||
.tt{ | |||||
font-size: .45rem; | |||||
color: #334281; | |||||
} | |||||
.content{ | |||||
background: #ffffff; | |||||
width: 92%; | |||||
margin: 0 auto; | |||||
box-shadow: 0px 0px 10PX rgba(0,0,0,0.1); | |||||
border-radius: 25PX; | |||||
padding: 1.5vh 4%; | |||||
} | |||||
/deep/ .van-cell{ | |||||
padding: 0; | |||||
margin-bottom: 10PX; | |||||
&:last-child{ | |||||
margin: 0; | |||||
} | |||||
} | |||||
} | |||||
/* 内容 */ | |||||
.main{ | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
/deep/ .van-tabs__nav{ | |||||
border-top-left-radius: 25PX; | |||||
border-top-right-radius: 25PX; | |||||
overflow: hidden; | |||||
background: #f9f9f9; | |||||
} | |||||
/deep/ .van-tabs__line{ | |||||
background: #334281!important; | |||||
} | |||||
/deep/ .van-tab--active{ | |||||
color: #334281; | |||||
} | |||||
/deep/ .van-tabs__content{ | |||||
background: #f9f9f9; | |||||
padding-top: 2vh; | |||||
} | |||||
.search{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
width: 92%; | |||||
margin: 0PX auto; | |||||
border: 1px solid #6E93F3; | |||||
padding: 1PX 1PX 1PX 12PX ; | |||||
border-radius: 50PX; | |||||
input{ | |||||
flex: 1; | |||||
background: transparent; | |||||
margin-left: 10PX; | |||||
} | |||||
} | |||||
.content{ | |||||
width: 92%; | |||||
margin: 0 auto; | |||||
margin-top: 2vh; | |||||
.content_tt{ | |||||
font-size: .35rem; | |||||
} | |||||
.content_con{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
margin-top: 1.5vh; | |||||
.content_con_left{ | |||||
display: flex; | |||||
flex-direction:column; | |||||
justify-content: space-between; | |||||
p{ | |||||
font-size: .35rem; | |||||
padding-left: 18PX; | |||||
&:nth-child(1){ | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_project.png") no-repeat left center; | |||||
} | |||||
&:nth-child(2){ | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_name.png") no-repeat left center; | |||||
} | |||||
&:nth-child(3){ | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_iphone.png") no-repeat left center; | |||||
} | |||||
} | |||||
} | |||||
.content_con_right{ | |||||
display: flex; | |||||
justify-content: end; | |||||
align-items: center; | |||||
img{ | |||||
border-radius: 10PX; | |||||
width: 40%; | |||||
margin-left: 5%; | |||||
box-shadow: 0px 5PX 10PX rgba(0,0,0,0.2); | |||||
&:last-child{ | |||||
width: auto; | |||||
box-shadow: none; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
} | |||||
.main_content_right_list{ | |||||
margin: 0 auto; | |||||
margin-bottom: 2vh; | |||||
width: 92%; | |||||
background: #ffffff; | |||||
padding: 15PX 3%; | |||||
border-radius: 10Px; | |||||
box-shadow: 0px 5PX 10PX rgba(0,0,0,0.1); | |||||
.main_tit{ | |||||
font-size: .38rem; | |||||
display: flex; | |||||
align-items: center; | |||||
i{ | |||||
display: block; | |||||
width: 16PX; | |||||
height: 16PX; | |||||
margin-right: 5PX; | |||||
flex-shrink: 0; | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/shop_needs_icon.png"); | |||||
} | |||||
p{ | |||||
display: -webkit-box; | |||||
-webkit-box-orient: vertical; | |||||
-webkit-line-clamp: 1; | |||||
word-break: break-all; | |||||
overflow: hidden; | |||||
} | |||||
} | |||||
.main_money{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
margin-top: 5PX; | |||||
p{ | |||||
&:nth-child(1){ | |||||
color: #FF5E00; | |||||
font-size: .4rem; | |||||
span{ | |||||
font-size: .3rem; | |||||
} | |||||
} | |||||
&:nth-child(2){ | |||||
color: #8B8B8B; | |||||
font-size: .35rem; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
} | |||||
</style> |
@@ -0,0 +1,442 @@ | |||||
<template> | |||||
<div class="home_wrapper"> | |||||
<!-- 头部开始 --> | |||||
<div class="header"> | |||||
<div class="header_left" @click="onClickLeft"> | |||||
<img src="../../../../static/images/agriculturalTrusteeship/return.png"> | |||||
<p>需求详情</p> | |||||
</div> | |||||
</div> | |||||
<!-- 头部结束 --> | |||||
<!-- 内容开始 --> | |||||
<div class="main"> | |||||
<div class="main_content_right_list"> | |||||
<div class="main_tit"> | |||||
<i></i> | |||||
<p>家家加加加加加加加就爱简爱家合作社</p> | |||||
</div> | |||||
<p class="main_content">村口需要水牛石头诚招水牛贷款联系电话165822本人人品优良绝不拖欠还款。</p> | |||||
<div class="main_money"> | |||||
<p><span>需求金额</span><span>¥</span>512,000.00</p> | |||||
</div> | |||||
<van-divider /> | |||||
<van-field | |||||
readonly | |||||
label="负责人" | |||||
input-align="right" | |||||
:border="false" | |||||
placeholder="负责人" | |||||
/> | |||||
<van-field | |||||
readonly | |||||
label="联系方式" | |||||
input-align="right" | |||||
:border="false" | |||||
placeholder="联系方式" | |||||
/> | |||||
<van-field | |||||
readonly | |||||
label="地址" | |||||
input-align="right" | |||||
:border="false" | |||||
placeholder="地址" | |||||
/> | |||||
</div> | |||||
<div class="main_content_right_list2" v-for="(item,index) in 5" :key="index" @click="$router.push({name:'agriculturalTrusteeshipShopNeedsList'})"> | |||||
<div class="main_tit"> | |||||
<p>家家加加加加加加加就爱简爱家合作社</p> | |||||
<span>(1/10)</span> | |||||
</div> | |||||
<div class="main_content"> | |||||
<p>玉米</p> | |||||
<p>32022亩</p> | |||||
</div> | |||||
<div class="main_money"> | |||||
<p><i></i>丰田村</p> | |||||
<p><i></i>2023.03.15-2024.09.15</p> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
<!-- 内容结束 --> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import Cookies from "js-cookie"; | |||||
import {productList, productOut, productIn, serviceGet, treeselect} from "@/api/agriculturalTrusteeship"; | |||||
export default { | |||||
name: "shopOrganizationDetail", | |||||
data() { | |||||
return { | |||||
}; | |||||
}, | |||||
created() { | |||||
}, | |||||
methods: { | |||||
}, | |||||
} | |||||
</script> | |||||
<style scoped lang="scss"> | |||||
.home_wrapper{ | |||||
background: #f9f9f9; | |||||
height: 100vh; | |||||
overflow: hidden; | |||||
} | |||||
/*头部*/ | |||||
.header{ | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: space-between; | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
padding: 2vh 4% 2vh; | |||||
.header_left{ | |||||
display: flex; | |||||
align-items: center; | |||||
p{ | |||||
font-size: .4rem; | |||||
color: #ffffff; | |||||
line-height: 1; | |||||
margin-left: 10PX; | |||||
} | |||||
} | |||||
.header_right{ | |||||
font-size: .35rem; | |||||
background: #334281; | |||||
padding: 2PX 10PX; | |||||
border-radius: 50PX; | |||||
/deep/ .van-checkbox__icon--checked .van-icon{ | |||||
color: #334281; | |||||
} | |||||
/deep/ .van-checkbox__label{ | |||||
color: #ffffff; | |||||
} | |||||
/deep/ .van-checkbox__icon .van-icon{ | |||||
width: .9em; | |||||
height: .9em; | |||||
line-height: .9em; | |||||
} | |||||
/deep/ .van-icon-success::before{ | |||||
width: .9em; | |||||
height: .9em; | |||||
} | |||||
/deep/ .van-checkbox__icon{ | |||||
height: auto; | |||||
} | |||||
} | |||||
} | |||||
.main_btn{ | |||||
display: flex; | |||||
background: #ffffff; | |||||
border-top-left-radius: 25PX; | |||||
border-top-right-radius: 25PX; | |||||
overflow: hidden; | |||||
padding: 4vw 4% 0; | |||||
justify-content: space-between; | |||||
.btn_box_01{ | |||||
width: 48%; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
border: 1Px dashed #4E7FFF; | |||||
color: #4E7FFF; | |||||
font-size: .35rem; | |||||
line-height: 15vw; | |||||
border-radius: 10Px; | |||||
p:first-child{ | |||||
font-weight: bold; | |||||
margin-right: 5PX; | |||||
} | |||||
} | |||||
.btn_box_02{ | |||||
width: 48%; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
background: rgba(78,127,255,0.17); | |||||
color: #1E49BB; | |||||
font-size: .35rem; | |||||
line-height: 15vw; | |||||
border-radius: 10Px; | |||||
p{ | |||||
margin-left: 5PX; | |||||
} | |||||
} | |||||
} | |||||
.serviceName{ | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: space-between; | |||||
span{ | |||||
background: #E8E8E8; | |||||
padding: 0 8PX; | |||||
border-radius: 5PX; | |||||
color: #7A7A7A; | |||||
margin-right: 5PX; | |||||
} | |||||
.active{ | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
color: #ffffff; | |||||
} | |||||
} | |||||
.nav{ | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
padding-bottom: 15PX; | |||||
.tt{ | |||||
font-size: .45rem; | |||||
color: #334281; | |||||
} | |||||
.content{ | |||||
background: #ffffff; | |||||
width: 92%; | |||||
margin: 0 auto; | |||||
box-shadow: 0px 0px 10PX rgba(0,0,0,0.1); | |||||
border-radius: 25PX; | |||||
padding: 1.5vh 4%; | |||||
} | |||||
/deep/ .van-cell{ | |||||
padding: 0; | |||||
margin-bottom: 10PX; | |||||
&:last-child{ | |||||
margin: 0; | |||||
} | |||||
} | |||||
} | |||||
/* 内容 */ | |||||
.main{ | |||||
background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4); | |||||
background-size: 100% 20PX; | |||||
background-repeat: no-repeat; | |||||
/deep/ .van-tabs__nav{ | |||||
border-top-left-radius: 25PX; | |||||
border-top-right-radius: 25PX; | |||||
overflow: hidden; | |||||
background: #f9f9f9; | |||||
} | |||||
/deep/ .van-tabs__line{ | |||||
background: #334281!important; | |||||
} | |||||
/deep/ .van-tab--active{ | |||||
color: #334281; | |||||
} | |||||
/deep/ .van-tabs__content{ | |||||
background: #f9f9f9; | |||||
padding-top: 2vh; | |||||
} | |||||
.search{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
width: 92%; | |||||
margin: 0PX auto; | |||||
border: 1px solid #6E93F3; | |||||
padding: 1PX 1PX 1PX 12PX ; | |||||
border-radius: 50PX; | |||||
input{ | |||||
flex: 1; | |||||
background: transparent; | |||||
margin-left: 10PX; | |||||
} | |||||
} | |||||
.content{ | |||||
width: 92%; | |||||
margin: 0 auto; | |||||
margin-top: 2vh; | |||||
.content_tt{ | |||||
font-size: .35rem; | |||||
} | |||||
.content_con{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
margin-top: 1.5vh; | |||||
.content_con_left{ | |||||
display: flex; | |||||
flex-direction:column; | |||||
justify-content: space-between; | |||||
p{ | |||||
font-size: .35rem; | |||||
padding-left: 18PX; | |||||
&:nth-child(1){ | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_project.png") no-repeat left center; | |||||
} | |||||
&:nth-child(2){ | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_name.png") no-repeat left center; | |||||
} | |||||
&:nth-child(3){ | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_iphone.png") no-repeat left center; | |||||
} | |||||
} | |||||
} | |||||
.content_con_right{ | |||||
display: flex; | |||||
justify-content: end; | |||||
align-items: center; | |||||
img{ | |||||
border-radius: 10PX; | |||||
width: 40%; | |||||
margin-left: 5%; | |||||
box-shadow: 0px 5PX 10PX rgba(0,0,0,0.2); | |||||
&:last-child{ | |||||
width: auto; | |||||
box-shadow: none; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
} | |||||
.main_content_right_list{ | |||||
margin: 0 auto; | |||||
margin-bottom: 2vh; | |||||
width: 92%; | |||||
background: #ffffff; | |||||
padding: 15PX 3%; | |||||
border-radius: 10Px; | |||||
box-shadow: 0px 5PX 10PX rgba(0,0,0,0.1); | |||||
text-align: center; | |||||
/deep/ .van-cell{ | |||||
padding: 0; | |||||
margin-bottom: 10PX; | |||||
&:last-child{ | |||||
margin: 0; | |||||
} | |||||
} | |||||
.main_content{ | |||||
font-size: .35rem; | |||||
line-height: .7rem; | |||||
margin-top: 10PX; | |||||
text-align: left; | |||||
} | |||||
.main_tit{ | |||||
color: #4E7FFF; | |||||
font-size: .38rem; | |||||
display: flex; | |||||
align-items: center; | |||||
i{ | |||||
display: block; | |||||
width: 16PX; | |||||
height: 16PX; | |||||
margin-right: 5PX; | |||||
flex-shrink: 0; | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/shop_needs_icon01.png"); | |||||
} | |||||
p{ | |||||
display: -webkit-box; | |||||
-webkit-box-orient: vertical; | |||||
-webkit-line-clamp: 1; | |||||
word-break: break-all; | |||||
overflow: hidden; | |||||
} | |||||
span{ | |||||
font-size: .3rem; | |||||
color: #8B8B8B; | |||||
flex-shrink: 0; | |||||
} | |||||
} | |||||
.main_money{ | |||||
background: rgba(255,94,0,0.15); | |||||
display: inline-block; | |||||
padding: 5PX 15PX; | |||||
border-radius: 8PX; | |||||
margin: 10PX auto; | |||||
p{ | |||||
&:nth-child(1){ | |||||
color: #FF5E00; | |||||
font-size: .4rem; | |||||
span{ | |||||
font-size: .3rem; | |||||
} | |||||
} | |||||
&:nth-child(2){ | |||||
color: #8B8B8B; | |||||
font-size: .35rem; | |||||
} | |||||
} | |||||
span:nth-child(1){ | |||||
margin-right: 5PX; | |||||
} | |||||
} | |||||
} | |||||
.main_content_right_list2{ | |||||
margin: 0 auto; | |||||
margin-bottom: 2vh; | |||||
width: 92%; | |||||
background: #ffffff; | |||||
padding: 15PX 3%; | |||||
border-radius: 10Px; | |||||
box-shadow: 0px 5PX 10PX rgba(0,0,0,0.1); | |||||
.main_tit{ | |||||
font-size: .38rem; | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: space-between; | |||||
p{ | |||||
display: -webkit-box; | |||||
-webkit-box-orient: vertical; | |||||
-webkit-line-clamp: 1; | |||||
word-break: break-all; | |||||
overflow: hidden; | |||||
} | |||||
span{ | |||||
font-size: .3rem; | |||||
color: #8B8B8B; | |||||
flex-shrink: 0; | |||||
} | |||||
} | |||||
.main_money{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
margin-top: 10PX; | |||||
p{ | |||||
font-size: .35rem; | |||||
color: #8B8B8B; | |||||
display: flex; | |||||
align-items: center; | |||||
&:nth-child(1){ | |||||
i{ | |||||
display: inline-block; | |||||
width: 11PX; | |||||
height: 13Px; | |||||
margin-right: 2PX; | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/shop_needs_icon02.png"); | |||||
} | |||||
} | |||||
&:nth-child(2){ | |||||
i{ | |||||
display: inline-block; | |||||
width: 13PX; | |||||
height: 13Px; | |||||
margin-right: 2PX; | |||||
background: url("../../../../static/images/agriculturalTrusteeship/insurance/shop_needs_icon03.png"); | |||||
} | |||||
} | |||||
} | |||||
} | |||||
.main_content{ | |||||
font-size: .35rem; | |||||
line-height: .6rem; | |||||
margin-top: 10PX; | |||||
display: flex; | |||||
justify-content: space-between; | |||||
p{ | |||||
color: #4E7FFF; | |||||
&:nth-child(1){ | |||||
background: rgba(78,127,255,0.13); | |||||
padding: 0 15PX; | |||||
border-radius: 5PX; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
} | |||||
</style> |