HB
/
ruoyi-miniapp
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

修改首页图表颜色

master
爱~海~爱海爱海~右 1 month ago
parent
70d02391bf
commit
cde284b5ec
8 changed files with 94 additions and 62 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      components/cs-text-more/index.vue
  2. 9
      pages/index.vue
  3. 9
      pages/task.vue
  4. 4
      static/scss/global.scss
  5. 72
      sub/enterprise/detail.vue
  6. 28
      sub/inspection/record.vue
  7. 16
      uni_modules/s-components/s-tabber/index.vue
  8. 16
      utils/ruoyi.js

2
components/cs-text-more/index.vue
Unescape View File

@ -7,6 +7,7 @@
position: relative;
transform: 0.2s all;
color: inherit;
white-space: normal;
"
v-if="value.length < splitLength"
>
@ -20,6 +21,7 @@
position: relative;
transform: 0.2s all;
color: inherit;
white-space: normal;
"
@tap="isShowAllText = !isShowAllText"
>

9
pages/index.vue
Unescape View File

@ -287,15 +287,18 @@ export default {
const res = await HomeApi.getPieData(this.queryParams)
this.detail = res.data
let curIndex = 0
const colorMap = []
const split = 1 / this.detail.completionRate.length
const data = this.detail.completionRate.map((item, index) => {
const color = `rgba(4, 180, 64,${1 - split * (index + 1)})`
const res = {
...item,
color: `rgba(4, 180, 64,${split * (index + 1)})`
color
}
curIndex > this.color.length ? 0 : curIndex++
colorMap.push(color)
return res
})
this.color = colorMap
this.detail.legendData = data
this.setPieData(data, this.detail.taskCompletionRate)
this.getList()
@ -315,7 +318,7 @@ export default {
pieData.push({
name: '',
value: 100 - Number(max),
color: '#fff'
color: '#F9F9F9'
})
}
this.opts = {

9
pages/task.vue
Unescape View File

@ -77,8 +77,11 @@
</template>
</van-circle>
</view>
<view class="wd-flex wd-flex-col" style="gap: 4px">
<text class="wd-font-800 wd-text-15 wd-pb-2px">
<view class="wd-flex wd-flex-col" style="gap: 8rpx">
<text
class="wd-font-800 wd-text-15 wd-pb-2px"
style="padding-right: 3rem"
>
{{ task.title }}
</text>
<view class="wd-flex wd-pb-8px">
@ -89,7 +92,7 @@
></u-icon>
<text
class="address wd-text-12"
style="margin-left: 4px"
style="margin-left: 8rpx"
:style="{
color: task.status == '2' ? '#17C653' : '#78829D'
}"

4
static/scss/global.scss
Unescape View File

@ -14,3 +14,7 @@ button {
display: none;
}
}
::v-deep .uni-calendar__box {
padding-bottom: 32px;
}

72
sub/enterprise/detail.vue
Unescape View File

