kola-web
4 weeks ago
37 changed files with 702 additions and 696 deletions
@ -1,55 +1,55 @@ |
|||||||
<view id="canvas-bill-body-mp" class="canvas-box" style="width: 750rpx"> |
<view id="canvas-bill-body-mp" class="canvas-box" style="width: 750rpx"> |
||||||
<view class="canvas-body"> |
<view class="canvas-body"> |
||||||
<view class="detail draw_canvas" data-type="text"> |
<view class="detail draw_canvas" data-type="text"> |
||||||
<view class="d-header draw_canvas" data-type="text"> |
<view class="d-header draw_canvas" data-type="text"> |
||||||
<view class="none draw_canvas" data-type="text"></view> |
<view class="none draw_canvas" data-type="text"></view> |
||||||
<view |
<view |
||||||
class="bar draw_canvas" |
class="bar draw_canvas" |
||||||
style="background: url({{imageUrl}}/1/adl-scurt.png?t={{Timestamp}}) no-repeat center / 100% 100% ;" |
style="background: url({{imageUrl}}za-images/1/adl-scurt.png?t={{Timestamp}}) no-repeat center / 100% 100% ;" |
||||||
data-type="background-image" |
data-type="background-image" |
||||||
> |
> |
||||||
<view class="num-normal draw_canvas" data-type="text" data-text="0分">0分</view> |
<view class="num-normal draw_canvas" data-type="text" data-text="0分">0分</view> |
||||||
<view class="num draw_canvas" data-type="text" data-text="1分">1分</view> |
<view class="num draw_canvas" data-type="text" data-text="1分">1分</view> |
||||||
<view class="num draw_canvas" data-type="text" data-text="2分">2分</view> |
<view class="num draw_canvas" data-type="text" data-text="2分">2分</view> |
||||||
<view class="num draw_canvas" data-type="text" data-text="3分">3分</view> |
<view class="num draw_canvas" data-type="text" data-text="3分">3分</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="d-body draw_canvas" data-type="text"> |
<view class="d-body draw_canvas" data-type="text"> |
||||||
<view class="d-aside draw_canvas" data-type="text"> |
<view class="d-aside draw_canvas" data-type="text"> |
||||||
<view class="da-item da-item1 draw_canvas" data-type="text" data-text="延髓">延髓</view> |
<view class="da-item da-item1 draw_canvas" data-type="text" data-text="延髓">延髓</view> |
||||||
<view class="da-item da-item2 draw_canvas" data-type="text" data-text="呼吸">呼吸</view> |
<view class="da-item da-item2 draw_canvas" data-type="text" data-text="呼吸">呼吸</view> |
||||||
<view class="da-item da-item3 draw_canvas" data-type="text" data-text="四肢">四肢</view> |
<view class="da-item da-item3 draw_canvas" data-type="text" data-text="四肢">四肢</view> |
||||||
<view class="da-item da-item4 draw_canvas" data-type="text" data-text="眼肌">眼肌</view> |
<view class="da-item da-item4 draw_canvas" data-type="text" data-text="眼肌">眼肌</view> |
||||||
</view> |
</view> |
||||||
<view class="d-container draw_canvas" data-type="text"> |
<view class="d-container draw_canvas" data-type="text"> |
||||||
<view class="dc-row draw_canvas" wx:for="{{tableData}}" wx:key="index" data-type="text"> |
<view class="dc-row draw_canvas" wx:for="{{tableData}}" wx:key="index" data-type="text"> |
||||||
<view class="dc-title draw_canvas" data-type="text" data-text="{{item.title}}">{{item.title}}</view> |
<view class="dc-title draw_canvas" data-type="text" data-text="{{item.title}}">{{item.title}}</view> |
||||||
<block wx:for="{{item.list}}" wx:for-item="lItem" wx:for-index="lIndex" wx:key="lIndex"> |
<block wx:for="{{item.list}}" wx:for-item="lItem" wx:for-index="lIndex" wx:key="lIndex"> |
||||||
<view |
<view |
||||||
class="{{lIndex==0 ? 'dc-sub-title' :'dc-col'}} {{params[item.key] == lIndex && 'active'}} draw_canvas" |
class="{{lIndex==0 ? 'dc-sub-title' :'dc-col'}} {{params[item.key] == lIndex && 'active'}} draw_canvas" |
||||||
data-type="text" |
data-type="text" |
||||||
data-text="{{lItem.title}}" |
data-text="{{lItem.title}}" |
||||||
> |
> |
||||||
{{lItem.title}} |
{{lItem.title}} |
||||||
</view> |
</view> |
||||||
</block> |
</block> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
|
|
||||||
<canvas |
<canvas |
||||||
canvas-id="canvas1" |
canvas-id="canvas1" |
||||||
class="canvas-bill" |
class="canvas-bill" |
||||||
style="height: {{ height }}rpx; width: {{ width }}rpx;transform: scale({{scale}})" |
style="height: {{ height }}rpx; width: {{ width }}rpx;transform: scale({{scale}})" |
||||||
></canvas> |
></canvas> |
||||||
|
|
||||||
<image |
<image |
||||||
wx:if="{{imgUrl && false}}" |
wx:if="{{imgUrl && false}}" |
||||||
src="{{imgUrl}}" |
src="{{imgUrl}}" |
||||||
mode="aspectFit" |
mode="aspectFit" |
||||||
style="height: {{ height }}rpx; width: {{ width }}rpx;" |
style="height: {{ height }}rpx; width: {{ width }}rpx;" |
||||||
></image> |
></image> |
||||||
<!-- show-menu-by-longpress --> |
<!-- show-menu-by-longpress --> |
||||||
|
|||||||
@ -1,287 +1,287 @@ |
|||||||
/* eslint-disable */ |
/* eslint-disable */ |
||||||
const app = getApp<IAppOption>() |
const app = getApp<IAppOption>() |
||||||
const licia = require('miniprogram-licia') |
const licia = require('miniprogram-licia') |
||||||
import dayjs from 'dayjs' |
import dayjs from 'dayjs' |
||||||
|
|
||||||
let echarts: any = null |
let echarts: any = null |
||||||
|
|
||||||
Page({ |
Page({ |
||||||
data: { |
data: { |
||||||
ec: { |
ec: { |
||||||
lazyLoad: true, |
lazyLoad: true, |
||||||
}, |
}, |
||||||
foldAll: true, |
foldAll: true, |
||||||
|
|
||||||
BeginMonth: '', |
BeginMonth: '', |
||||||
EndMonth: '', |
EndMonth: '', |
||||||
Type: '1', |
Type: '1', |
||||||
Num: '' as string | number, |
Num: '' as string | number, |
||||||
fields: { |
fields: { |
||||||
1: 'day', |
1: 'day', |
||||||
2: 'month', |
2: 'month', |
||||||
3: 'year', |
3: 'year', |
||||||
}, |
}, |
||||||
|
|
||||||
detail: {}, |
detail: {}, |
||||||
partNameList: app.globalData.partNameList, |
partNameList: app.globalData.partNameList, |
||||||
list: [], |
list: [], |
||||||
defaultList: [], |
defaultList: [], |
||||||
count: 0, |
count: 0, |
||||||
|
|
||||||
zdUserInfo: {}, |
zdUserInfo: {}, |
||||||
todayBg: '', |
todayBg: '', |
||||||
selectLegends: {}, |
selectLegends: {}, |
||||||
|
|
||||||
page: 0, |
page: 0, |
||||||
safeAreaLeft: 20, |
safeAreaLeft: 20, |
||||||
|
|
||||||
theme: '', |
theme: '', |
||||||
}, |
}, |
||||||
ecDataTrendComponent: null as any, |
ecDataTrendComponent: null as any, |
||||||
async onLoad() { |
async onLoad() { |
||||||
app.zdGetTheme().then((res) => { |
app.zdGetTheme().then((res) => { |
||||||
this.setData({ |
this.setData({ |
||||||
theme: res, |
theme: res, |
||||||
}) |
}) |
||||||
}) |
}) |
||||||
|
|
||||||
const that = this |
const that = this |
||||||
|
|
||||||
that.getSystemInfo() |
that.getSystemInfo() |
||||||
echarts = await require.async('../../../resource/components/echart/echarts.js') |
echarts = await require.async('../../compontnts/echart/echarts.js') |
||||||
|
|
||||||
that.ecDataTrendComponent = that.selectComponent('#mychart-dom-bar') |
that.ecDataTrendComponent = that.selectComponent('#mychart-dom-bar') |
||||||
|
|
||||||
const eventChannel = that.getOpenerEventChannel() |
const eventChannel = that.getOpenerEventChannel() |
||||||
eventChannel.on('acceptDataFromOpenerPage', function (data) { |
eventChannel.on('acceptDataFromOpenerPage', function (data) { |
||||||
console.log(data) |
console.log(data) |
||||||
that.setData({ |
that.setData({ |
||||||
defaultList: data.list, |
defaultList: data.list, |
||||||
selectLegends: { ...data.selectLegends }, |
selectLegends: { ...data.selectLegends }, |
||||||
zdUserInfo: app.globalData.zdUserInfo, |
zdUserInfo: app.globalData.zdUserInfo, |
||||||
}) |
}) |
||||||
that.initChart(data.list) |
that.initChart(data.list) |
||||||
}) |
}) |
||||||
|
|
||||||
that.initChart(that.data.defaultList as any) |
that.initChart(that.data.defaultList as any) |
||||||
}, |
}, |
||||||
|
|
||||||
initChart(defaultList = []) { |
initChart(defaultList = []) { |
||||||
const { selectLegends, theme } = this.data |
const { selectLegends, theme } = this.data |
||||||
// const list = defaultList.slice(page * 15, (page + 1) * 8);
|
// const list = defaultList.slice(page * 15, (page + 1) * 8);
|
||||||
const list = defaultList |
const list = defaultList |
||||||
this.ecDataTrendComponent.init((canvas, width, height, dpr) => { |
this.ecDataTrendComponent.init((canvas, width, height, dpr) => { |
||||||
let chart = echarts.init(canvas, null, { |
let chart = echarts.init(canvas, null, { |
||||||
width: width, |
width: width, |
||||||
height: height, |
height: height, |
||||||
devicePixelRatio: dpr, // new
|
devicePixelRatio: dpr, // new
|
||||||
}) |
}) |
||||||
canvas.setChart(chart) |
canvas.setChart(chart) |
||||||
|
|
||||||
var option = { |
var option = { |
||||||
dataZoom: [ |
dataZoom: [ |
||||||
{ |
{ |
||||||
type: 'inside', // 内置于坐标系中
|
type: 'inside', // 内置于坐标系中
|
||||||
// start: 0,
|
// start: 0,
|
||||||
// end: 15,
|
// end: 15,
|
||||||
startValue: 0, |
startValue: 0, |
||||||
endValue: 15, |
endValue: 15, |
||||||
xAxisIndex: [0], |
xAxisIndex: [0], |
||||||
}, |
}, |
||||||
], |
], |
||||||
tooltip: { |
tooltip: { |
||||||
trigger: 'axis', |
trigger: 'axis', |
||||||
axisPointer: { |
axisPointer: { |
||||||
type: 'shadow', |
type: 'shadow', |
||||||
}, |
}, |
||||||
confine: true, |
confine: true, |
||||||
backgroundColor: 'rgba(0, 0, 0, 0.5)', |
backgroundColor: 'rgba(0, 0, 0, 0.5)', |
||||||
textStyle: { |
textStyle: { |
||||||
color: '#fff', |
color: '#fff', |
||||||
fontSize: 10, |
fontSize: 10, |
||||||
}, |
}, |
||||||
order: 'seriesDesc', |
order: 'seriesDesc', |
||||||
}, |
}, |
||||||
legend: { |
legend: { |
||||||
bottom: 0, |
bottom: 0, |
||||||
padding: 0, |
padding: 0, |
||||||
itemGap: 5, |
itemGap: 5, |
||||||
itemWidth: 8, |
itemWidth: 8, |
||||||
itemHeight: 8, |
itemHeight: 8, |
||||||
icon: 'circle', |
icon: 'circle', |
||||||
selected: selectLegends, |
selected: selectLegends, |
||||||
}, |
}, |
||||||
grid: { |
grid: { |
||||||
top: '5', |
top: '5', |
||||||
left: '0', |
left: '0', |
||||||
right: '0', |
right: '0', |
||||||
bottom: '15', |
bottom: '15', |
||||||
containLabel: true, |
containLabel: true, |
||||||
}, |
}, |
||||||
xAxis: [ |
xAxis: [ |
||||||
{ |
{ |
||||||
type: 'category', |
type: 'category', |
||||||
axisTick: { |
axisTick: { |
||||||
show: false, |
show: false, |
||||||
}, |
}, |
||||||
axisLine: { |
axisLine: { |
||||||
lineStyle: { |
lineStyle: { |
||||||
color: '#8C8C8C', |
color: '#8C8C8C', |
||||||
type: 'dashed', |
type: 'dashed', |
||||||
}, |
}, |
||||||
}, |
}, |
||||||
axisLabel: { |
axisLabel: { |
||||||
//x轴文字的配置
|
//x轴文字的配置
|
||||||
show: true, |
show: true, |
||||||
interval: 0, //使x轴文字显示全
|
interval: 0, //使x轴文字显示全
|
||||||
rotate: -20, |
rotate: -20, |
||||||
}, |
}, |
||||||
data: list.map((item) => item.Date), |
data: list.map((item) => item.Date), |
||||||
}, |
}, |
||||||
], |
], |
||||||
yAxis: [ |
yAxis: [ |
||||||
{ |
{ |
||||||
type: 'value', |
type: 'value', |
||||||
}, |
}, |
||||||
], |
], |
||||||
series: [ |
series: [ |
||||||
{ |
{ |
||||||
name: '延髓', |
name: '延髓', |
||||||
type: 'bar', |
type: 'bar', |
||||||
stack: 'Ad', |
stack: 'Ad', |
||||||
emphasis: { |
emphasis: { |
||||||
disabled: true, |
disabled: true, |
||||||
focus: 'none', |
focus: 'none', |
||||||
}, |
}, |
||||||
data: list.map((item) => item.MedullaTypeScore * 1), |
data: list.map((item) => item.MedullaTypeScore * 1), |
||||||
barWidth: '16', |
barWidth: '16', |
||||||
itemStyle: { |
itemStyle: { |
||||||
// borderColor: "#fff",
|
// borderColor: "#fff",
|
||||||
// borderWidth: 2,
|
// borderWidth: 2,
|
||||||
color: '#7FBDA6', |
color: '#7FBDA6', |
||||||
}, |
}, |
||||||
}, |
}, |
||||||
{ |
{ |
||||||
name: '呼吸', |
name: '呼吸', |
||||||
type: 'bar', |
type: 'bar', |
||||||
stack: 'Ad', |
stack: 'Ad', |
||||||
emphasis: { |
emphasis: { |
||||||
disabled: true, |
disabled: true, |
||||||
focus: 'none', |
focus: 'none', |
||||||
}, |
}, |
||||||
data: list.map((item) => item.BreathTypeScore * 1), |
data: list.map((item) => item.BreathTypeScore * 1), |
||||||
itemStyle: { |
itemStyle: { |
||||||
// borderColor: "#fff",
|
// borderColor: "#fff",
|
||||||
// borderWidth: 2,
|
// borderWidth: 2,
|
||||||
color: '#F1CE8F', |
color: '#F1CE8F', |
||||||
}, |
}, |
||||||
}, |
}, |
||||||
{ |
{ |
||||||
name: '肢体', |
name: '肢体', |
||||||
type: 'bar', |
type: 'bar', |
||||||
stack: 'Ad', |
stack: 'Ad', |
||||||
emphasis: { |
emphasis: { |
||||||
disabled: true, |
disabled: true, |
||||||
focus: 'none', |
focus: 'none', |
||||||
}, |
}, |
||||||
data: list.map((item) => item.LimbsTypeScore * 1), |
data: list.map((item) => item.LimbsTypeScore * 1), |
||||||
itemStyle: { |
itemStyle: { |
||||||
// borderColor: "#fff",
|
// borderColor: "#fff",
|
||||||
// borderWidth: 2,
|
// borderWidth: 2,
|
||||||
color: '#9ED0DE', |
color: '#9ED0DE', |
||||||
}, |
}, |
||||||
}, |
}, |
||||||
{ |
{ |
||||||
name: '眼肌', |
name: '眼肌', |
||||||
type: 'bar', |
type: 'bar', |
||||||
stack: 'Ad', |
stack: 'Ad', |
||||||
emphasis: { |
emphasis: { |
||||||
disabled: true, |
disabled: true, |
||||||
focus: 'none', |
focus: 'none', |
||||||
}, |
}, |
||||||
data: list.map((item) => item.EyeTypeScore * 1), |
data: list.map((item) => item.EyeTypeScore * 1), |
||||||
itemStyle: { |
itemStyle: { |
||||||
// borderColor: "#fff",
|
// borderColor: "#fff",
|
||||||
// borderWidth: 2,
|
// borderWidth: 2,
|
||||||
color: '#D37862', |
color: '#D37862', |
||||||
}, |
}, |
||||||
}, |
}, |
||||||
{ |
{ |
||||||
name: '总分', |
name: '总分', |
||||||
data: list.map((item) => item.TotalScore), |
data: list.map((item) => item.TotalScore), |
||||||
type: 'line', |
type: 'line', |
||||||
symbol: 'circle', |
symbol: 'circle', |
||||||
connectNulls: true, |
connectNulls: true, |
||||||
itemStyle: { |
itemStyle: { |
||||||
color: '#CF5375', |
color: '#CF5375', |
||||||
}, |
}, |
||||||
}, |
}, |
||||||
], |
], |
||||||
// dataZoom: {
|
// dataZoom: {
|
||||||
// show: true, // 为true 滚动条出现
|
// show: true, // 为true 滚动条出现
|
||||||
// realtime: true,
|
// realtime: true,
|
||||||
// type: "slider", // 有type这个属性，滚动条在最下面，也可以不行，写y：36，这表示距离顶端36px，一般就是在图上面。
|
// type: "slider", // 有type这个属性，滚动条在最下面，也可以不行，写y：36，这表示距离顶端36px，一般就是在图上面。
|
||||||
// height: 20, // 表示滚动条的高度，也就是粗细
|
// height: 20, // 表示滚动条的高度，也就是粗细
|
||||||
// start: 20, // 表示默认展示20%～80%这一段。
|
// start: 20, // 表示默认展示20%～80%这一段。
|
||||||
// end: 80,
|
// end: 80,
|
||||||
// },
|
// },
|
||||||
} |
} |
||||||
if (theme === 'DRUG') { |
if (theme === 'DRUG') { |
||||||
let markLineData = list |
let markLineData = list |
||||||
.filter((item) => item.InjectionBottles) |
.filter((item) => item.InjectionBottles) |
||||||
.map((item) => { |
.map((item) => { |
||||||
return { |
return { |
||||||
name: '', |
name: '', |
||||||
xAxis: item.Date, |
xAxis: item.Date, |
||||||
lineStyle: { |
lineStyle: { |
||||||
color: '#25D9C8', |
color: '#25D9C8', |
||||||
cap: '', |
cap: '', |
||||||
type: 'solid', |
type: 'solid', |
||||||
}, |
}, |
||||||
label: { |
label: { |
||||||
formatter: '', |
formatter: '', |
||||||
position: 'insideEndBottom', |
position: 'insideEndBottom', |
||||||
rotate: 0, |
rotate: 0, |
||||||
color: '#25D9C8', |
color: '#25D9C8', |
||||||
offset: [60, 0], |
offset: [60, 0], |
||||||
}, |
}, |
||||||
} |
} |
||||||
}) |
}) |
||||||
option.series.push({ |
option.series.push({ |
||||||
name: '用药', |
name: '用药', |
||||||
data: list.map((item) => item.InjectionBottles), |
data: list.map((item) => item.InjectionBottles), |
||||||
type: 'line', |
type: 'line', |
||||||
symbol: 'none', |
symbol: 'none', |
||||||
itemStyle: { |
itemStyle: { |
||||||
color: '#25D9C8', |
color: '#25D9C8', |
||||||
}, |
}, |
||||||
lineStyle: { |
lineStyle: { |
||||||
width: 0, |
width: 0, |
||||||
}, |
}, |
||||||
markLine: { |
markLine: { |
||||||
symbol: ['none', 'none'], |
symbol: ['none', 'none'], |
||||||
data: markLineData, |
data: markLineData, |
||||||
}, |
}, |
||||||
}) |
}) |
||||||
} |
} |
||||||
|
|
||||||
chart.setOption(option) |
chart.setOption(option) |
||||||
return chart |
return chart |
||||||
}) |
}) |
||||||
}, |
}, |
||||||
getSystemInfo() { |
getSystemInfo() { |
||||||
wx.getSystemInfo({ |
wx.getSystemInfo({ |
||||||
success: (res) => { |
success: (res) => { |
||||||
this.setData({ |
this.setData({ |
||||||
safeAreaLeft: res.safeArea.left || 20, |
safeAreaLeft: res.safeArea.left || 20, |
||||||
}) |
}) |
||||||
}, |
}, |
||||||
}) |
}) |
||||||
}, |
}, |
||||||
onShareAppMessage() { |
onShareAppMessage() { |
||||||
return { |
return { |
||||||
title: 'MG-ADL测评表：评估重症肌无力患者症状对生活质量的影响', |
title: 'MG-ADL测评表：评估重症肌无力患者症状对生活质量的影响', |
||||||
path: '/pages/adl/index', |
path: '/patient/pages/adl/index', |
||||||
} |
} |
||||||
}, |
}, |
||||||
}) |
}) |
||||||
|
|||||||
Loading…
Reference in new issue