581 lines
14 KiB
Vue
581 lines
14 KiB
Vue
<template>
|
||
<div class="find">
|
||
<!-- find -->
|
||
|
||
<view class="page">
|
||
<view class="page-head">
|
||
<view class="row top">
|
||
<view class="pri-quo-view">
|
||
<!-- <view class="start-block"></view> -->
|
||
<p class="pri-quo-type-text">价格行情</p>
|
||
</view>
|
||
<p class="updataTime">{{ updateTime }}</p>
|
||
</view>
|
||
<view class="row pri-quo-types">
|
||
<navigator class="type navigator" v-for="(item, index) in priQuoTy" :key="index"
|
||
:url="'/pages/find/price/index?prodCat=' + item.prodCat">
|
||
<image class="img" :src="item.image"></image>
|
||
<view class="navigator-text">{{ item.name }}</view>
|
||
</navigator>
|
||
</view>
|
||
</view>
|
||
<view class="page-body">
|
||
<!-- <view class="f-title">
|
||
政策资讯
|
||
</view>
|
||
<view class="list">
|
||
<view class="item" v-for="(item,index) in policyPublishList" :key="index"
|
||
@click="$pageTo(`/pages/find/policyInformation/policyForDetails?id=${item.id}`)">
|
||
<image src="../../static/images/find/b5.png" mode="aspectFill"></image>
|
||
<view class="title">
|
||
{{item.policyTitle.substring(0, 30) }}
|
||
<block v-if="item.policyTitle.length>20">...</block>
|
||
</view>
|
||
<view class="name">
|
||
来源:{{item.policySource}}
|
||
</view>
|
||
</view>
|
||
</view> -->
|
||
<block v-if="isPolicyPublish === true">
|
||
<navigator class="pol-inf-list" :url="'/pages/find/policyInformation/policyForDetails?id=' +
|
||
policyItem.id
|
||
" v-for="(policyItem, policyIndex) in policyPublishList" :key="policyIndex">
|
||
<view class="box">
|
||
<image :src="policyInformation[policyIndex % 4].image" />
|
||
<view class="navigator-text">
|
||
<navigator url="#" class="navigator-text pol-title">
|
||
{{ policyItem.policyTitle }}
|
||
</navigator>
|
||
<navigator url="#" class="navigator-text pol-source">
|
||
来源:{{ returnDict("policy_type", policyItem.policyType) }}
|
||
</navigator>
|
||
</view>
|
||
</view>
|
||
</navigator>
|
||
</block>
|
||
<block v-else>
|
||
<navigator class="pol-inf-list" url="#" v-for="(item, index) in policyInformation" :key="index">
|
||
<view class="box">
|
||
<image :src="item.image" />
|
||
<view class="navigator-text">
|
||
<navigator url="#" class="navigator-text pol-title">
|
||
{{ item.policyTitle }}
|
||
</navigator>
|
||
<navigator url="#" class="navigator-text pol-source">
|
||
来源:{{ item.policySource }}
|
||
</navigator>
|
||
</view>
|
||
</view>
|
||
</navigator>
|
||
</block>
|
||
</view>
|
||
<!-- <view width="100vw" height="50px"></view> -->
|
||
</view>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { listPolicyPublish } from "@/api/lef/policyPublish";
|
||
import {
|
||
listProduct,
|
||
getProduct,
|
||
delProduct,
|
||
addProduct,
|
||
updateProduct,
|
||
listProductCat,
|
||
} from "@/api/xinfadiProduct/product";
|
||
|
||
export default {
|
||
name: "find",
|
||
components: {},
|
||
props: {},
|
||
data() {
|
||
return {
|
||
isPolicyPublish: false,
|
||
policyPublishList: [],
|
||
queryParams: {
|
||
params: {
|
||
showTotal: 8,
|
||
},
|
||
},
|
||
priQuoTy: [
|
||
{
|
||
id: "5",
|
||
name: "全部",
|
||
page: "morePriQuoTy",
|
||
image: "../../static/images/find/fx0.png",
|
||
},
|
||
{
|
||
id: "2",
|
||
name: "蔬菜",
|
||
page: "vagetablePriQuo",
|
||
image: "../../static/images/find/fx1.png",
|
||
},
|
||
{
|
||
id: "1",
|
||
name: "水果",
|
||
page: "fruitPriQuo",
|
||
image: "../../static/images/find/fx2.png",
|
||
},
|
||
{
|
||
id: "3",
|
||
name: "水产",
|
||
page: "fisheriesPriQuo",
|
||
image: "../../static/images/find/fx3.png",
|
||
},
|
||
{
|
||
id: "4",
|
||
name: "肉蛋",
|
||
page: "meAnEgPriQuo",
|
||
image: "../../static/images/find/fx4.png",
|
||
},
|
||
],
|
||
policyInformation: [
|
||
{
|
||
id: "1",
|
||
policyTitle: "100万贴息，如何撬动5000多万元贷款。",
|
||
policySource: "农民日报",
|
||
image: "../../static/images/find/xvYTmT.jpg",
|
||
url: "",
|
||
},
|
||
{
|
||
id: "2",
|
||
policyTitle: "社会资本投资农业农村有哪些重点领头羊项目，",
|
||
policySource: "微观三农",
|
||
image: "../../static/images/index/xvY4lq.jpg",
|
||
},
|
||
{
|
||
id: "3",
|
||
policyTitle: "农业农村部部署2020年计划财务工作",
|
||
policySource: "农业农村部新闻办公室",
|
||
image: "../../static/images/find/zpz7dS.jpg",
|
||
},
|
||
{
|
||
id: "4",
|
||
policyTitle:
|
||
"宜昌市农资和农产品生产经营主体信用等级分类监管办法（试行）政策解读",
|
||
policySource: "农民日报",
|
||
image: "../../static/images/index/xvY70U.jpg",
|
||
},
|
||
],
|
||
updateTime: "2022-08-30",
|
||
listProductCat: [],
|
||
dictTypes: ["policy_type"],
|
||
dicts: {},
|
||
};
|
||
},
|
||
computed: {},
|
||
methods: {
|
||
// 路由失败提示
|
||
showToast(e) {
|
||
this.$modal.showToast("模块建设中~");
|
||
},
|
||
// 前往政策文章页面
|
||
toPolicy(policyItem) {
|
||
this.$tab.navigateTo(
|
||
"/pages/find/policyInformation/policyForDetails?id=" + policyItem.id
|
||
);
|
||
},
|
||
// 查询政策列表
|
||
getList() {
|
||
listPolicyPublish(this.queryParams)
|
||
.then((response) => {
|
||
const rows = response.rows;
|
||
rows.forEach((element, index) => {
|
||
this.policyPublishList = element.list;
|
||
if (this.policyPublishList.length > 0) {
|
||
this.isPolicyPublish = true;
|
||
}
|
||
this.total = element.total;
|
||
this.$emit("update:reTotal", this.total);
|
||
});
|
||
this.status =
|
||
this.total > this.queryParams.params.showTotal ? "more" : "noMore";
|
||
})
|
||
.catch((err) => {
|
||
// console.error(err);
|
||
});
|
||
},
|
||
/**
|
||
* 获取种类
|
||
*/
|
||
getProductCat() {
|
||
listProductCat().then((response) => {
|
||
if (response.code == 200) {
|
||
this.listProductCat = response.data;
|
||
}
|
||
response.data.forEach((dataElement) => {
|
||
this.priQuoTy.forEach((priItem, priIndex) => {
|
||
const f = new RegExp(dataElement);
|
||
const e = new RegExp(priItem.name);
|
||
const arr = priItem.name.split("");
|
||
let testJudStr = "";
|
||
let judStr = "";
|
||
for (let charIndex = 0; charIndex < arr.length; charIndex++) {
|
||
const element = arr[charIndex];
|
||
testJudStr += "[" + element + "]+";
|
||
if (charIndex === 0) {
|
||
judStr = "[^w|w]{0,}[" + element;
|
||
} else if (charIndex === arr.length - 1) {
|
||
judStr += "]+[^w|w]{0,}[" + element + "]+[^w|w]{0,}$";
|
||
} else {
|
||
judStr += "]+[^w|w]{0,}[" + element;
|
||
}
|
||
}
|
||
const JSTR = new RegExp(judStr, "g");
|
||
if (dataElement.replaceAll(JSTR, "") === "") {
|
||
this.$set(this.priQuoTy[priIndex], "prodCat", dataElement);
|
||
}
|
||
});
|
||
});
|
||
});
|
||
},
|
||
getDictList() {
|
||
this.dictTypes.forEach((element) => {
|
||
this.getDicts(element).then((res) => {
|
||
this.dicts[element] = res.data;
|
||
});
|
||
});
|
||
},
|
||
returnDict(dictType, e) {
|
||
const dictList = this.dicts;
|
||
if (dictList[dictType] !== undefined && dictList[dictType].length !== 0) {
|
||
for (let dict of dictList[dictType]) {
|
||
if (dict.dictValue === e) {
|
||
return dict.dictLabel;
|
||
}
|
||
}
|
||
}
|
||
},
|
||
// 获取当日时间
|
||
//获取当前日期函数
|
||
getNowFormatDate() {
|
||
let date = new Date(),
|
||
year = date.getFullYear(), //获取完整的年份(4位)
|
||
month = date.getMonth() + 1, //获取当前月份(0-11,0代表1月)
|
||
strDate = date.getDate() // 获取当前日(1-31)
|
||
if (month < 10) month = `0${month}` // 如果月份是个位数，在前面补0
|
||
if (strDate < 10) strDate = `0${strDate}` // 如果日是个位数，在前面补0
|
||
this.updateTime = `${year}-${month}-${strDate}`
|
||
}
|
||
},
|
||
watch: {},
|
||
|
||
// 页面周期函数--监听页面加载
|
||
onLoad() {
|
||
this.getDictList();
|
||
this.getList();
|
||
this.getProductCat();
|
||
this.getNowFormatDate()
|
||
},
|
||
// 页面周期函数--监听页面初次渲染完成
|
||
onReady() { },
|
||
// 页面周期函数--监听页面显示(not-nvue)
|
||
onShow() { },
|
||
// 页面周期函数--监听页面隐藏
|
||
onHide() { },
|
||
// 页面周期函数--监听页面卸载
|
||
onUnload() { },
|
||
onBackPress(event) {
|
||
return true
|
||
},
|
||
// 页面处理函数--监听用户下拉动作
|
||
// onPullDownRefresh() { uni.stopPullDownRefresh(); },
|
||
// 页面处理函数--监听用户上拉触底
|
||
// onReachBottom() {},
|
||
// 页面处理函数--监听页面滚动(not-nvue)
|
||
// onPageScroll(event) {},
|
||
// 页面处理函数--用户点击右上角分享
|
||
// onShareAppMessage(options) {},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
@import url("@/static/scss/selfStyle.scss");
|
||
/**
|
||
* 页面主要布局样式
|
||
*
|
||
*/
|
||
|
||
:not(not) {
|
||
padding: 0px;
|
||
margin: 0px;
|
||
position: relative;
|
||
}
|
||
|
||
.row {
|
||
min-width: 100%;
|
||
.img {
|
||
width: 70rpx;
|
||
height: 70rpx;
|
||
border-radius: 50%;
|
||
overflow: hidden;
|
||
}
|
||
}
|
||
|
||
.page {
|
||
min-width: 100%;
|
||
/* display: block; */
|
||
position: absolute;
|
||
padding-bottom: 50px;
|
||
}
|
||
|
||
.page-head {
|
||
width: 100vw;
|
||
min-height: 140px;
|
||
background-color: white;
|
||
padding: 15px;
|
||
margin: 0px;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.page-body {
|
||
min-width: 100%;
|
||
min-height: 100%;
|
||
// padding:30rpx;
|
||
}
|
||
|
||
/**
|
||
* 页面头部容器顶端样式
|
||
*
|
||
*/
|
||
|
||
/* 页面头部容器顶端 */
|
||
.navigator{
|
||
padding:0;
|
||
margin-top: 30rpx;
|
||
}
|
||
.navigator::before {
|
||
content: none;
|
||
}
|
||
|
||
.page-head .top {
|
||
min-height: 17px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
/* 头部顶端抬头块 */
|
||
.page-head .top .start-block {
|
||
width: 5px;
|
||
background-color: rgb(13, 211, 13);
|
||
height: 15px;
|
||
margin: 15rpx 15rpx;
|
||
float: inline-start;
|
||
display: block;
|
||
}
|
||
|
||
// .page-head .pri-quo-view {
|
||
// display: flex;
|
||
// justify-content: flex-start;
|
||
// }
|
||
|
||
/* 头部顶端p标签 */
|
||
.page-head .top p {
|
||
font-size: 14px;
|
||
color: #333;
|
||
}
|
||
|
||
/* 头部顶端价格行情 */
|
||
.page-head .top .pri-quo-type-text {
|
||
float: inline-start;
|
||
position: relative;
|
||
float: left;
|
||
margin-top: 15rpx;
|
||
}
|
||
|
||
/* 头部顶端日期 */
|
||
.page-head .top .updataTime {
|
||
margin-top: 10px;
|
||
// margin-right: 15px;
|
||
float: right;
|
||
font-size: 14px;
|
||
color: #333;
|
||
}
|
||
|
||
/**
|
||
* 价格行情类型列表样式
|
||
*
|
||
*/
|
||
|
||
/* 价格行情类型列表 */
|
||
.pri-quo-types {
|
||
top: 10px;
|
||
display: flex;
|
||
flex-direction: row;
|
||
flex-wrap: nowrap;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
/* 类型列表容器 */
|
||
.pri-quo-types .type {
|
||
width: 20%;
|
||
display: block;
|
||
position: relative;
|
||
text-align: center;
|
||
// padding: 0px;
|
||
padding-left: 0px;
|
||
padding-right: 0px;
|
||
}
|
||
|
||
/* 类型列表图片 */
|
||
.pri-quo-types image {
|
||
border-radius: 50%;
|
||
// width: 40px;
|
||
// height: 40px;
|
||
width: 11.5vw;
|
||
height: 11.5vw;
|
||
}
|
||
|
||
/* 导航容器文字内容 */
|
||
.pri-quo-types .type .navigator-text {
|
||
font-size: 12px;
|
||
color: rgb(163, 163, 163);
|
||
}
|
||
|
||
/**
|
||
* 政策列表样式
|
||
*
|
||
*/
|
||
|
||
/* 列表 */
|
||
.pol-inf-list {
|
||
width: 100vw;
|
||
aspect-ratio: 2.34/1;
|
||
margin: 10px 0px;
|
||
padding: 10px;
|
||
background-color: white;
|
||
}
|
||
|
||
/* 边距容器 */
|
||
.pol-inf-list .box {
|
||
width: 100%;
|
||
aspect-ratio: 2.34/1;
|
||
height: 42.7vw;
|
||
}
|
||
|
||
/* 绝对布局组件 */
|
||
/* .abs-view {
|
||
position: absolute;
|
||
width: 100%;
|
||
height: 100%;
|
||
} */
|
||
|
||
/* 政策图片 */
|
||
.pol-inf-list {
|
||
.box {
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
position: absolute;
|
||
}
|
||
|
||
/deep/uni-image {
|
||
background-color: #fea24f;
|
||
|
||
> {
|
||
|
||
div,
|
||
img {
|
||
// width: 100%;
|
||
// height: 100%;
|
||
background-size: cover !important;
|
||
}
|
||
}
|
||
}
|
||
|
||
uni-image>div {
|
||
background-size: cover !important;
|
||
}
|
||
}
|
||
}
|
||
|
||
/* 政策容器三代文字 */
|
||
.pol-inf-list>.box>.navigator-text {
|
||
top: 25%;
|
||
text-align: center;
|
||
}
|
||
|
||
/* 政策容器四代文字 */
|
||
.pol-inf-list>.box>.navigator-text>.navigator-text {
|
||
margin: 0px 10%;
|
||
}
|
||
|
||
/* 政策标题 */
|
||
.pol-inf-list .pol-title {
|
||
font-weight: 600;
|
||
font-size: 20px;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 1;
|
||
-webkit-box-orient: vertical;
|
||
color: #ffffff;
|
||
}
|
||
|
||
/* 政策来源 */
|
||
.pol-inf-list .pol-source {
|
||
font-size: 17px;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 1;
|
||
-webkit-box-orient: vertical;
|
||
color: #ffffff;
|
||
}
|
||
|
||
// 新版样式
|
||
.f-title {
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
}
|
||
.list {
|
||
.item {
|
||
width: 100%;
|
||
height: 295rpx;
|
||
position: relative;
|
||
margin-bottom: 20rpx;
|
||
border-radius: 30rpx;
|
||
overflow: hidden;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
text-align: center;
|
||
padding: 50rpx 70rpx;
|
||
box-sizing: border-box;
|
||
|
||
image {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
z-index: 1;
|
||
}
|
||
|
||
.title {
|
||
font-weight: 600;
|
||
font-size: 30rpx;
|
||
color: #fff;
|
||
line-height: 40rpx;
|
||
z-index: 999;
|
||
position: relative;
|
||
}
|
||
|
||
.name {
|
||
margin-top: 30rpx;
|
||
height: 40rpx;
|
||
line-height: 40rpx;
|
||
color: #fff;
|
||
z-index: 999;
|
||
position: relative;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
</style>
|