完善前端页面

pages.json

@@ -229,6 +229,18 @@
 			"style": {
 				"navigationBarTitleText": "企业详情"
 			}
+		},
+		{
+			"path": "pages/metrics/projectPage/index",
+			"style": {
+				"navigationBarTitleText": "工业投资项目"
+			}
+		},
+		{
+			"path": "pages/metrics/projectPage/detail",
+			"style": {
+				"navigationBarTitleText": "项目详情"
+			}
 		}
 	],
 	"globalStyle": {

pages/enterprise/enterprise_detail.vue

@@ -30,25 +30,11 @@
         <view v-for="(item, idx) in model.item" :key="idx" class="term">
           <view class="term-name">{{ item.name }}:</view>
           <view class="term-value-group" v-if="item.name !== '网址'">
-            <p
-              v-for="(value, idx) in item.value"
-              :key="idx"
-              class="term-value-item"
-              :class="{ blue: item.name == '电话' }"
-              @click="callphone"
-            >
+            <p v-for="(value, idx) in item.value" :key="idx" class="term-value-item"  :class="{ blue: item.name == '电话' }" @click="callphone">
               {{ value || "-" }}
             </p>
           </view>
-          <view
-            class="term-value-group"
-            v-else
-            style="
-              flex-direction: row;
-              align-items: center;
-              padding-left: 20rpx;
-            "
-          >
+          <view class="term-value-group" v-else  style="flex-direction: row;align-items: center;padding-left: 20rpx;">
             <view class="flex_i">
               <view>
                 {{ item.value[0] || "-" }}

pages/metrics/index.vue

@@ -47,7 +47,7 @@
 		
 		<qiun-title-bar title="工业投资" style="border-top:10rpx solid #f2f2f2" />
 		<view class="block-box display-around items-center">
-			 <view class="block-box-content" style="width:30%;background-color:#F2CD4F;">
+			 <view class="block-box-content" style="width:30%;background-color:#F2CD4F;" @click="goProject()">
 				 <view>在库项目</view>
 				 <view>18</view>
 			 </view>
@@ -222,6 +222,11 @@
 			  uni.navigateTo({
 			  	url:'./largeScale/index'
 			  })
+		  },
+		  goProject(){
+			  uni.navigateTo({
+			  	url:'./projectPage/index'
+			  })
 		  }
 	  }
 	};

pages/metrics/largeScale/detail.vue

@@ -1,8 +1,193 @@
 <template>
+	<view class="content-box">
+		<view class="title">
+		  <view class="logo">
+		    <!-- <image :src="globalUrl + company.pic_url" alt="" class="logo-img" mode="aspectFit"/> -->
+			<image src="/static/nodata.svg" alt="" class="logo-img" mode="aspectFit"/>
+		  </view>
+		  <view class="name">
+		    {{ company.name || '测试名称'}}
+		  </view>
+		</view>
+		<view class="uni-list title-date-box">
+			<view class="uni-list-cell">
+				<view class="uni-list-cell-db display-flex-start">
+					<picker mode="date" fields="year"  @change="bindDateChange" class="picker-class">
+						<view class="uni-input display-between items-center">{{dateYear}}年<image src="/static/arrow_down.svg" mode="aspectFit"></image></view>
+					</picker>
+					<picker :range="arrayMonth" :value="dateMonth"  @change="bindDateMonthChange" class="picker-class">
+						<view class="uni-input display-between items-center" style="color: #707070;">{{dateMonth}}<image src="/static/calendar_icon.svg" mode="aspectFit"></image></view>
+					</picker>
+				</view>
+			</view>
+		</view>
+		<qiun-title-bar title="工业产值(亿元)"/>
+		<view class="charts-box">
+		    <qiun-data-charts  type="line"  :chartData="chartData" background="#4C4C4C"/>
+		</view>
+		
+		<view class="item-list">
+		  <view v-for="(item, idx) in itemList" :key="idx" class="term">
+		    <view class="term-name">{{ item.name }}:</view>
+		    <view class="term-value-group" >
+		      <p  class="term-value-item">{{ item.value || "-" }}</p>
+		    </view>
+		</view>
+		</view>
+	</view>
 </template>
 
 <script>