@ -2,7 +2,7 @@
<scroll-view class="detail-container" scroll-y>
<view class="box detail">
<view>
<text class="wd-font-800 wd-text-16" style="margin-bottom: 4px">
<text class="wd-font-800 wd-text-16" style="margin-bottom: 8rpx">
{{ detail.enterprisesName }}
</text>
</view>
@ -28,11 +28,11 @@
</view>
</view>
<view class="wd-flex" style="align-items: center">
<text class="address" style="margin-right: 8px">环保负责人</text>
<text style="margin-right: 16px">
<text class="address" style="margin-right: 12rpx">环保负责人</text>
<text style="margin-right: 12rpx">
{{ detail.contactName }}
</text>
<text class="address" style="margin-right: 8px">联系方式</text>
<text class="address" style="margin-right: 12rpx">联系方式</text>
<text style="text-decoration: underline">
{{ detail.environmentalContactPhone }}
</text>
@ -42,7 +42,7 @@
v-for="(src, index) in detail.files"
:key="index"
:src="src.url"
mode="widthFix"
mode="aspectFit"
class="image"
></image>
</view>
@ -63,17 +63,17 @@
v-for="prove in detail.qualificationList"
:key="prove.id"
>
<view class="wd-flex" style="gap: 8px; position: relative">
<view class="wd-flex" style="gap: 18rpx; position: relative">
<image
src="@/static/images/enterprise/zz.png"
style="width: 90px; height: 70px"
mode="widthFix"
mode="aspectFit"
></image>
<view
style="flex: 1; justify-content: space-between"
class="wd-flex wd-flex-col"
>
<view class="wd-flex" style="gap: 8px; align-items: center">
<view class="wd-flex" style="gap: 18rpx; align-items: center">
<text class="label">资质名称</text>
<view>
{{
@ -84,13 +84,13 @@
}}
</view>
</view>
<view class="wd-flex" style="gap: 8px; align-items: center">
<view class="wd-flex" style="gap: 18rpx; align-items: center">
<text class="label">资质编号</text>
<view>
{{ prove.enterpriseAuth }}
</view>
</view>
<view class="wd-flex" style="gap: 8px; align-items: center">
<view class="wd-flex" style="gap: 18rpx; align-items: center">
<text class="label">资质时限</text>
<view>
{{ $util.formatDate(prove.expiryDate, 'YYYY年M月D日') }}
@ -128,7 +128,7 @@
<cs-bottom-wrapper v-if="isChange">
<view class="operation">
<view class="btn green" >认领该企业</view>
<view class="btn green">认领该企业</view>
</view>
</cs-bottom-wrapper>
@ -143,7 +143,7 @@
@cancel="postApi"
>
<view class="wd-flex wd-flex-col wd-flex-center" style="gap: 10px">
<view style="font-size: 18px; color: #071437; font-weight: 800">
<view style="font-size: 118rpx; color: #071437; font-weight: 800">
是否审核?
</view>
<view class="">请确保企业信息真实性</view>
@ -265,47 +265,47 @@ export default {
<style lang="scss" scoped>
.detail-container {
padding: 12px;
padding: 24rpx;
position: relative;
.box {
margin-bottom: 12px;
margin-bottom: 24rpx;
background-color: #fff;
border-radius: $cs-border-radius;
padding: 16px;
padding: 24rpx;
}
.detail {
display: flex;
flex-flow: column nowrap;
gap: 12px;
gap: 24rpx;
.address {
display: flex;
flex-flow: row nowrap;
gap: 5px;
gap: 10rpx;
color: $uni-text-color-grey;
}
.tagList {
display: flex;
gap: 4px;
gap: 8rpx;
flex-flow: row wrap;
color: $uni-text-color-grey;
.tag {
font-size: 12px;
font-size: 24rpx;
display: flex;
padding: 2px 6px;
padding: 4rpx 12rpx;
justify-content: center;
align-items: center;
border-radius: 2px;
border-radius: 4rpx;
background: #f9f9f9;
}
}
.status {
position: absolute;
right: -19px;
top: 6px;
transform: rotateZ(45deg) translateX(20px) translateY(-20px);
right: -38rpx;
top: 12rpx;
transform: rotateZ(45deg) translateX(40rpx) translateY(-40rpx);
transform-origin: 50% 50%;
padding: 4px 20px;
font-size: 12px;
padding: 8rpx 40rpx;
font-size: 24rpx;
text-align: center;
}
}
@ -314,19 +314,19 @@ export default {
overflow: hidden;
.status {
position: absolute;
right: -19px;
top: 6px;
transform: rotateZ(45deg) translateX(20px) translateY(-20px);
right: -38rpx;
top: 12rpx;
transform: rotateZ(45deg) translateX(40rpx) translateY(-40rpx);
transform-origin: 50% 50%;
padding: 4px 20px;
font-size: 12px;
padding: 8rpx 40rpx;
font-size: 24rpx;
text-align: center;
}
}
.images-box {
display: flex;
flex-flow: row nowrap;
gap: 12px;
gap: 24rpx;
.image {
width: 196rpx;
height: 196rpx;
@ -344,20 +344,20 @@ export default {
left: 0;
}
.operation {
padding: 12px;
padding: 24rpx;
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
gap: 24rpx;
.red {
background: var(--LightMode-Danger-Danger-Light, #ffeef3);
color: var(--LightMode-Danger-Danger, #f8285a);
}
.btn {
flex: 1;
border-radius: 8px;
border-radius: 18rpx;
display: flex;
padding: 12px 0;
padding: 24rpx 0;
align-items: center;
justify-content: center;
}

28
sub/inspection/record.vue
Unescape View File

@ -29,16 +29,16 @@
:key="people.userId"
style="
display: inline-flex;
gap: 12px;
gap: 24rpx;
border: 1px solid #f9f9f9;
border-radius: 8px;
padding: 12px;
margin-right: 12px;
border-radius: 16rpx;
padding: 24rpx;
margin-right: 24rpx;
"
>
<u-avatar
:src="people.avtar"
size="40px"
size="80rpx"
shape="circle"
></u-avatar>
<view class="wd-flex wd-flex-col" style="gap: 2px">
@ -55,6 +55,7 @@
:key="photo.id"
mode="aspectFill"
class="image"
@tap="previewImage(log.fileList)"
></image>
</view>
</view>
@ -109,6 +110,9 @@ export default {
const res = await getTaskLog(this.queryParams.taskId)
this.list = res.data
uni.hideToast()
},
previewImage(url) {
this.$util.perviewImage(url.map(i => i.url))
}
}
}
@ -116,21 +120,21 @@ export default {
<style lang="scss" scoped>
.view-container {
padding: 12px;
padding: 24rpx;
flex-direction: column;
gap: 12px;
gap: 24rpx;
.box {
border-radius: 12px;
padding: 12px;
border-radius: 24rpx;
padding: 24rpx;
display: flex;
flex-direction: column;
gap: 12px;
gap: 24rpx;
background-color: #fff;
position: relative;
margin-bottom: 12px;
margin-bottom: 24rpx;
.imageList {
display: flex;
gap: 12px;
gap: 24rpx;
.image {
width: 192rpx;
height: 192rpx;

16
uni_modules/s-components/s-tabber/index.vue
Unescape View File

@ -9,14 +9,14 @@
>
<u--image
:src="selected == tab.code ? tab.selectIcon : tab.icon"
width="42px"
height="42px"
width="42"
height="42"
v-if="tab.type == 'middle'"
></u--image>
<u--image
:src="selected == tab.code ? tab.selectIcon : tab.icon"
width="24px"
height="24px"
width="24"
height="24"
v-else
></u--image>
<view class="name">
@ -24,7 +24,7 @@
</view>
</view>
</view>
<view :style="{ height: isFit ? '25px' : '12px' }"></view>
<view :style="{ height: isFit ? '50rpx' : '24rpx' }"></view>
</view>
</template>
@ -111,15 +111,15 @@ export default {
flex-flow: row nowrap;
justify-content: space-around;
align-items: center;
border-top: 1px solid #f1f1f4;
padding: 12px 32px 0px 32px;
border-top: 2rpx solid #f1f1f4;
padding: 24rpx 64rpx 0px 64rpx;
.tab {
display: flex;
flex-flow: column nowrap;
justify-content: center;
align-items: center;
transition: 0.2s all;
gap: 2px;
gap: 4rpx;
}
.isActive {
color: #22c55e;

16
utils/ruoyi.js
Unescape View File

@ -112,4 +112,20 @@ export function loading(title = '加载中') {
return {
close
}
}
/**
* 预览图片
*/
export function perviewImage(url) {
uni.previewImage({
urls: [...url], //需要预览的图片http链接列表，多张的时候，url直接写在后面就行了
current: '', // 当前显示图片的http链接，默认是第一个
success: function(res) {},
fail: function(res) {},
complete: function(res) {},
})
}
Write Preview
Loading…
Cancel
Save