270 lines
		
	
	
		
			12 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			270 lines
		
	
	
		
			12 KiB
		
	
	
	
		
			Vue
		
	
	
	
| <template>
 | ||
|     <view class="bg-white br12 p-0-20">
 | ||
|         <view class="d-b-c p-30-0 border-b">
 | ||
|             <view class="f28 fb">{{ $t('ENU_G_C_2') }}</view> 
 | ||
|             <view class="hh100" @click="clickFold">
 | ||
|                 <u-icon name="arrow-down" size="28rpx" color="#999999" v-if="fold"></u-icon>
 | ||
|                 <u-icon name="arrow-right" size="28rpx" color="#999999" v-else></u-icon>
 | ||
|             </view>
 | ||
|         </view>
 | ||
|         <view class="collspaceContent" :class="{ 'closed': !fold }">
 | ||
|             <view class="d-b-c p-20-0 border-b">
 | ||
|                 <view class="f24 gray3">{{ $t('S_C_7') }}:{{ $t('S_C_58') }}</view>
 | ||
|                 <view class="f24">{{ data.month }}{{ $t('S_C_62') }}</view>
 | ||
|             </view>
 | ||
|             <view class="prefecture form-group">
 | ||
|                 <view class="form-item">
 | ||
|                     <view class="d-b-c ww100">
 | ||
|                         <view>
 | ||
|                             <view class="d-s-c">
 | ||
|                                 <view class="pr20">
 | ||
|                                     <text class="f24 fb">{{ $t('S_C_15') }}({{ performanceCurrency() }})</text>
 | ||
|                                 </view>
 | ||
|                                 <view>
 | ||
|                                     <text class="f24">{{ goalsClassifyVOList.totalAchieve }}</text>
 | ||
|                                 </view>
 | ||
|                             </view>
 | ||
|                         </view>
 | ||
|                         <view>
 | ||
|                             <view class="d-s-c">
 | ||
|                                 <view>
 | ||
|                                     <text class="f24 fb">{{ $t('S_C_35') }}(%)</text>
 | ||
|                                 </view>
 | ||
|                                 <view>
 | ||
|                                     <text class="f24">{{ goalsClassifyVOList.totalRatio }}</text>
 | ||
|                                 </view>
 | ||
|                             </view>
 | ||
|                         </view>
 | ||
|                     </view>
 | ||
|                 </view>
 | ||
|                 <view class="form-item">
 | ||
|                     <view class="d-b-c ww100">
 | ||
|                         <view>
 | ||
|                             <view class="d-s-c">
 | ||
|                                 <view class="pr20">
 | ||
|                                     <text class="f24 fb">{{ $t('S_C_16') }}({{ performanceCurrency() }})</text>
 | ||
|                                 </view>
 | ||
|                                 <view>
 | ||
|                                     <text class="f24">{{ goalsClassifyVOList.rightAchieve }}</text>
 | ||
|                                 </view>
 | ||
|                             </view>
 | ||
|                         </view>
 | ||
|                         <view>
 | ||
|                             <view class="d-s-c">
 | ||
|                                 <view>
 | ||
|                                     <text class="f24 fb">{{ $t('S_C_35') }}(%)</text>
 | ||
|                                 </view>
 | ||
|                                 <view>
 | ||
|                                     <text class="f24">{{ goalsClassifyVOList.rightRatio }}</text>
 | ||
|                                 </view>
 | ||
|                             </view>
 | ||
|                         </view>
 | ||
|                     </view>
 | ||
|                 </view>
 | ||
|                 <view class="d-f tc">
 | ||
|                     <view class="flex-1">
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_9') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_46') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_47') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_48') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_49') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_50') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_51') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_52') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_53') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_54') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_55') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                          <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_56') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_57') }}</view>
 | ||
|                         </view>
 | ||
|                         <view class="form-item"></view>
 | ||
|                     </view>
 | ||
|                     <view class="flex-1">
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_17') }}</view>  
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_18') }}</view> 
 | ||
|                         </view>
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_19') }}</view> 
 | ||
|                         </view>    
 | ||
|                     </view>
 | ||
|                     <view class="flex-1">
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_10') }}({{ performanceCurrency() }})</view> 
 | ||
|                         </view>
 | ||
|                         <template v-for="(v, idx) in goalsClassifyVOList.monthDetailVOList">
 | ||
|                             <view class="form-item">
 | ||
|                                 <view class="">{{ v.leftAchieve }}</view>
 | ||
|                             </view>
 | ||
|                             <view class="form-item">
 | ||
|                                 <view class="">{{ v.rightAchieve }}</view>
 | ||
|                             </view>
 | ||
|                         </template>
 | ||
|                     </view>
 | ||
| 
 | ||
|                     <view class="flex-1">
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_34') }}({{ performanceCurrency() }})</view> 
 | ||
|                         </view>
 | ||
|                         <template v-for="(v, idx) in goalsClassifyVOList.monthDetailVOList">
 | ||
|                             <view class="form-item">
 | ||
|                                 <view class="">{{ v.leftRealAchieve || 0 }}</view>
 | ||
|                             </view>
 | ||
|                             <view class="form-item">
 | ||
|                                 <view class="">{{ v.RightRealAchiev || 0 }}</view>
 | ||
|                             </view>
 | ||
|                         </template>
 | ||
|                     </view>
 | ||
| 
 | ||
|                     <view class="flex-1">
 | ||
|                         <view class="form-item">
 | ||
|                             <view class="fb">{{ $t('S_C_35') }}(%)</view> 
 | ||
|                         </view>
 | ||
|                         <template v-for="(v, idx) in goalsClassifyVOList.monthDetailVOList">
 | ||
|                             <view class="form-item">
 | ||
|                                 <view class="">{{ v.leftRatio || 0 }}</view>
 | ||
|                             </view>
 | ||
|                             <view class="form-item">
 | ||
|                                 <view class="">{{ v.rightRatio || 0 }}</view>
 | ||
|                             </view>
 | ||
|                         </template>
 | ||
|                     </view>
 | ||
|                 </view>
 | ||
|             </view>
 | ||
|         </view>
 | ||
|     </view>
 | ||
| </template>
 | ||
| 
 | ||
| <script>
 | ||
| export default {
 | ||
|     components: {},
 | ||
|     props: ['data', 'goalsClassifyVOList'],
 | ||
|     data() {
 | ||
|         return {
 | ||
|             fold: false,
 | ||
|         };
 | ||
|     },
 | ||
|     methods: {
 | ||
|         clickFold() {
 | ||
|             this.fold = !this.fold;
 | ||
|         },
 | ||
|     }
 | ||
| };
 | ||
| </script>
 | ||
| 
 | ||
| <style lang="scss" scoped>
 | ||
| .collspaceContent {
 | ||
|     max-height: 5000rpx;
 | ||
|     overflow: hidden;
 | ||
|     transition: all ease 0.8s;
 | ||
| 
 | ||
|     &.closed {
 | ||
|         max-height: 0;
 | ||
|         transition: all ease 0.6s;
 | ||
|     }
 | ||
| }
 | ||
| </style> |