+	export default {
+	  data() {
+		  return{
+			  dateYear:new Date().getFullYear(),
+			  dateMonth:new Date().getMonth() + 1 + '月',
+			  arrayMonth:["1月", "2月","3月", "4月","5月", "6月","7月", "8月","9月", "10月","11月", "12月"],
+			  chartData:{
+				  "categories": ["1月", "2月","3月", "4月","5月", "6月","7月", "8月","9月", "10月","11月", "12月"],
+				  "series": [
+						{name: "本年度",data: [15,10,16,23,21,36,25,7,18,29,33,12]},
+					]
+			  },
+			  itemList: [
+			    {
+			      name: "法定代表人",
+			      value: '马须伦',
+			    },
+			    {
+			      name: "成立日期",
+			      value: '2017.11.14',
+			    },
+			    {
+			      name: "注册资本",
+			      value: '1,776,759.3',
+			    },
+			    {
+			      name: "规上工业企业",
+			      value: '是',
+			    },
+			    {
+			      name: "先进制造业",
+			      value: '否',
+			    },
+			    {
+			      name: "亩均排序",
+			      value: 'A',
+			    },
+			    {
+			      name: "规上评定时间",
+			      value: '2021.01.01',
+			    },
+			    {
+			      name: "经营地址",
+			      value: '万联大道以东,宣平大街以北',
+			    },
+			    {
+			      name: "累计研发投入费用",
+			      value: '-',
+			    },
+			    {
+			      name: "本年度生产总值",
+			      value: '-',
+			    },
+				{
+				  name: "本年度工业产值增速",
+				  value: '-',
+				},
+			  ],
+		 }
+	  },
+	  onLoad(option) {
+	  	console.log(option.id)
+	  },
+	  methods:{
+		  bindDateChange(e){
+			   this.dateYear = e.target.value
+		  },
+		  bindDateMonthChange(e){
+			   this.dateMonth = this.arrayMonth[e.target.value]
+		  },
+	  }
+	};
 </script>
 
-<style>
+<style lang="scss">
+	.content-box {
+		display: flex;
+		flex-direction: column;
+		flex: 1;
+	}
+	.charts-box-title{
+		width: 100%;
+		height: 100rpx;
+	}
+	.charts-box {
+		width: 100%;
+		height: 600rpx;
+	}
+	.title-date-box {
+		margin-top: 10px;
+		border-bottom: 1px solid #d7d7d7;
+		padding-bottom: 10px;
+	}
+	.picker-class {
+		border-radius: 10rpx;
+		padding: 10rpx;
+		width: 180rpx;
+		font-size: 28rpx;
+		background: #f5f5f5;
+		margin-left: 20rpx;
+	}
+	.picker-class image {
+		width: 26rpx;
+		height: 26rpx;
+	}
+	.title {
+	  display: flex;
+	  align-items: center;
+	  .logo {
+	    margin-right: 30rpx;
+	    display: flex;
+	    justify-content: center;
+	    align-items: center;
+	    overflow: hidden;
+	    width: 150rpx;
+	    height: 100rpx;
+	    overflow: hidden;
+	    .logo-img {
+	      max-width: 100%;
+	      max-height: 100%;
+	    }
+	  }
+	}
+	.item-list {
+	  margin-left: 20rpx;
+	  display: flex;
+	  flex-direction: column;
+	  .term {
+	    display: flex;
+	    .term-name {
+	      font-size: 28rpx;
+	      width: 30%;
+	      display: flex;
+	      margin: 20rpx;
+	      color: #7f7f7f;
+	    }
+	    .term-value-group {
+	      flex: 1;
+	      display: flex;
+	      flex-direction: column;
+	      font-size: 28rpx;
+	      .term-value-item {
+	        margin: 20rpx;
+	      }
+	      .flex_i {
+	        display: flex;
+	        flex-flow: row;
+	        justify-content: space-around;
+	      }
+	    }
+	  }
+	}
 </style>

pages/metrics/largeScale/index.vue

@@ -13,15 +13,16 @@
 		
 		<view class="companys">
 		  <!-- <view>推荐企业</view> -->
