cardMoudule.vue
3.01 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<template>
<view class="cardCss">
<view class="titleCss">
<text class="requiredCss" v-if="required">*</text>
{{title}}
</view>
<view class="typeMoudule" v-if="cardData" v-for="(item,index) in cardData">
<view class="u-demo-block" v-if="item.cardType == 1">
<view class="u-demo-block__title">
<span>
<text class="requiredCss" v-if="item.required">*</text>
{{item.title}}</span>
</view>
<view class="u-demo-block__content" style="margin-top: 15px;">
<u--input disabled v-model="item.value" :suffixIcon="item.icon" suffixIconStyle="color: #909399"></u--input>
</view>
</view>
<view class="largeAmountOfTextCss" v-if="item.cardType == 2">
为了精准掌握玉林中燃经营区域及周边市场发展态势,预测2023财年市场开发计划和未来市场发展方向,按照集团三年发展规划及高质量发展的要求,玉林中燃积极开展了一次全面、系统、深入的全方面市场调研工作。
</view>
<view class="u-demo-block" v-if="item.cardType == 3">
<view class="u-demo-block__title">
<span>
<text class="requiredCss" v-if="item.required">*</text>
{{item.title}}</span>
</view>
</view>
<view class="u-demo-block descCss" v-if="item.cardType == 4">
{{ item.title }}
</view>
</view>
</view>
</template>
<script>
export default {
components: {},
props: {
// cardType:{
// type:String
// },
required: {
type: Boolean,
default: false
},
title: {
type: String
},
cardData: {
type: Array
}
},
data() {
return {
}
},
computed: {
},
onLoad() {
console.log(this.cardData);
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.cardCss {
margin: 20rpx 24rpx;
padding: 40rpx 30rpx;
border-radius: 20px;
background-color: #ffffff;
box-sizing: border-box;
}
.titleCss {
// margin: 40rpx 0;
font-size: 30rpx;
color: #333333;
}
.u-demo-block__title {
background-color: rgba(255, 255, 255, 0);
box-sizing: border-box;
font-family: '苹方 中等', '苹方', sans-serif;
color: #999db0;
text-align: left;
line-height: normal;
font-size: 26rpx;
}
.u-demo-block {
margin: 30rpx 0;
}
.largeAmountOfTextCss {
text-indent: 1em;
margin-top: 38rpx;
padding: 20rpx 20rpx 20rpx 20rpx;
border-radius: 20rpx;
background-color: #f8f9fd;
box-sizing: border-box;
font-family: '苹方 中等', '苹方', sans-serif;
color: #999db0;
text-align: left;
line-height: 46rpx;
}
.descCss {
background-color: rgba(255, 255, 255, 0);
box-sizing: border-box;
font-family: '苹方 中等', '苹方', sans-serif;
color: #666666;
text-align: left;
line-height: normal;
font-size: 28rpx;
}
/deep/.uni-input-input {
color: #999db0;
}
</style>