-		  <view  v-for="(company, index) in companyList" :key="index" @tap="toDetail(company.id)" class="company">
+		  <view  v-for="(company, index) in companyList" :key="index" @click="toDetail(company.id)" class="company">
 			<image src="/static/selfCenter/add-icon.png" mode="aspectFit" class="addIcon"></image> 
 		    <view class="title">
 		      <view class="logo">
 		        <!-- <image :src="globalUrl + company.pic_url" alt="" class="logo-img" mode="aspectFit"/> -->
 				<image src="/static/nodata.svg" alt="" class="logo-img" mode="aspectFit"/>
 		      </view>
-		      <view class="name">
-		        {{ company.name }}
+		      <view class="name display-around-column" style="align-items: flex-start;">
+		         <view>{{ company.name }}</view>
+				 <view class="isAdvanced" v-show="index === 0">先进制造业</view>
 		      </view>
 		    </view>
 		    <view class="info">
@@ -58,7 +59,7 @@
 	  data() {
 		  return{
 			  arraySort:['全部','一至当月产值','当月产值','一至当月产值增速','当月产值增速','亩均排序'],
-			  sortSelect:'全部',
+			  sortSelect:'一至当月产值',
 			  companyList: [],
 			  globalUrl:getApp().globalData.shareUrl,
 		 }
@@ -70,9 +71,10 @@
 		  bindSortChange(e){
 			  this.sortSelect = this.arraySort[e.target.value]
 		  },
-		  goScale(){
+		  toDetail(id){
+			  console.log(id)
 			  uni.navigateTo({
-			  	url:'./largeScale/index'
+			  	url:'./detail' + '?id=' + id
 			  })
 		  },
 		  getCompany() {
@@ -153,6 +155,14 @@
 		width: 26rpx;
 		height: 26rpx;
 	}
+	.isAdvanced {
+		background-color: #F59A23;
+		color: #fff;
+		padding: 5rpx;
+		font-size: 26rpx;
+		border-radius: 5rpx;
+		margin-top: 8rpx;
+	}
 	.companys {
 	  // margin-top: 3%;
 	  padding: 0 4%;

pages/metrics/projectPage/detail.vue

@@ -0,0 +1,8 @@
+<template>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>

pages/metrics/projectPage/index.vue

@@ -0,0 +1,91 @@
+<template>
+	
+	<view class="content-box">
+		
+		<view class="policy-item-box">
+		  <view
+		    v-for="(item, idx) in policyList"
+		    :key="idx"
+		    :class="{ active: active === idx }"
+		    class="policy-item-name"
+		    @click="changePolicyTabs(idx)"
+		  >
+		    {{ item }}
+		  </view>
+		</view>
+		
+	</view>
+	
+	
+	
+	
+</template>
+
+<script>
+	import md5 from "@/common/md5.js";
+	export default {
+	  data() {
+	    return {
+	      swiperList: [],
+	      policyList: ["在库", "技改", "在谈"],
+	      active: 0,
+	      policyData: new Array(5).fill({
+	        title:"普汇中金生命科学国际合作中心",
+	        name: "普汇中金国际控股有限公司",
+	        maxMony: "160000（万元）",
+	      }),
+	    };
+	  },
+	  onLoad() {
+	  },
+	  methods: {
+	    enterPolicyDeatil(id) {
+	      uni.navigateTo({
+	        url: "/pages/policy/policy_deatil?id=" + id,
+	      });
+	    },
+	    changePolicyTabs(idx) {
+	      let that = this;
+	      that.active = idx;
+	      switch (idx) {
+	        case 0:
+	        //  that.getPolicyList("2");
+	          break;
+	        case 1:
+	        //  that.getPolicyList("3");
+	          break;
+	        case 2:
+	        //  that.getPolicyList("4");
+	          break;
+	        case 3:
+	        //  that.getPolicyList("5");
+	          break;
+	      }
+	    },
+	  },
+	};
+</script>
+
+<style lang="scss">
+	.content-box {
+		display: flex;
+		flex-direction: column;
+		flex: 1;
+	}
+	.policy-item-box {
+	  display: flex;
+	  justify-content: space-between;
+	  margin: 0 20rpx;
+	  margin-top: 20rpx;
+	  .policy-item-name {
+		    padding-bottom: 10rpx;
+		    font-size: 30rpx;
+		    width: 25%;
+		    text-align: center;
+	  }
+	  .active {
+	    font-weight: 600;
+	    border-bottom: 7rpx solid #02a7f0;
+	  }
+	}
+</style>