nicky
5 months ago
199 changed files with 0 additions and 121528 deletions
@ -1,23 +0,0 @@ |
|||||
node_modules |
|
||||
/dist |
|
||||
test.zip |
|
||||
api.zip |
|
||||
dist.zip |
|
||||
.DS_Store |
|
||||
|
|
||||
|
|
||||
# local env files |
|
||||
.env.local |
|
||||
.env.*.local |
|
||||
|
|
||||
# Log files |
|
||||
npm-debug.log* |
|
||||
|
|
||||
# Editor directories and files |
|
||||
.idea |
|
||||
.vscode |
|
||||
*.suo |
|
||||
*.ntvs* |
|
||||
*.njsproj |
|
||||
*.sln |
|
||||
*.sw? |
|
||||
@ -1,36 +0,0 @@ |
|||||
# Bfy_Pad_v4 |
|
||||
|
|
||||
#### Description |
|
||||
{**When you're done, you can delete the content in this README and update the file with details for others getting started with your repository**} |
|
||||
|
|
||||
#### Software Architecture |
|
||||
Software architecture description |
|
||||
|
|
||||
#### Installation |
|
||||
|
|
||||
1. xxxx |
|
||||
2. xxxx |
|
||||
3. xxxx |
|
||||
|
|
||||
#### Instructions |
|
||||
|
|
||||
1. xxxx |
|
||||
2. xxxx |
|
||||
3. xxxx |
|
||||
|
|
||||
#### Contribution |
|
||||
|
|
||||
1. Fork the repository |
|
||||
2. Create Feat_xxx branch |
|
||||
3. Commit your code |
|
||||
4. Create Pull Request |
|
||||
|
|
||||
|
|
||||
#### Gitee Feature |
|
||||
|
|
||||
1. You can use Readme\_XXX.md to support different languages, such as Readme\_en.md, Readme\_zh.md |
|
||||
2. Gitee blog [blog.gitee.com](https://blog.gitee.com) |
|
||||
3. Explore open source project [https://gitee.com/explore](https://gitee.com/explore) |
|
||||
4. The most valuable open source project [GVP](https://gitee.com/gvp) |
|
||||
5. The manual of Gitee [https://gitee.com/help](https://gitee.com/help) |
|
||||
6. The most popular members [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/) |
|
||||
@ -1,19 +0,0 @@ |
|||||
# ht-ageing |
|
||||
|
|
||||
## Project setup |
|
||||
``` |
|
||||
npm install |
|
||||
``` |
|
||||
|
|
||||
### Compiles and hot-reloads for development |
|
||||
``` |
|
||||
npm run serve |
|
||||
``` |
|
||||
|
|
||||
### Compiles and minifies for production |
|
||||
``` |
|
||||
npm run build |
|
||||
``` |
|
||||
|
|
||||
### Customize configuration |
|
||||
See [Configuration Reference](https://cli.vuejs.org/config/). |
|
||||
@ -1 +0,0 @@ |
|||||
CARBASICS2023-WEB-PAD |
|
||||
@ -1,5 +0,0 @@ |
|||||
module.exports = { |
|
||||
presets: [ |
|
||||
'@vue/cli-plugin-babel/preset' |
|
||||
] |
|
||||
} |
|
||||
File diff suppressed because it is too large
@ -1,42 +0,0 @@ |
|||||
{ |
|
||||
"name": "storm-pad", |
|
||||
"version": "2.0.0", |
|
||||
"private": true, |
|
||||
"scripts": { |
|
||||
"serve": "vue-cli-service serve", |
|
||||
"test": "vue-cli-service build --mode test", |
|
||||
"build": "vue-cli-service build" |
|
||||
}, |
|
||||
"dependencies": { |
|
||||
"@nutui/nutui-jdl": "^1.0.5", |
|
||||
"ant-design-vue": "^1.7.2", |
|
||||
"axios": "^1.4.0", |
|
||||
"core-js": "^3.6.5", |
|
||||
"dayjs": "^1.11.9", |
|
||||
"echarts": "^5.6.0", |
|
||||
"install": "^0.13.0", |
|
||||
"npm": "^11.1.0", |
|
||||
"reqwest": "^2.0.5", |
|
||||
"scss": "^0.2.4", |
|
||||
"scss-loader": "^0.0.1", |
|
||||
"stylus-loader": "^3.0.2", |
|
||||
"vant": "^2.12.54", |
|
||||
"vue": "^2.6.11", |
|
||||
"vue-esign": "^1.1.4", |
|
||||
"vue-infinite-scroll": "^2.0.2", |
|
||||
"vue-quill-editor": "^3.0.6", |
|
||||
"vue-router": "^3.2.0", |
|
||||
"vuex": "^3.4.0", |
|
||||
"vuex-persistedstate": "^4.1.0" |
|
||||
}, |
|
||||
"devDependencies": { |
|
||||
"@vue/cli-plugin-babel": "~4.5.19", |
|
||||
"@vue/cli-plugin-router": "~4.5.19", |
|
||||
"@vue/cli-plugin-vuex": "~4.5.19", |
|
||||
"@vue/cli-service": "~4.5.19", |
|
||||
"less": "^3.0.4", |
|
||||
"less-loader": "^5.0.0", |
|
||||
"postcss-px-to-viewport": "^1.1.1", |
|
||||
"vue-template-compiler": "^2.6.11" |
|
||||
} |
|
||||
} |
|
||||
@ -1,22 +0,0 @@ |
|||||
module.exports = { |
|
||||
plugins: { |
|
||||
'postcss-px-to-viewport': { |
|
||||
// options
|
|
||||
unitToConvert: 'px', |
|
||||
viewportWidth: 1100, |
|
||||
unitPrecision: 2, |
|
||||
propList: ['*'], |
|
||||
viewportUnit: 'vw', |
|
||||
fontViewportUnit: 'vw', |
|
||||
selectorBlackList: [], |
|
||||
minPixelValue: 1, |
|
||||
mediaQuery: false, |
|
||||
replace: true, |
|
||||
exclude: undefined, |
|
||||
include: undefined, |
|
||||
landscape: false, |
|
||||
landscapeUnit: 'vw', |
|
||||
landscapeWidth: 700 |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
@ -1,30 +0,0 @@ |
|||||
<!DOCTYPE html> |
|
||||
<html lang=""> |
|
||||
|
|
||||
<head> |
|
||||
<meta charset="utf-8"> |
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|
||||
<meta name="viewport" |
|
||||
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"> |
|
||||
<link rel="icon" href="<%= BASE_URL %>logo.jpg"> |
|
||||
<title>绿道质控</title> |
|
||||
<meta http-equiv="Pragma" content="no-cache"> |
|
||||
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"> |
|
||||
<meta http-equiv="Expires" content="0"> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<noscript> |
|
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. |
|
||||
Please enable it to continue.</strong> |
|
||||
</noscript> |
|
||||
<div id="app"></div> |
|
||||
<!-- built files will be auto injected --> |
|
||||
<!-- <script type="text/javascript" src="./vconsole.js"></script> --> |
|
||||
<script type="text/javascript" src="./uni.webview.1.5.4.js"></script> |
|
||||
<script> |
|
||||
// var vConsole = new VConsole() |
|
||||
</script> |
|
||||
</body> |
|
||||
|
|
||||
</html> |
|
||||
|
Before Width: | Height: | Size: 9.9 KiB |
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,368 +0,0 @@ |
|||||
<!-- |
|
||||
* @Author: gaowenya |
|
||||
* @email: gaowenya_a@163.com |
|
||||
* @Date: 2023-06-19 09:38:10 |
|
||||
* @LastEditors: |
|
||||
* @LastEditTime: |
|
||||
--> |
|
||||
<template> |
|
||||
<a-config-provider :locale="locale"> |
|
||||
<div id="app" class="storm"> |
|
||||
<a-spin tip="正在请求..." class="zhezhao" :spinning="spinning"> |
|
||||
<div class="storm-container"> |
|
||||
<!-- <Nav /> --> |
|
||||
<div class="storm-content"> |
|
||||
<router-view /> |
|
||||
</div> |
|
||||
</div> |
|
||||
</a-spin> |
|
||||
<!-- 全局计时 $route.name !== 'PatientList' && --> |
|
||||
<Dragger v-if="getCount" ref="timer" class="count-container"> |
|
||||
<div class="count-name">静脉溶栓</div> |
|
||||
<!-- <van-count-down :time="getCount" format="mm:ss" /> --> |
|
||||
<Count /> |
|
||||
</Dragger> |
|
||||
<!-- 测评提示信息弹窗 --> |
|
||||
<a-modal class="patient-create patient-form" :width="518" :maskClosable="false" :closable="false" |
|
||||
:destroyOnClose="true" v-model="tip.visible" title="提示" @ok="tipConfirm" okText="去测评" cancelText="忽略"> |
|
||||
<div class="modal-content"> |
|
||||
{{ tip.content }} |
|
||||
</div> |
|
||||
</a-modal> |
|
||||
<!-- --> |
|
||||
<a-modal class="patient-create patient-form" :width="518" :maskClosable="false" :closable="false" |
|
||||
:destroyOnClose="true" v-model="tip.Lnspect" title="提示" @ok="LnspectConfirm" @cancel="LnspectCancel" |
|
||||
okText="查看" cancelText="忽略"> |
|
||||
<div class="modal-content">检验结果已完成, 请前往查看</div> |
|
||||
</a-modal> |
|
||||
</div> |
|
||||
</a-config-provider> |
|
||||
</template> |
|
||||
<script> |
|
||||
import zhCN from 'ant-design-vue/es/locale/zh_CN'; // 引入中文语言包 |
|
||||
import Dragger from './components/dragger.vue'; |
|
||||
import Count from './components/count.vue'; |
|
||||
import { |
|
||||
messageQuery |
|
||||
} from 'api'; |
|
||||
import { |
|
||||
mapMutations, |
|
||||
mapState |
|
||||
} from 'vuex'; |
|
||||
import Nav from 'components/Nav.vue'; |
|
||||
export default { |
|
||||
components: { |
|
||||
Nav, |
|
||||
Dragger, |
|
||||
Count, |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
locale: zhCN, // 设置为中文 |
|
||||
routeName: '', |
|
||||
tip: { |
|
||||
// 提示信息 |
|
||||
visible: false, //测评 |
|
||||
Lnspect: false, //检验 |
|
||||
content: '', |
|
||||
k: null, |
|
||||
}, |
|
||||
request: 0, |
|
||||
pushRouter: { |
|
||||
0: 'Inspect', |
|
||||
1: 'Image', |
|
||||
2: 'Min', |
|
||||
}, |
|
||||
titleForm: { |
|
||||
'0min': 'JMRS-Q-NIHSS', |
|
||||
'15min': 'JMRS-15-NIHSS', |
|
||||
'30min': 'JMRS-30-NIHSS', |
|
||||
'45min': 'JMRS-45-NIHSS', |
|
||||
'60min': 'JMRS-60-NIHSS', |
|
||||
}, |
|
||||
}; |
|
||||
}, |
|
||||
computed: { |
|
||||
...mapState('storm', ['spinning', 'showNav']), |
|
||||
...mapState('patient', ['patientData', 'timerData', 'overviewType']), |
|
||||
getCount() { |
|
||||
const { |
|
||||
timerData, |
|
||||
patientData |
|
||||
} = this; |
|
||||
if (!timerData && !patientData) return null; |
|
||||
if (timerData.firstAidId !== patientData.firstAidId) return null; |
|
||||
const { |
|
||||
countdown |
|
||||
} = timerData; |
|
||||
if (!countdown) return null; |
|
||||
// const totalSeconds = countdown; |
|
||||
// // ?️ 获取完整分钟数 |
|
||||
// const minutes = Math.floor(totalSeconds / 60); |
|
||||
// // ?️ 获得剩余的秒数 |
|
||||
// const seconds = totalSeconds % 60; |
|
||||
// // ✅ 格式化为 MM:SS |
|
||||
// const result = `${this.padTo2Digits(minutes)}:${this.padTo2Digits(seconds)}`; |
|
||||
// console.log(result); // ?️ "09:25" |
|
||||
return parseInt(countdown) * 1000; |
|
||||
}, |
|
||||
}, |
|
||||
watch: { |
|
||||
overviewType: { |
|
||||
deep: true, |
|
||||
handler(n, o) { |
|
||||
if (n === 'overview' || n === 'info') { |
|
||||
this.queryMessage(); |
|
||||
} |
|
||||
}, |
|
||||
}, |
|
||||
$route: { |
|
||||
deep: true, |
|
||||
handler(n, o) { |
|
||||
if (n.name === 'PatientList') { |
|
||||
this.setTimerData({}); |
|
||||
} |
|
||||
if (n.name === 'PatientDetails') { |
|
||||
// this.request = 0; |
|
||||
} |
|
||||
if ( |
|
||||
n.path !== '/' && |
|
||||
n.name !== 'PatientList' && |
|
||||
n.name !== 'Min' |
|
||||
) { |
|
||||
this.init(); |
|
||||
} |
|
||||
}, |
|
||||
}, |
|
||||
}, |
|
||||
methods: { |
|
||||
...mapMutations('patient', ['setTimerData']), |
|
||||
padTo2Digits(num) { |
|
||||
return num.toString().padStart(2, '0'); |
|
||||
}, |
|
||||
async init() { |
|
||||
const { |
|
||||
firstAidId |
|
||||
} = this.patientData; |
|
||||
if (!firstAidId) return; |
|
||||
// this.queryMessage(); |
|
||||
await this.handMessageQuery(); |
|
||||
console.log('init', this.$route.name); |
|
||||
this.request = 0; |
|
||||
this.utils.AnimationFrame.create( |
|
||||
'timerTask', |
|
||||
10000, |
|
||||
true, |
|
||||
(min) => { |
|
||||
this.getMessageQuery(min); |
|
||||
} |
|
||||
); |
|
||||
}, |
|
||||
async queryMessage() { |
|
||||
const { |
|
||||
firstAidId |
|
||||
} = this.patientData; |
|
||||
const res = await messageQuery(firstAidId); |
|
||||
const { |
|
||||
code, |
|
||||
msg |
|
||||
} = res; |
|
||||
if (code === 200) { |
|
||||
this.setTimerData(res.data); |
|
||||
} |
|
||||
}, |
|
||||
// 测评确认 |
|
||||
tipConfirm() { |
|
||||
this.tip.visible = false; |
|
||||
const name = this.pushRouter[this.tip.k]; |
|
||||
console.log('name: ', name); |
|
||||
this.$router.push({ |
|
||||
name, |
|
||||
}); |
|
||||
}, |
|
||||
// 检验调取确认 |
|
||||
LnspectConfirm() { |
|
||||
this.LnspectCancel(); |
|
||||
this.$router.push({ |
|
||||
name: 'Inspect', |
|
||||
}); |
|
||||
}, |
|
||||
LnspectCancel() { |
|
||||
this.tip.Lnspect = false; |
|
||||
this.$forceUpdate(); |
|
||||
}, |
|
||||
// 消息提示 |
|
||||
async handMessageQuery() { |
|
||||
// 异步 |
|
||||
const { |
|
||||
firstAidId |
|
||||
} = this.patientData; |
|
||||
if (firstAidId) { |
|
||||
const res = await messageQuery(firstAidId); |
|
||||
const { |
|
||||
code, |
|
||||
msg |
|
||||
} = res; |
|
||||
if (code === 200) { |
|
||||
this.setTimerData(res.data); |
|
||||
const { |
|
||||
map, |
|
||||
haveFlagInspect |
|
||||
} = res.data; |
|
||||
console.log('firstAidInspectDataDtos: ', haveFlagInspect); |
|
||||
for (let k in map) { |
|
||||
if (map[k]) { |
|
||||
this.taskList = { |
|
||||
text: map[k], |
|
||||
status: false, |
|
||||
}; |
|
||||
} |
|
||||
if (map[k] && this.taskList.status === false) { |
|
||||
// 记录不重复弹窗 |
|
||||
if (this.taskList.text === map[k]) { |
|
||||
this.taskList.status = true; |
|
||||
} |
|
||||
if ( |
|
||||
this.$route.name !== 'Min' && |
|
||||
this.$route.name !== 'PatientList' |
|
||||
) { |
|
||||
this.tip = { |
|
||||
visible: true, |
|
||||
k, |
|
||||
content: map[k], |
|
||||
}; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
// 检验调取 判断是否有急诊号 1 弹窗, 0 不弹窗 |
|
||||
if (haveFlagInspect) { |
|
||||
if ( |
|
||||
this.$route.name !== 'Inspect' && |
|
||||
this.$route.name !== 'PatientList' |
|
||||
) { |
|
||||
this.tip.Lnspect = true; |
|
||||
} |
|
||||
} |
|
||||
} else { |
|
||||
this.$message.error(msg); |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
async getMessageQuery(min, firstAidId) { |
|
||||
const n = min; |
|
||||
if (this.request === n) { |
|
||||
// 符合轮训条件 |
|
||||
console.log('十秒'); |
|
||||
this.request = n + 1; |
|
||||
await this.handMessageQuery(); |
|
||||
} |
|
||||
}, |
|
||||
}, |
|
||||
}; |
|
||||
</script> |
|
||||
<style lang="less"> |
|
||||
.zhezhao { |
|
||||
position: fixed; |
|
||||
left: 0; |
|
||||
top: 0; |
|
||||
width: 100vw; |
|
||||
height: 100vh; |
|
||||
z-index: 999; |
|
||||
} |
|
||||
|
|
||||
#app { |
|
||||
font-family: Avenir, Helvetica, Arial, sans-serif; |
|
||||
-webkit-font-smoothing: antialiased; |
|
||||
-moz-osx-font-smoothing: grayscale; |
|
||||
// text-align: center; |
|
||||
color: #2c3e50; |
|
||||
background: #f6f8fa; |
|
||||
height: 100%; |
|
||||
position: relative; |
|
||||
|
|
||||
::-webkit-scrollbar { |
|
||||
display: none; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
// .count-container { |
|
||||
// width: 200px; |
|
||||
// background: rgba(255, 255, 255, 0.1); |
|
||||
// border: 1px solid #ffffff; |
|
||||
// box-shadow: 0px 6px 10px 0px rgba(0, 59, 172, 0.2); |
|
||||
// border-radius: 4px; |
|
||||
// overflow: hidden; |
|
||||
// backdrop-filter: blur(4px); |
|
||||
// text-align: center; |
|
||||
// display: flex; |
|
||||
// flex-direction: column; |
|
||||
// align-items: center; |
|
||||
// padding: 16px 0; |
|
||||
// z-index: 999; |
|
||||
|
|
||||
// .count-name { |
|
||||
// font-size: 26px; |
|
||||
// font-family: Source Han Sans CN, Source Han Sans CN-Bold; |
|
||||
// font-weight: 700; |
|
||||
// color: #393d4e; |
|
||||
// line-height: 26px; |
|
||||
// padding-bottom: 7px; |
|
||||
// } |
|
||||
|
|
||||
// .van-count-down { |
|
||||
// font-size: 44px; |
|
||||
// font-family: Source Han Sans CN, Source Han Sans CN-Bold; |
|
||||
// font-weight: 700; |
|
||||
// color: #393d4e; |
|
||||
// line-height: 44px; |
|
||||
// } |
|
||||
// } |
|
||||
</style> |
|
||||
<style lang="stylus"> |
|
||||
// @import './assets/portrait.styl'; |
|
||||
@import './assets/less/common.less'; |
|
||||
|
|
||||
html { |
|
||||
overflow: hidden !important; |
|
||||
} |
|
||||
|
|
||||
html, |
|
||||
body, |
|
||||
#app { |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
font-size: 1.2rem |
|
||||
} |
|
||||
|
|
||||
.zhezhao .ant-spin-container { |
|
||||
height: 100% |
|
||||
} |
|
||||
|
|
||||
.ant-modal div[aria-hidden="true"] { |
|
||||
display: none !important; |
|
||||
} |
|
||||
|
|
||||
.storm { |
|
||||
display: flex; |
|
||||
flex: 1; |
|
||||
|
|
||||
.storm-container { |
|
||||
display: flex; |
|
||||
flex-direction: column; |
|
||||
height: 100%; |
|
||||
background: linear-gradient(180deg, #dbeaff, #fbfdff); |
|
||||
|
|
||||
.header { |
|
||||
// height: 88px; |
|
||||
} |
|
||||
|
|
||||
.storm-content { |
|
||||
flex: 1; |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
overflow-y: auto; |
|
||||
display: flex; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,333 +0,0 @@ |
|||||
import axios from 'axios'; |
|
||||
let { |
|
||||
proxyUrl |
|
||||
} = require('@/config/setting'); |
|
||||
let proxyUrl1 = proxyUrl + '/workstation'; |
|
||||
//查询民族列表
|
|
||||
export const getNation = () => axios.post(`${proxyUrl1}/sys/nation/list`); |
|
||||
// 查询菜单
|
|
||||
export const getRouters = (params) => |
|
||||
axios.get(`${proxyUrl1}/getRouters`, params); |
|
||||
|
|
||||
// 查询平车、平板设备列表
|
|
||||
export const selectList = (params) => |
|
||||
axios.post(`${proxyUrl1}/remoteDevice/selectList `, params); |
|
||||
|
|
||||
// 查询患者列表
|
|
||||
export const getList = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/list`, params); |
|
||||
|
|
||||
// 查询分诊患者列表
|
|
||||
export const queryTriageList = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/queryTriageList`, params); |
|
||||
|
|
||||
// 创建患者
|
|
||||
export const create = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/create`, params); |
|
||||
|
|
||||
|
|
||||
//根据id，查询患者信息，回写患者信息
|
|
||||
export const queryById = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/queryById`, params); |
|
||||
|
|
||||
// 编辑患者
|
|
||||
|
|
||||
export const eduitPatient = (params) => |
|
||||
axios.post(`${proxyUrl1}//firstAid/eduitPatient`, params); |
|
||||
|
|
||||
|
|
||||
// 查病历数据
|
|
||||
export const queryAidRecord = (firstAidId, codeList) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/queryAidRecord`, { |
|
||||
param: { |
|
||||
firstAidId, |
|
||||
codeList |
|
||||
}, |
|
||||
}); |
|
||||
|
|
||||
// 更新急救code信息
|
|
||||
export const saveAidRecord = (param) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/saveAidRecord`, { |
|
||||
param |
|
||||
}); |
|
||||
|
|
||||
// 更新急救基本信息
|
|
||||
export const updateAidBase = (param) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/update`, { |
|
||||
param |
|
||||
}); |
|
||||
|
|
||||
//溶栓记录
|
|
||||
export const queryLog = (param) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/queryLog`, { |
|
||||
param |
|
||||
}); |
|
||||
|
|
||||
//医嘱查询
|
|
||||
export const adviceQuery = (param) => |
|
||||
axios.post(`${proxyUrl1}/advice/query`, { |
|
||||
param |
|
||||
}); |
|
||||
|
|
||||
//下发医嘱
|
|
||||
export const adviceAdd = (params) => |
|
||||
axios.post(`${proxyUrl1}/advice/add`, { |
|
||||
...params |
|
||||
}); |
|
||||
|
|
||||
//推送结果
|
|
||||
export const messageQuery = (firstAidId) => |
|
||||
axios.post(`${proxyUrl1}/message/query`, { |
|
||||
firstAidId |
|
||||
}); |
|
||||
|
|
||||
export function uploadIdcard(data) { |
|
||||
return axios({ |
|
||||
url: `${proxyUrl1}/sys/ocr/idcardInfo`, |
|
||||
method: 'POST', |
|
||||
data: data, |
|
||||
headers: { |
|
||||
'Content-Type': 'multipart/form-data', |
|
||||
}, |
|
||||
}); |
|
||||
} |
|
||||
export const idcardInfo = `${proxyUrl1}/sys/ocr/idcardInfo`; |
|
||||
|
|
||||
// 创建急救身份证扫描
|
|
||||
|
|
||||
export const idcardInfoBase64 = (picBase64) => |
|
||||
axios.post(`${proxyUrl1}/sys/ocr/idcardInfoBase64`, { |
|
||||
picBase64 |
|
||||
}); |
|
||||
|
|
||||
//知情同意新增
|
|
||||
export const saveInformedConsent = (params) => |
|
||||
axios.post(`${proxyUrl1}/informed/saveInformedConsent`, { |
|
||||
...params |
|
||||
}); |
|
||||
|
|
||||
// 查询是否有进行中的急救
|
|
||||
export const queryFree = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/queryFree`, { |
|
||||
...params |
|
||||
}); |
|
||||
|
|
||||
export const endFirstAid = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/endFirstAid `, {}); |
|
||||
//知情同意查询
|
|
||||
export const queryConsentResult = (params) => |
|
||||
axios.post(`${proxyUrl1}/informed/queryConsentResult`, { |
|
||||
param: { |
|
||||
...params |
|
||||
}, |
|
||||
}); |
|
||||
|
|
||||
//查看知情同意时添加谈话时间
|
|
||||
export const thTime = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/thTime`, { |
|
||||
...params |
|
||||
}); |
|
||||
|
|
||||
// 上传文件
|
|
||||
export function uploadfile(data) { |
|
||||
return axios({ |
|
||||
url: `${proxyUrl}/file/upload`, |
|
||||
method: 'POST', |
|
||||
data: data, |
|
||||
headers: { |
|
||||
'Content-Type': 'multipart/form-data', |
|
||||
}, |
|
||||
}); |
|
||||
} |
|
||||
|
|
||||
// 上传文件
|
|
||||
export function uploadBase64(data) { |
|
||||
return axios({ |
|
||||
url: `${proxyUrl}/file/uploadBase64`, |
|
||||
method: 'POST', |
|
||||
data: data, |
|
||||
headers: { |
|
||||
'Content-Type': 'multipart/form-data', |
|
||||
}, |
|
||||
}); |
|
||||
} |
|
||||
// 查询平车状态
|
|
||||
export const queryByPadNo = (params) => |
|
||||
axios.post(`${proxyUrl1}/car/queryByPadNo`, { |
|
||||
param: { |
|
||||
...params |
|
||||
} |
|
||||
}); |
|
||||
// 血样报告
|
|
||||
export const queryFirstAidInspectData = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/queryFirstAidInspectData`, { |
|
||||
...params, |
|
||||
}); |
|
||||
// 查询下一个节点
|
|
||||
export const getNextNode = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/next`, { |
|
||||
param: { |
|
||||
...params |
|
||||
} |
|
||||
}); |
|
||||
|
|
||||
//导出急救记录
|
|
||||
export const exportFirstAid = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/export`, { |
|
||||
param: { |
|
||||
...params |
|
||||
} |
|
||||
}); |
|
||||
|
|
||||
// 溶栓介入视频
|
|
||||
export const queryVideo = (param) => |
|
||||
axios.post(`${proxyUrl1}/video/query`, { |
|
||||
param: { |
|
||||
...param |
|
||||
} |
|
||||
}); |
|
||||
|
|
||||
// 溶栓介入视频
|
|
||||
export const queryBook = (param) => |
|
||||
axios.post(`${proxyUrl1}/informed/queryConsentTemplate`, { |
|
||||
param: { |
|
||||
...param |
|
||||
}, |
|
||||
}); |
|
||||
|
|
||||
// 溶栓介入视频
|
|
||||
export const queryWeight = (firstAidId) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/weight`, { |
|
||||
firstAidId: firstAidId, |
|
||||
}); |
|
||||
|
|
||||
// 修改急救信息
|
|
||||
export const updateFirstAid = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/update`, { |
|
||||
param: { |
|
||||
...params |
|
||||
} |
|
||||
}); |
|
||||
|
|
||||
// ------------平车相关操作------------
|
|
||||
// 授权
|
|
||||
export const remoteAuth = (params) => |
|
||||
axios.post(`${proxyUrl1}/mqtt/remoteAuth`, { |
|
||||
...params |
|
||||
}); |
|
||||
|
|
||||
// 电池容量
|
|
||||
export const remoteKljCapacity = (params) => |
|
||||
axios.post(`${proxyUrl1}/mqtt/remoteKljCapacity`, { |
|
||||
...params |
|
||||
}); |
|
||||
// 设备重启
|
|
||||
export const remoteReboot = (params) => |
|
||||
axios.post( |
|
||||
`${proxyUrl1}/mqtt/remoteReboot
|
|
||||
`, {
|
|
||||
...params |
|
||||
} |
|
||||
); |
|
||||
// 发送远程rfid消息
|
|
||||
export const remoteRfid = (params) => |
|
||||
axios.post( |
|
||||
`${proxyUrl1}/mqtt/remoteRfid
|
|
||||
`, {
|
|
||||
...params |
|
||||
} |
|
||||
); |
|
||||
// 发送远程设备心跳（校时）消息
|
|
||||
export const remoteTime = (params) => |
|
||||
axios.post( |
|
||||
`${proxyUrl1}/mqtt/remoteTime
|
|
||||
`, {
|
|
||||
...params |
|
||||
} |
|
||||
); |
|
||||
// 称重校准
|
|
||||
export const remoteWeightCalibration = (params) => |
|
||||
axios.post( |
|
||||
`${proxyUrl1}/mqtt/remoteWeightCalibration
|
|
||||
`, {
|
|
||||
...params |
|
||||
} |
|
||||
); |
|
||||
|
|
||||
// 病例统计
|
|
||||
export const getCtInfoPath = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/getCtInfoPath`, { |
|
||||
...params |
|
||||
}); |
|
||||
|
|
||||
|
|
||||
// 我的
|
|
||||
export const loginInfo = (params) => |
|
||||
axios.post(`${proxyUrl1}/home/loginInfo`, { |
|
||||
...params |
|
||||
}); |
|
||||
|
|
||||
// RPT统计
|
|
||||
export const queryRptResult = (params) => |
|
||||
axios.post(`${proxyUrl1}/home/queryRptResult`, { |
|
||||
...params |
|
||||
}); |
|
||||
// DPT统计 / 血管内治疗率
|
|
||||
export const queryDptResult = (params) => |
|
||||
axios.post(`${proxyUrl1}/home/queryDptResult`, { |
|
||||
...params |
|
||||
}); |
|
||||
// 血管内治疗数据对比
|
|
||||
export const selectXgzl = (params) => |
|
||||
axios.post(`${proxyUrl1}/home/selectXgzl`, { |
|
||||
...params |
|
||||
}); |
|
||||
// SICH发生率
|
|
||||
export const querySichResult = (params) => |
|
||||
axios.post(`${proxyUrl1}/home/querySichResult`, { |
|
||||
...params |
|
||||
}); |
|
||||
// SICHDNT分布
|
|
||||
export const queryDntResult = (params) => |
|
||||
axios.post(`${proxyUrl1}/home/queryDntResult`, { |
|
||||
...params |
|
||||
}); |
|
||||
// 静脉溶栓数据对比 / 静脉溶栓率
|
|
||||
export const queryJmrs = (params) => |
|
||||
axios.post(`${proxyUrl1}/home/queryJmrs`, { |
|
||||
...params |
|
||||
}); |
|
||||
// 病例统计数据分析
|
|
||||
export const queryByDatePatient = (params) => |
|
||||
axios.post(`${proxyUrl1}/home/queryByDatePatient`, { |
|
||||
...params |
|
||||
}); |
|
||||
// 病例统计
|
|
||||
export const queryPatient = (params) => |
|
||||
axios.post(`${proxyUrl1}/home/queryPatient`, { |
|
||||
...params |
|
||||
}); |
|
||||
// 介入手术记录/总报告/DNT时间表
|
|
||||
export const operationLog = (params) => |
|
||||
axios.post(`${proxyUrl1}/interfere/operationLog`, { |
|
||||
...params |
|
||||
}); |
|
||||
|
|
||||
// 介入手术记录/总报告/DNT时间表
|
|
||||
export const operationLogEx = (params) => |
|
||||
axios.post(`${proxyUrl1}//export/operationLog`, { |
|
||||
...params |
|
||||
}); |
|
||||
// 创建急救
|
|
||||
export const createFirstAid = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/createFirstAid`, { |
|
||||
...params |
|
||||
}); |
|
||||
export const createPatient = (params) => |
|
||||
axios.post(`${proxyUrl1}/firstAid/createPatient`, { |
|
||||
...params |
|
||||
}); |
|
||||
// export const eduitPatient = (params) =>
|
|
||||
// axios.post(`${proxyUrl1}/firstAid/eduitPatient`, {
|
|
||||
// ...params
|
|
||||
// });
|
|
||||
@ -1,14 +0,0 @@ |
|||||
import axios from 'axios'; |
|
||||
let { |
|
||||
proxyUrl |
|
||||
} = require('@/config/setting'); |
|
||||
let proxyUrl1 = proxyUrl + '/workstation'; |
|
||||
// 登录
|
|
||||
export const Login = (params) => |
|
||||
axios.post(`${proxyUrl}/auth/pad/login`, params); |
|
||||
|
|
||||
export const Loginnew = (params) => |
|
||||
axios.post(`${proxyUrl}/auth/login`, params); |
|
||||
// 登录
|
|
||||
export const queryUser = (params) => |
|
||||
axios.post(`${proxyUrl1}/sys/queryUsername`, params); |
|
||||
|
Before Width: | Height: | Size: 76 KiB |
|
Before Width: | Height: | Size: 70 KiB |
|
Before Width: | Height: | Size: 16 KiB |
|
Before Width: | Height: | Size: 37 KiB |
|
Before Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 70 KiB |
|
Before Width: | Height: | Size: 90 KiB |
|
Before Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 3.9 KiB |
|
Before Width: | Height: | Size: 108 KiB |
|
Before Width: | Height: | Size: 75 KiB |
|
Before Width: | Height: | Size: 99 KiB |
|
Before Width: | Height: | Size: 200 KiB |
|
Before Width: | Height: | Size: 673 KiB |
|
Before Width: | Height: | Size: 888 KiB |
|
Before Width: | Height: | Size: 9.9 KiB |
|
Before Width: | Height: | Size: 69 KiB |
|
Before Width: | Height: | Size: 72 KiB |
|
Before Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 72 KiB |
|
Before Width: | Height: | Size: 446 B |
|
Before Width: | Height: | Size: 512 B |
|
Before Width: | Height: | Size: 551 B |
|
Before Width: | Height: | Size: 360 B |
|
Before Width: | Height: | Size: 6.1 KiB |
|
Before Width: | Height: | Size: 894 B |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 71 KiB |
|
Before Width: | Height: | Size: 198 KiB |
|
Before Width: | Height: | Size: 230 KiB |
|
Before Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 978 B |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 145 B |
|
Before Width: | Height: | Size: 65 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 5.9 KiB |
|
Before Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 746 B |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 567 B |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 580 B |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 655 B |
|
Before Width: | Height: | Size: 482 B |
|
Before Width: | Height: | Size: 524 B |
|
Before Width: | Height: | Size: 631 B |
|
Before Width: | Height: | Size: 613 B |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 978 B |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 4.9 KiB |
|
Before Width: | Height: | Size: 5.8 KiB |
@ -1,315 +0,0 @@ |
|||||
.border-b { |
|
||||
border-bottom: 1px solid #ccc; |
|
||||
} |
|
||||
|
|
||||
.relative { |
|
||||
position: relative; |
|
||||
} |
|
||||
|
|
||||
.absolute { |
|
||||
position: absolute; |
|
||||
} |
|
||||
|
|
||||
.d-flex { |
|
||||
display: flex; |
|
||||
} |
|
||||
|
|
||||
.flex-wrap { |
|
||||
flex-wrap: wrap; |
|
||||
} |
|
||||
|
|
||||
.flex-nowrap { |
|
||||
flex-wrap: nowrap; |
|
||||
} |
|
||||
|
|
||||
.flex-column { |
|
||||
flex-direction: column; |
|
||||
} |
|
||||
|
|
||||
.flex-column-reverse { |
|
||||
flex-direction: column-reverse; |
|
||||
} |
|
||||
|
|
||||
.flex-row { |
|
||||
flex-direction: row; |
|
||||
} |
|
||||
|
|
||||
.flex-row-reverse { |
|
||||
flex-direction: row-reverse; |
|
||||
} |
|
||||
|
|
||||
.justify-center { |
|
||||
justify-content: center; |
|
||||
} |
|
||||
|
|
||||
.justify-space-between { |
|
||||
justify-content: space-between; |
|
||||
} |
|
||||
|
|
||||
.align-center { |
|
||||
align-items: center; |
|
||||
} |
|
||||
|
|
||||
.flex-1 { |
|
||||
display: flex; |
|
||||
flex: 1; |
|
||||
} |
|
||||
|
|
||||
.flex-2 { |
|
||||
display: flex; |
|
||||
flex: 2; |
|
||||
} |
|
||||
|
|
||||
.flex-3 { |
|
||||
display: flex; |
|
||||
flex: 3; |
|
||||
} |
|
||||
|
|
||||
.pointer { |
|
||||
cursor: pointer; |
|
||||
} |
|
||||
|
|
||||
.ellipsis-2 { |
|
||||
overflow: hidden; |
|
||||
text-overflow: ellipsis; |
|
||||
display: -webkit-box; |
|
||||
-webkit-line-clamp: 2; |
|
||||
-webkit-box-orient: vertical; |
|
||||
} |
|
||||
|
|
||||
.ellipsis-3 { |
|
||||
overflow: hidden; |
|
||||
text-overflow: ellipsis; |
|
||||
display: -webkit-box; |
|
||||
-webkit-line-clamp: 3; |
|
||||
-webkit-box-orient: vertical; |
|
||||
} |
|
||||
|
|
||||
.fz22 { |
|
||||
font-size: 30px; |
|
||||
} |
|
||||
|
|
||||
.border-bottom { |
|
||||
border-bottom: 1px solid #dfe6ec; |
|
||||
} |
|
||||
|
|
||||
.borderNone { |
|
||||
border-bottom: none; |
|
||||
} |
|
||||
|
|
||||
.common-picker { |
|
||||
position: absolute; |
|
||||
bottom: 0; |
|
||||
left: 0; |
|
||||
right: 0; |
|
||||
z-index: 999; |
|
||||
} |
|
||||
|
|
||||
.common-button { |
|
||||
width: 200px; |
|
||||
margin: 0 auto; |
|
||||
margin-bottom: 20px; |
|
||||
} |
|
||||
|
|
||||
.common-slider { |
|
||||
width: 90%; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
flex-direction: column; |
|
||||
position: relative; |
|
||||
margin: 40px 0 20px; |
|
||||
} |
|
||||
|
|
||||
.common-slider .van-stepper--round { |
|
||||
width: 100%; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
justify-content: space-between; |
|
||||
position: relative; |
|
||||
} |
|
||||
|
|
||||
.common-slider .van-stepper--round .van-stepper__minus { |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
color: #7690e5; |
|
||||
border-color: #7690e5; |
|
||||
} |
|
||||
|
|
||||
.common-slider .van-stepper--round .van-stepper__plus { |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
background-color: #7690e5; |
|
||||
} |
|
||||
|
|
||||
.common-slider .van-stepper--round .van-stepper__input { |
|
||||
position: absolute; |
|
||||
left: 50%; |
|
||||
right: 50%; |
|
||||
transform: translate(-50%, -50%); |
|
||||
bottom: 5px; |
|
||||
background: #7690e5; |
|
||||
border-radius: 6px; |
|
||||
font-size: 24px; |
|
||||
font-family: OPPOSans, OPPOSans-Bold; |
|
||||
font-weight: 700; |
|
||||
text-align: center; |
|
||||
color: #ffffff; |
|
||||
padding: 10px 0; |
|
||||
width: 100px; |
|
||||
margin-bottom: 10px; |
|
||||
display: none; |
|
||||
} |
|
||||
|
|
||||
.common-slider .common-slider-slider { |
|
||||
width: 80%; |
|
||||
position: absolute; |
|
||||
bottom: 6px; |
|
||||
height: 16px; |
|
||||
background: #e4edff; |
|
||||
border-radius: 8px; |
|
||||
} |
|
||||
|
|
||||
.common-slider .common-slider-slider .van-slider__button-wrapper { |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
background: #7690e5; |
|
||||
border-radius: 50%; |
|
||||
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.1); |
|
||||
} |
|
||||
|
|
||||
.common-slider .common-slider-slider .ant-input-number { |
|
||||
position: absolute; |
|
||||
left: 50%; |
|
||||
right: 50%; |
|
||||
bottom: 20px; |
|
||||
transform: translate(-50%, -50%); |
|
||||
font-size: 24px; |
|
||||
font-family: OPPOSans, OPPOSans-Bold; |
|
||||
font-weight: 700; |
|
||||
height: auto; |
|
||||
padding: 4px 0; |
|
||||
text-align: center; |
|
||||
background: #7690e5; |
|
||||
border-radius: 6px; |
|
||||
color: #fff; |
|
||||
} |
|
||||
|
|
||||
.common-slider .common-slider-slider .ant-input-number .ant-input-number-input { |
|
||||
text-align: center; |
|
||||
} |
|
||||
|
|
||||
.common-slider .common-slider-slider .ant-input-number .ant-input-number-handler-wrap { |
|
||||
display: none; |
|
||||
} |
|
||||
|
|
||||
.common-slider .common-slider-slider .slider-icon { |
|
||||
position: absolute; |
|
||||
top: -23px; |
|
||||
left: 2px; |
|
||||
color: #7690e5; |
|
||||
font-size: 26px; |
|
||||
} |
|
||||
|
|
||||
.ant-form .ant-form-item-label { |
|
||||
text-align: left; |
|
||||
} |
|
||||
|
|
||||
.ant-form label { |
|
||||
font-size: 26px !important; |
|
||||
font-weight: 500; |
|
||||
color: #565e6f; |
|
||||
} |
|
||||
|
|
||||
.ant-form .ant-form-item { |
|
||||
margin-bottom: 18px !important; |
|
||||
box-sizing: border-box; |
|
||||
} |
|
||||
|
|
||||
.ant-form .ant-form-item:not(:last-child) { |
|
||||
border-bottom: 1px solid #dfe6ec; |
|
||||
padding-bottom: 18px; |
|
||||
} |
|
||||
|
|
||||
.ant-form .dose-item { |
|
||||
margin-bottom: 40px !important; |
|
||||
} |
|
||||
|
|
||||
.ant-form .mb0 { |
|
||||
margin-bottom: 0px !important; |
|
||||
} |
|
||||
|
|
||||
.ant-form .borderNone { |
|
||||
border-bottom: none !important; |
|
||||
} |
|
||||
|
|
||||
.ant-form .ant-radio-button-wrapper { |
|
||||
padding: 0 18px; |
|
||||
height: 40px; |
|
||||
line-height: 40px; |
|
||||
font-size: 18px !important; |
|
||||
margin-right: 20px; |
|
||||
margin-bottom: 10px; |
|
||||
background: #f8f8f9; |
|
||||
border: 0.5px solid #a3acbf; |
|
||||
border-radius: 6px; |
|
||||
vertical-align: middle; |
|
||||
} |
|
||||
|
|
||||
.ant-form .ant-radio-button-wrapper:before, |
|
||||
.ant-form .ant-radio-button-wrapper .ant-radio-button-wrapper-checked:before { |
|
||||
display: none !important; |
|
||||
} |
|
||||
|
|
||||
.ant-form .ant-radio-button-wrapper:first-child, |
|
||||
.ant-form .ant-radio-button-wrapper:last-child { |
|
||||
border-radius: 6px !important; |
|
||||
} |
|
||||
|
|
||||
.ant-form .ant-radio-button-wrapper:last-child { |
|
||||
margin-right: 0; |
|
||||
} |
|
||||
|
|
||||
.ant-form .ant-form-item-control { |
|
||||
text-align: left; |
|
||||
margin-left: 10px; |
|
||||
} |
|
||||
|
|
||||
.solid .ant-checkbox-wrapper { |
|
||||
background: #f8f8f9; |
|
||||
border: 0.5px solid #a3acbf; |
|
||||
border-radius: 6px; |
|
||||
vertical-align: middle; |
|
||||
margin-right: 20px; |
|
||||
margin-bottom: 10px; |
|
||||
font-size: 1.2vw !important; |
|
||||
line-height: 40px; |
|
||||
padding: 0 18px; |
|
||||
height: 40px; |
|
||||
} |
|
||||
|
|
||||
.solid .ant-checkbox-wrapper.ant-checkbox-wrapper-checked { |
|
||||
background: #7690e5; |
|
||||
color: #fff; |
|
||||
} |
|
||||
|
|
||||
.solid .ant-checkbox-wrapper .ant-checkbox { |
|
||||
display: none; |
|
||||
} |
|
||||
|
|
||||
.ant-tabs-nav-container .ant-tabs-tab { |
|
||||
font-size: 20px; |
|
||||
font-family: Source Han Sans CN, Source Han Sans CN-Medium; |
|
||||
font-weight: 500; |
|
||||
text-align: left; |
|
||||
color: #70798c; |
|
||||
} |
|
||||
|
|
||||
.ant-tabs-nav-container .ant-tabs-tab-active { |
|
||||
font-weight: 700; |
|
||||
font-family: Source Han Sans CN, Source Han Sans CN-Bold; |
|
||||
color: #393d4e !important; |
|
||||
} |
|
||||
|
|
||||
.ant-tabs-nav-container .ant-tabs-ink-bar { |
|
||||
background: #7690e5 !important; |
|
||||
} |
|
||||
@ -1,819 +0,0 @@ |
|||||
.border-b { |
|
||||
border-bottom: 1px solid #ccc; |
|
||||
} |
|
||||
|
|
||||
// position |
|
||||
.relative { |
|
||||
position: relative; |
|
||||
} |
|
||||
.absolute { |
|
||||
position: absolute; |
|
||||
} |
|
||||
|
|
||||
// flex |
|
||||
.d-flex{ |
|
||||
display: flex; |
|
||||
} |
|
||||
|
|
||||
.flex-wrap{ |
|
||||
flex-wrap: wrap; |
|
||||
} |
|
||||
|
|
||||
.flex-nowrap{ |
|
||||
flex-wrap: nowrap; |
|
||||
} |
|
||||
|
|
||||
.flex-column{ |
|
||||
flex-direction: column; |
|
||||
} |
|
||||
|
|
||||
.flex-column-reverse{ |
|
||||
flex-direction: column-reverse; |
|
||||
} |
|
||||
|
|
||||
.flex-row{ |
|
||||
flex-direction: row; |
|
||||
} |
|
||||
|
|
||||
.flex-row-reverse{ |
|
||||
flex-direction: row-reverse; |
|
||||
} |
|
||||
|
|
||||
.justify-center{ |
|
||||
justify-content: center; |
|
||||
} |
|
||||
|
|
||||
.justify-space-between{ |
|
||||
justify-content: space-between; |
|
||||
} |
|
||||
|
|
||||
.align-center{ |
|
||||
align-items: center; |
|
||||
} |
|
||||
|
|
||||
.flex-1{ |
|
||||
display: flex; |
|
||||
flex: 1; |
|
||||
} |
|
||||
|
|
||||
.flex-2{ |
|
||||
display: flex; |
|
||||
flex: 2; |
|
||||
} |
|
||||
.flex-3{ |
|
||||
display: flex; |
|
||||
flex: 3; |
|
||||
} |
|
||||
|
|
||||
// other |
|
||||
.pointer{ |
|
||||
cursor:pointer; |
|
||||
} |
|
||||
.ellipsis-2 { |
|
||||
overflow: hidden; |
|
||||
text-overflow: ellipsis; |
|
||||
display: -webkit-box; |
|
||||
-webkit-line-clamp: 2; |
|
||||
-webkit-box-orient: vertical; |
|
||||
} |
|
||||
.ellipsis-3 { |
|
||||
overflow: hidden; |
|
||||
text-overflow: ellipsis; |
|
||||
display: -webkit-box; |
|
||||
-webkit-line-clamp: 3; |
|
||||
-webkit-box-orient: vertical; |
|
||||
} |
|
||||
.font-bold{ |
|
||||
font: bold; |
|
||||
} |
|
||||
.text-left{ |
|
||||
text-align: left; |
|
||||
} |
|
||||
.text-right{ |
|
||||
text-align: right; |
|
||||
} |
|
||||
.text-center{ |
|
||||
text-align: center; |
|
||||
} |
|
||||
.fz20{ |
|
||||
font-size: 20px; |
|
||||
} |
|
||||
.fz22{ |
|
||||
font-size: 30px; |
|
||||
} |
|
||||
.fz24{ |
|
||||
font-size: 24px; |
|
||||
} |
|
||||
.border-bottom{ |
|
||||
border-bottom: 1px solid #dfe6ec; |
|
||||
} |
|
||||
.borderNone{ |
|
||||
border-bottom: none; |
|
||||
} |
|
||||
|
|
||||
.common-picker{ |
|
||||
position: absolute; |
|
||||
bottom: 0; |
|
||||
left: 0; |
|
||||
right: 0; |
|
||||
z-index: 999; |
|
||||
} |
|
||||
.common-button { |
|
||||
width: 200px; |
|
||||
margin: 0 auto; |
|
||||
margin-bottom: 12px; |
|
||||
border-radius: 20px; |
|
||||
} |
|
||||
.common-slider{ |
|
||||
width: 100%; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
flex-direction: column; |
|
||||
position: relative; |
|
||||
margin: 80px 0 20px; |
|
||||
.van-stepper--round{ |
|
||||
width: 90%; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
justify-content: space-between; |
|
||||
position: relative; |
|
||||
.van-stepper__input{ |
|
||||
position: absolute; |
|
||||
left: 50%; |
|
||||
right: 50%; |
|
||||
transform: translate(-50%, -50%); |
|
||||
bottom: 5px; |
|
||||
background: #007AFF; |
|
||||
border-radius: 6px; |
|
||||
font-size: 24px; |
|
||||
font-family: OPPOSans, OPPOSans-Bold; |
|
||||
font-weight: 700; |
|
||||
text-align: center; |
|
||||
color: #ffffff; |
|
||||
padding: 10px 0; |
|
||||
width: 100px; |
|
||||
margin-bottom: 10px; |
|
||||
display: none; |
|
||||
} |
|
||||
.van-stepper__minus{ |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
color: #fff; |
|
||||
color: #007AFF; |
|
||||
border-color: #007AFF; |
|
||||
} |
|
||||
.van-stepper__plus{ |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
background-color: #007AFF; |
|
||||
} |
|
||||
&.one{ |
|
||||
.van-stepper__minus{ |
|
||||
position: absolute; |
|
||||
bottom: 0; |
|
||||
left: 40px; |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
color: #fff; |
|
||||
border-color: #007AFF; |
|
||||
// background-color: #007AFF; |
|
||||
background: linear-gradient(to right, rgba(82, 165, 255, 1), rgba(0, 122, 255, 1)); |
|
||||
} |
|
||||
.van-stepper__plus{ |
|
||||
position: absolute; |
|
||||
bottom: 0; |
|
||||
right: 40px; |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
// background-color: #007AFF; |
|
||||
background: linear-gradient(to right, rgba(82, 165, 255, 1), rgba(0, 122, 255, 1)); |
|
||||
} |
|
||||
} |
|
||||
&.five{ |
|
||||
.van-stepper__minus{ |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
color: #fff; |
|
||||
border-color: #007AFF; |
|
||||
// background-color: #007AFF; |
|
||||
background: linear-gradient(to right, rgba(82, 165, 255, 1), rgba(0, 122, 255, 1)); |
|
||||
&::before{ |
|
||||
content: '-5'; |
|
||||
font-size: 14px; |
|
||||
font-weight: bold; |
|
||||
position: absolute; |
|
||||
top: 4px; |
|
||||
left: 13px; |
|
||||
height: 0; |
|
||||
} |
|
||||
} |
|
||||
.van-stepper__plus{ |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
color: #fff; |
|
||||
border-color: #007AFF; |
|
||||
// background-color: #007AFF; |
|
||||
background: linear-gradient(to right, rgba(82, 165, 255, 1), rgba(0, 122, 255, 1)); |
|
||||
position: relative; |
|
||||
&::before{ |
|
||||
content: '+5'; |
|
||||
font-size: 14px; |
|
||||
font-weight: bold; |
|
||||
position: absolute; |
|
||||
top: 4px; |
|
||||
left: 13px; |
|
||||
height: 0; |
|
||||
// letter-spacing: -1px; |
|
||||
} |
|
||||
&::after{ |
|
||||
display: none; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
&.ten{ |
|
||||
.van-stepper__minus{ |
|
||||
position: absolute; |
|
||||
top: 0; |
|
||||
left: -35px; |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
color: #fff; |
|
||||
border-color: #007AFF; |
|
||||
// background-color: #007AFF; |
|
||||
background: linear-gradient(to right, rgba(82, 165, 255, 1), rgba(0, 122, 255, 1)); |
|
||||
&::before{ |
|
||||
content: '-10'; |
|
||||
font-size: 14px; |
|
||||
font-weight: bold; |
|
||||
position: absolute; |
|
||||
top: 4px; |
|
||||
left: 11px; |
|
||||
height: 0; |
|
||||
// letter-spacing: -1px; |
|
||||
} |
|
||||
} |
|
||||
.van-stepper__plus{ |
|
||||
position: absolute; |
|
||||
top: 0; |
|
||||
right: -35px; |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
color: #fff; |
|
||||
// background-color: #52A5FF; |
|
||||
background: linear-gradient(to right, rgba(82, 165, 255, 1), rgba(0, 122, 255, 1)); |
|
||||
&::before{ |
|
||||
content: '+10'; |
|
||||
font-size: 14px; |
|
||||
font-weight: bold; |
|
||||
position: absolute; |
|
||||
top: 4px; |
|
||||
left: 11px; |
|
||||
height: 0; |
|
||||
// letter-spacing: -1px; |
|
||||
} |
|
||||
&::after{ |
|
||||
display: none; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
.common-slider-slider{ |
|
||||
width: 68%; |
|
||||
position: absolute; |
|
||||
bottom: 6px; |
|
||||
height: 16px; |
|
||||
// background: #e4edff; |
|
||||
background: linear-gradient(to right, #007AFF, #52A5FF); |
|
||||
border-radius: 8px; |
|
||||
.van-slider__button-wrapper{ |
|
||||
width: 30px; |
|
||||
height: 30px; |
|
||||
background-color: #007AFF; |
|
||||
border-radius: 50%; |
|
||||
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.1); |
|
||||
|
|
||||
.inner-circle{ |
|
||||
width: 15px; |
|
||||
height: 15px; |
|
||||
border-radius: 50%; /* 圆形 */ |
|
||||
background-color: white; /* 白色背景 */ |
|
||||
position: absolute; /* 绝对定位 */ |
|
||||
top: 50%; |
|
||||
left: 50%; |
|
||||
transform: translate(-50%, -50%); /* 居中 */ |
|
||||
} |
|
||||
} |
|
||||
.ant-input-number{ |
|
||||
position: absolute; |
|
||||
left: 50%; |
|
||||
right: 50%; |
|
||||
bottom: 18px; |
|
||||
transform: translate(-50%, -50%); |
|
||||
font-size: 24px; |
|
||||
font-family: OPPOSans, OPPOSans-Bold; |
|
||||
font-weight: 700; |
|
||||
height: auto; |
|
||||
padding: 4px 0; |
|
||||
text-align: center; |
|
||||
// background: #7690e5; |
|
||||
background: linear-gradient(to right, rgba(0, 122, 255, 0.7), rgba(0, 122, 255, 1)); |
|
||||
border-radius: 6px; |
|
||||
color: #fff; |
|
||||
.ant-input-number-input{ |
|
||||
text-align: center; |
|
||||
} |
|
||||
.ant-input-number-handler-wrap{ |
|
||||
display: none; |
|
||||
} |
|
||||
} |
|
||||
.van-slider__bar{ |
|
||||
background: linear-gradient(to right, #007AFF, #52A5FF); |
|
||||
// background: linear-gradient(to right, rgba(0, 122, 255, 0.7), rgba(0, 122, 255, 1)); |
|
||||
} |
|
||||
.slider-icon{ |
|
||||
position: absolute; |
|
||||
top: -20px; |
|
||||
left: 2px; |
|
||||
color: #007AFF; |
|
||||
font-size: 26px; |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
.ant-form { |
|
||||
.ant-form-item-label{ |
|
||||
text-align: left; |
|
||||
} |
|
||||
label{ |
|
||||
font-size: 26px ; |
|
||||
font-weight: 500; |
|
||||
color: #565e6f; |
|
||||
} |
|
||||
.ant-form-item{ |
|
||||
&:not(:last-child) { |
|
||||
border-bottom: 1px solid #dfe6ec; |
|
||||
} |
|
||||
box-sizing: border-box; |
|
||||
} |
|
||||
.dose-item{ |
|
||||
margin-bottom: 40px!important; |
|
||||
} |
|
||||
.mb0{ |
|
||||
margin-bottom: 10px!important; |
|
||||
} |
|
||||
.borderNone{ |
|
||||
border-bottom: none!important; |
|
||||
} |
|
||||
.ant-radio-button-wrapper{ |
|
||||
padding: 0 18px; |
|
||||
height: 40px; |
|
||||
line-height: 40px; |
|
||||
font-size: 18px!important; |
|
||||
margin-right: 20px; |
|
||||
margin-bottom: 10px; |
|
||||
background: #f9f9f9; |
|
||||
border: 0.5px solid #a3acbf; |
|
||||
border-radius: 6px; |
|
||||
vertical-align: middle; |
|
||||
&:before, .ant-radio-button-wrapper-checked:before{ |
|
||||
display: none!important; |
|
||||
} |
|
||||
&:first-child, &:last-child{ |
|
||||
border-radius: 6px!important; |
|
||||
} |
|
||||
&:last-child{ |
|
||||
margin-right: 0; |
|
||||
} |
|
||||
} |
|
||||
.ant-form-item-control{ |
|
||||
text-align: left; |
|
||||
margin-left: 10px; |
|
||||
} |
|
||||
} |
|
||||
// .solid{ |
|
||||
// .ant-checkbox-wrapper { |
|
||||
// background: #f9f9f9; |
|
||||
// border: 0.5px solid #a3acbf; |
|
||||
// border-radius: 6px; |
|
||||
// vertical-align: middle; |
|
||||
// margin-right: 20px; |
|
||||
// margin-bottom: 10px; |
|
||||
// font-size: 18px!important; |
|
||||
// line-height: 40px; |
|
||||
// padding: 0 18px; |
|
||||
// height: 40px; |
|
||||
// min-width: 0!important; |
|
||||
// &.ant-checkbox-wrapper-checked{ |
|
||||
// background: #7690e5; |
|
||||
// color: #fff; |
|
||||
// } |
|
||||
// .ant-checkbox{ |
|
||||
// display: none; |
|
||||
// } |
|
||||
// } |
|
||||
// } |
|
||||
.ant-tabs-nav-container{ |
|
||||
.ant-tabs-tab{ |
|
||||
// font-size: 20px; |
|
||||
// font-family: Source Han Sans CN, Source Han Sans CN-Medium; |
|
||||
// font-weight: 500; |
|
||||
// text-align: left; |
|
||||
// color: #70798c; |
|
||||
} |
|
||||
.ant-tabs-tab-active{ |
|
||||
// // font-weight: 700; |
|
||||
// font-family: Source Han Sans CN, Source Han Sans CN-Bold; |
|
||||
// color: #393d4e!important; |
|
||||
} |
|
||||
.ant-tabs-ink-bar{ |
|
||||
// background: #7690e5 !important; |
|
||||
border-bottom: 3px solid transparent; /* 设置透明的底部边框 */ |
|
||||
border-image: linear-gradient(to right, #fff, #007AFF) 1; /* 使用渐变色填充边框 */ |
|
||||
border-radius: 10px; /* 设置圆角 */ |
|
||||
} |
|
||||
} |
|
||||
.ant-modal-wrap { |
|
||||
display: flex; |
|
||||
justify-content: center; |
|
||||
align-items: center; |
|
||||
.ant-modal{ |
|
||||
top: 0; |
|
||||
padding-bottom: 0; |
|
||||
.ant-modal-body { |
|
||||
padding: 26px 26px 20px !important; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.container-left-header { |
|
||||
display: flex; |
|
||||
margin-top: 20px; |
|
||||
margin-bottom: 20px; |
|
||||
span { |
|
||||
width: 12px; |
|
||||
height: 32px; |
|
||||
display: inline-block; |
|
||||
border-radius: 12px; |
|
||||
background: #8FB3FB; |
|
||||
margin-right: 16px; |
|
||||
} |
|
||||
|
|
||||
p { |
|
||||
line-height: 32px; |
|
||||
font-size: 32px; |
|
||||
font-weight: 600; |
|
||||
margin: 0; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
//急诊溶栓记录 |
|
||||
.basic-btn { |
|
||||
height: 72px; |
|
||||
background: linear-gradient(180deg, #b1caff, #83aafa); |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
justify-content: center; |
|
||||
border-radius: 36px; |
|
||||
margin: 60px 20px 0 20px; |
|
||||
|
|
||||
.basic-ico { |
|
||||
margin-right: 10px; |
|
||||
} |
|
||||
|
|
||||
p { |
|
||||
line-height: 72px; |
|
||||
font-weight: 600; |
|
||||
color: #fff; |
|
||||
font-size: 24px; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.container-left-basic { |
|
||||
min-height: 80px; |
|
||||
background: #7690E5; |
|
||||
border-radius: 12px; |
|
||||
margin-bottom: 24px; |
|
||||
color: #70798c; |
|
||||
// 下一节点 |
|
||||
.container-basic-node { |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
padding: 0 24px; |
|
||||
|
|
||||
.basic-p { |
|
||||
font-size: 24px; |
|
||||
color: #fff; |
|
||||
font-weight: 600; |
|
||||
text-align: left; |
|
||||
line-height: 62px; |
|
||||
margin: 0; |
|
||||
max-width: 74%; |
|
||||
white-space: nowrap; |
|
||||
overflow: hidden; |
|
||||
text-overflow: ellipsis; |
|
||||
} |
|
||||
|
|
||||
// 节点倒计时 |
|
||||
.basic-node-time { |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
|
|
||||
p { |
|
||||
margin: 0; |
|
||||
background: #fff; |
|
||||
padding: 2px 6px; |
|
||||
color: #758FE4; |
|
||||
font-weight: 600; |
|
||||
font-size: 18px; |
|
||||
border-radius: 6px; |
|
||||
|
|
||||
} |
|
||||
|
|
||||
span { |
|
||||
font-weight: 600; |
|
||||
font-size: 30px; |
|
||||
color: #fff; |
|
||||
margin: 0 8px; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.leftbasic-centbox { |
|
||||
height: 80px; |
|
||||
background: #fff; |
|
||||
margin-left: 6px; |
|
||||
border-radius: 12px; |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
padding: 0 16px; |
|
||||
} |
|
||||
|
|
||||
.leftbasic-centbox-title { |
|
||||
font-size: 24px; |
|
||||
font-weight: 600; |
|
||||
line-height: 80px; |
|
||||
} |
|
||||
|
|
||||
.leftbasic-centbox-ico { |
|
||||
margin-top: 32px; |
|
||||
} |
|
||||
&.active{ |
|
||||
background: #fff; |
|
||||
.leftbasic-centbox{ |
|
||||
background: #7690E5; |
|
||||
color: #fff; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.container-left-header { |
|
||||
display: flex; |
|
||||
span { |
|
||||
width: 12px; |
|
||||
height: 32px; |
|
||||
display: inline-block; |
|
||||
border-radius: 12px; |
|
||||
background: #8FB3FB; |
|
||||
margin-right: 16px; |
|
||||
} |
|
||||
|
|
||||
p { |
|
||||
line-height: 32px; |
|
||||
font-size: 32px; |
|
||||
font-weight: 600; |
|
||||
margin: 0; |
|
||||
} |
|
||||
} |
|
||||
.basicr-back { |
|
||||
border-radius: 12px; |
|
||||
background: #fff; |
|
||||
padding: 0 28px; |
|
||||
box-shadow: 0 2px 12px 0 rgba(52, 52, 52, .1); |
|
||||
} |
|
||||
.container { |
|
||||
flex: 1; |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
|
|
||||
.container-left { |
|
||||
flex: 1; |
|
||||
padding-left: 20px; |
|
||||
margin-top: 24px; |
|
||||
} |
|
||||
.container-right{ |
|
||||
flex: 2; |
|
||||
overflow-y: auto; |
|
||||
display: flex; |
|
||||
padding-right: 20px; |
|
||||
border-left: 1px solid #C9D1DF; |
|
||||
padding-left: 20px; |
|
||||
margin-left: 20px; |
|
||||
margin-top: 24px; |
|
||||
margin-bottom: 24px; |
|
||||
} |
|
||||
} |
|
||||
.ant-select-dropdown{ |
|
||||
.ant-select-dropdown-menu-item{ |
|
||||
font-size: 16px; |
|
||||
} |
|
||||
} |
|
||||
.detail-form { |
|
||||
.detail-form-control{ |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
} |
|
||||
.ant-form-item { |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
align-items: center; |
|
||||
padding: 12px 0 !important; |
|
||||
margin-bottom: 0 !important; |
|
||||
|
|
||||
.ant-form-item-label { |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
|
|
||||
label { |
|
||||
font-size: 24px !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.ant-radio-wrapper { |
|
||||
height: 30px !important; |
|
||||
font-size: 20px !important; |
|
||||
} |
|
||||
} |
|
||||
.ant-select{ |
|
||||
min-width: 300px; |
|
||||
display: flex; |
|
||||
justify-content: flex-end; |
|
||||
} |
|
||||
.ant-select-selection-selected-value{ |
|
||||
padding-right: 10px; |
|
||||
} |
|
||||
.ant-select-selection__rendered{ |
|
||||
line-height: 40px; |
|
||||
max-width: 300px; |
|
||||
} |
|
||||
.ant-form-item-control-wrapper { |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
justify-content: flex-end; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
.Overviewbasicr { |
|
||||
flex: 1; |
|
||||
display: flex; |
|
||||
flex-direction: column; |
|
||||
margin-bottom: 20px; |
|
||||
} |
|
||||
// 复选框 |
|
||||
.ant-checkbox-group{ |
|
||||
display: flex!important; |
|
||||
flex-wrap: wrap; |
|
||||
.ant-checkbox-wrapper{ |
|
||||
min-width: 30%; |
|
||||
} |
|
||||
.ant-checkbox-checked{ |
|
||||
.ant-checkbox-inner{ |
|
||||
background-color: #7690e5!important; |
|
||||
border-color: #7690e5!important; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
// 详情form-item |
|
||||
.jmrs-form-item { |
|
||||
.jmrs-form-item-con { |
|
||||
|
|
||||
&.checkbox { |
|
||||
flex-direction: column; |
|
||||
.content-right{ |
|
||||
margin-top: 10px; |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
.content-right{ |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
} |
|
||||
.operate { |
|
||||
font-size: 24px; |
|
||||
color: #000000; |
|
||||
padding-right: 12px; |
|
||||
} |
|
||||
.label-info{ |
|
||||
color: #000000; |
|
||||
font-size: 20px; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
// 折叠面板 |
|
||||
// .collapse-content{ |
|
||||
// display: flex; |
|
||||
// justify-content: space-between; |
|
||||
// padding: 5px 0; |
|
||||
// } |
|
||||
// .ant-collapse-arrow, .ant-select-arrow{ |
|
||||
// font-size: 20px!important; |
|
||||
// color: #70798C!important; |
|
||||
// } |
|
||||
|
|
||||
// 知情同意 |
|
||||
.Informed-container { |
|
||||
// padding: 0 0 30px; |
|
||||
|
|
||||
.mt2 { |
|
||||
margin-top: 20px; |
|
||||
} |
|
||||
|
|
||||
.informed-info { |
|
||||
font-size: 1.2rem; |
|
||||
font-weight: bold; |
|
||||
text-align: left; |
|
||||
line-height: 36px; |
|
||||
&.indent { |
|
||||
text-indent: 2em; |
|
||||
} |
|
||||
&.pl{ |
|
||||
padding-left: 20px; |
|
||||
} |
|
||||
|
|
||||
&.informed-info-sky{ |
|
||||
color: #007AFF; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.informed-list { |
|
||||
display: flex; |
|
||||
// flex-wrap: wrap; |
|
||||
justify-content: space-between; |
|
||||
align-items: center; |
|
||||
margin-top: 20px; |
|
||||
|
|
||||
.informed-item { |
|
||||
flex: 1; |
|
||||
display: flex; |
|
||||
// justify-content: space-between; |
|
||||
align-items: center; |
|
||||
margin-bottom: 15px; |
|
||||
margin-right: 10px; |
|
||||
|
|
||||
// margin: 0 10px 20px; |
|
||||
>span { |
|
||||
font-size: 16px; |
|
||||
} |
|
||||
|
|
||||
.item-input { |
|
||||
width: 45%; |
|
||||
} |
|
||||
|
|
||||
.item-sign { |
|
||||
width: 50%; |
|
||||
} |
|
||||
|
|
||||
.item-btn { |
|
||||
color: #7690e5; |
|
||||
border: 1px solid #7690e5; |
|
||||
box-sizing: border-box; |
|
||||
} |
|
||||
|
|
||||
.item-img { |
|
||||
min-width: 120px; |
|
||||
// flex: 1; |
|
||||
height: 40px; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
justify-content: center; |
|
||||
box-sizing: border-box; |
|
||||
margin: 0 5px; |
|
||||
img { |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
} |
|
||||
&.item-img-black{ |
|
||||
background-color: black; |
|
||||
color: #fff; |
|
||||
} |
|
||||
} |
|
||||
.item-img-non { |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
.informed-item1{ |
|
||||
width: 40%; |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
align-items: center; |
|
||||
margin-bottom: 15px; |
|
||||
|
|
||||
.item-input { |
|
||||
width: 60%; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
|
|
||||
@ -1,274 +0,0 @@ |
|||||
.white--text{ |
|
||||
color: #fff; |
|
||||
} |
|
||||
|
|
||||
.text-left { |
|
||||
text-align: left !important; |
|
||||
} |
|
||||
|
|
||||
// padding |
|
||||
.pa-3 { |
|
||||
padding: 12px; |
|
||||
} |
|
||||
|
|
||||
.px-2{ |
|
||||
padding-left: 8px; |
|
||||
padding-right: 8px; |
|
||||
} |
|
||||
|
|
||||
.px-3{ |
|
||||
padding-left: 12px; |
|
||||
padding-right: 12px; |
|
||||
} |
|
||||
|
|
||||
.px-10{ |
|
||||
padding-left: 30px; |
|
||||
padding-right: 30px; |
|
||||
} |
|
||||
|
|
||||
.pb-2 { |
|
||||
padding-bottom: 8px; |
|
||||
} |
|
||||
|
|
||||
.pb-3 { |
|
||||
padding-bottom: 12px; |
|
||||
} |
|
||||
|
|
||||
.pb-4 { |
|
||||
padding-bottom: 16px; |
|
||||
} |
|
||||
|
|
||||
.pb-5 { |
|
||||
padding-bottom: 20px; |
|
||||
} |
|
||||
|
|
||||
.pb-10 { |
|
||||
padding-bottom: 40px; |
|
||||
} |
|
||||
.pr-1 { |
|
||||
padding-right: 4px; |
|
||||
} |
|
||||
.pr-2 { |
|
||||
padding-right: 8px; |
|
||||
} |
|
||||
.pr-3 { |
|
||||
padding-right: 12px; |
|
||||
} |
|
||||
.pr-4 { |
|
||||
padding-right: 18px; |
|
||||
} |
|
||||
.pr-5 { |
|
||||
padding-right: 20px; |
|
||||
} |
|
||||
|
|
||||
|
|
||||
// margin |
|
||||
.ma-2 { |
|
||||
margin: 8px; |
|
||||
} |
|
||||
|
|
||||
.ma-3 { |
|
||||
margin: 12px; |
|
||||
} |
|
||||
|
|
||||
.mx-2{ |
|
||||
margin-left: 8px; |
|
||||
margin-right: 8px; |
|
||||
} |
|
||||
|
|
||||
.my-2{ |
|
||||
margin-top: 8px; |
|
||||
margin-bottom: 8px; |
|
||||
} |
|
||||
|
|
||||
.my-3{ |
|
||||
margin-top: 12px; |
|
||||
margin-bottom: 12px; |
|
||||
} |
|
||||
|
|
||||
.my-4{ |
|
||||
margin-top: 16px; |
|
||||
margin-bottom: 16px; |
|
||||
} |
|
||||
|
|
||||
.my-6{ |
|
||||
margin-top: 24px; |
|
||||
margin-bottom: 24px; |
|
||||
} |
|
||||
|
|
||||
.mt-1{ |
|
||||
margin-top: 4px; |
|
||||
} |
|
||||
|
|
||||
.mt-2{ |
|
||||
margin-top: 8px; |
|
||||
} |
|
||||
|
|
||||
.mt-3{ |
|
||||
margin-top: 12px; |
|
||||
} |
|
||||
|
|
||||
.mt-4{ |
|
||||
margin-top: 16px; |
|
||||
} |
|
||||
|
|
||||
.mb-1{ |
|
||||
margin-bottom: 4px; |
|
||||
} |
|
||||
|
|
||||
.mb-2{ |
|
||||
margin-bottom: 8px; |
|
||||
} |
|
||||
|
|
||||
.mb-3{ |
|
||||
margin-bottom: 12px; |
|
||||
} |
|
||||
|
|
||||
.mb-4{ |
|
||||
margin-bottom: 16px; |
|
||||
} |
|
||||
|
|
||||
.mb-5{ |
|
||||
margin-bottom: 20px; |
|
||||
} |
|
||||
|
|
||||
.mb-6{ |
|
||||
margin-bottom: 24px; |
|
||||
} |
|
||||
|
|
||||
.ml-2{ |
|
||||
margin-left: 8px; |
|
||||
} |
|
||||
|
|
||||
.ml-3{ |
|
||||
margin-left: 12px; |
|
||||
} |
|
||||
|
|
||||
.ml-4{ |
|
||||
margin-left: 16px; |
|
||||
} |
|
||||
|
|
||||
.ml-5{ |
|
||||
margin-left: 20px; |
|
||||
} |
|
||||
|
|
||||
.ml-6{ |
|
||||
margin-left: 24px; |
|
||||
} |
|
||||
|
|
||||
.ml-7{ |
|
||||
margin-left: 28px; |
|
||||
} |
|
||||
|
|
||||
.ml-8{ |
|
||||
margin-left: 32px; |
|
||||
} |
|
||||
|
|
||||
.mr-1{ |
|
||||
margin-right: 4px; |
|
||||
} |
|
||||
|
|
||||
.mr-2{ |
|
||||
margin-right: 8px; |
|
||||
} |
|
||||
|
|
||||
.mr-3{ |
|
||||
margin-right: 12px; |
|
||||
} |
|
||||
|
|
||||
.mr-4{ |
|
||||
margin-right: 16px; |
|
||||
} |
|
||||
|
|
||||
.mr-5{ |
|
||||
margin-right: 20px; |
|
||||
} |
|
||||
|
|
||||
.mr-6{ |
|
||||
margin-right: 24px; |
|
||||
} |
|
||||
|
|
||||
// background |
|
||||
.white { |
|
||||
background: white; |
|
||||
} |
|
||||
|
|
||||
// font |
|
||||
.font-bold-24{ |
|
||||
font-size: 24px; |
|
||||
font-weight: bold; |
|
||||
} |
|
||||
|
|
||||
.font-24{ |
|
||||
font-size: 24px; |
|
||||
} |
|
||||
|
|
||||
.font-bold-16{ |
|
||||
font-size: 16px; |
|
||||
font-weight: bold; |
|
||||
} |
|
||||
|
|
||||
.font-16{ |
|
||||
font-size: 16px; |
|
||||
} |
|
||||
|
|
||||
.font-bold-14{ |
|
||||
font-size: 14px; |
|
||||
font-weight: bold; |
|
||||
} |
|
||||
|
|
||||
.font-14{ |
|
||||
font-size: 14px; |
|
||||
} |
|
||||
|
|
||||
.font-18{ |
|
||||
font-size: 18px; |
|
||||
} |
|
||||
|
|
||||
|
|
||||
.icon-size{ |
|
||||
font-size: 20px; |
|
||||
} |
|
||||
|
|
||||
h2{ |
|
||||
font-size: 24px; |
|
||||
font-weight: bold; |
|
||||
color: rgba(0,0,0,.85) |
|
||||
} |
|
||||
|
|
||||
.textColor{ |
|
||||
color: rgba(0,0,0,.65) |
|
||||
} |
|
||||
|
|
||||
.baseColor{ |
|
||||
color: #7690e5 |
|
||||
} |
|
||||
|
|
||||
.bg{ |
|
||||
background: #F5F5F5 |
|
||||
} |
|
||||
|
|
||||
.ant-btn-primary, .ant-radio-button-wrapper-checked{ |
|
||||
background-color: #017aff!important; |
|
||||
border-color: #017aff!important; |
|
||||
} |
|
||||
.ant-radio-checked{ |
|
||||
border-color: #7690e5!important; |
|
||||
} |
|
||||
.ant-radio-inner{ |
|
||||
border-color: #7690e5!important; |
|
||||
} |
|
||||
.ant-radio-inner:after{ |
|
||||
background-color: #7690e5!important; |
|
||||
} |
|
||||
.ant-btn-link:hover, .ant-btn-link:focus{ |
|
||||
color: #7690e5!important; |
|
||||
} |
|
||||
|
|
||||
.fill-width{ |
|
||||
width:100%; |
|
||||
} |
|
||||
|
|
||||
.fill-height{ |
|
||||
height:100%; |
|
||||
} |
|
||||
@ -1,161 +0,0 @@ |
|||||
<!-- |
|
||||
* @desc: 导航 |
|
||||
* @Author: gaowenya |
|
||||
* @Date: 2023-06-21 11:00 |
|
||||
* @LastEditors: |
|
||||
* @LastEditTime: |
|
||||
--> |
|
||||
<template> |
|
||||
<header class="header" :class="getPatient === false ? 'mt' : ''"> |
|
||||
<div class="header-content" v-if="getChangeText.title || getPatient"> |
|
||||
<div class="header-back" v-if="isBack" @click="toBack"> |
|
||||
<a-icon type="left" />返回 |
|
||||
</div> |
|
||||
<div class="header-title"> |
|
||||
<span v-if="getChangeText.title"> |
|
||||
{{ getChangeText.title }} |
|
||||
</span> |
|
||||
<p v-else class="caret-top"> |
|
||||
姓名: |
|
||||
<span> {{ patientData.patientName || '暂无' }} </span> |
|
||||
性别: |
|
||||
<span> |
|
||||
{{ sex[patientData.patientGender] || '暂无' }} |
|
||||
</span> |
|
||||
年龄: |
|
||||
<span> {{ patientData.patientAge || '暂无' }} </span> |
|
||||
证件号: |
|
||||
<span> {{ patientData.jzh || '暂无' }} </span> |
|
||||
急诊号: |
|
||||
<span> 暂无 </span> |
|
||||
</p> |
|
||||
</div> |
|
||||
<div class="header-right" v-if="isMore" @click="changeOverviewType"> |
|
||||
{{ getChangeText.text }}<a-icon type="swap" /> |
|
||||
</div> |
|
||||
</div> |
|
||||
</header> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import { mapMutations, mapState } from 'vuex'; |
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
sex: { |
|
||||
0: '男', |
|
||||
1: '女', |
|
||||
}, |
|
||||
overview: { |
|
||||
title: '', |
|
||||
text: '', |
|
||||
}, |
|
||||
}; |
|
||||
}, |
|
||||
computed: { |
|
||||
...mapState('patient', ['patientData', 'overviewType']), |
|
||||
...mapState('storm', ['isBack', 'isMore']), |
|
||||
getChangeText() { |
|
||||
if (this.overviewType === 'info') { |
|
||||
return { |
|
||||
title: '患者信息', |
|
||||
text: '切换至概览', |
|
||||
}; |
|
||||
} else if (this.overviewType === 'overview') { |
|
||||
return { |
|
||||
title: '患者概览', |
|
||||
text: '切换至详情', |
|
||||
}; |
|
||||
} |
|
||||
return { |
|
||||
title: '', |
|
||||
text: '', |
|
||||
}; |
|
||||
}, |
|
||||
getPatient() { |
|
||||
if (!this.patientData) return false; |
|
||||
const { patientName, patientGender, patientAge, patientIdCardNo } = |
|
||||
this.patientData; |
|
||||
console.log(' this.patientData: ', this.patientData); |
|
||||
let sex = { |
|
||||
0: '男', |
|
||||
1: '女', |
|
||||
}; |
|
||||
if (!patientName) return false; |
|
||||
return `姓名: ${patientName} 性别: ${sex[patientGender]} 年龄: ${ |
|
||||
patientAge || '' |
|
||||
} 证件号: ${patientIdCardNo} 急诊号: 暂无`; |
|
||||
}, |
|
||||
}, |
|
||||
methods: { |
|
||||
...mapMutations('patient', ['setOverviewType']), |
|
||||
toBack() { |
|
||||
window.history.go(-1); |
|
||||
}, |
|
||||
changeOverviewType() { |
|
||||
if (this.overviewType === 'info') { |
|
||||
this.overview = { |
|
||||
title: '患者概览', |
|
||||
text: '切换至概览', |
|
||||
}; |
|
||||
this.setOverviewType('overview'); |
|
||||
} else if (this.overviewType === 'overview') { |
|
||||
this.overview = { |
|
||||
title: '患者信息', |
|
||||
text: '切换至详情', |
|
||||
}; |
|
||||
this.setOverviewType('info'); |
|
||||
} |
|
||||
}, |
|
||||
}, |
|
||||
}; |
|
||||
</script> |
|
||||
|
|
||||
<style scoped lang="less"> |
|
||||
.header { |
|
||||
width: 100%; |
|
||||
display: flex; |
|
||||
background: linear-gradient(180deg, #dbeaff, #fbfdff 50%); |
|
||||
box-shadow: 0px 0.25px 0px 0px rgba(0, 0, 0, 0.2); |
|
||||
.caret-top { |
|
||||
margin: 0; |
|
||||
span { |
|
||||
color: #70798c; |
|
||||
margin-right: 5px; |
|
||||
} |
|
||||
} |
|
||||
&.mt { |
|
||||
margin-top: 10px; |
|
||||
} |
|
||||
.header-content { |
|
||||
flex: 1; |
|
||||
height: 60px; |
|
||||
display: flex; |
|
||||
position: relative; |
|
||||
align-items: center; |
|
||||
} |
|
||||
.header-back { |
|
||||
position: absolute; |
|
||||
top: 16px; |
|
||||
left: 24px; |
|
||||
font-size: 24px; |
|
||||
} |
|
||||
.header-right { |
|
||||
position: absolute; |
|
||||
top: 16px; |
|
||||
right: 24px; |
|
||||
font-size: 24px; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
justify-content: center; |
|
||||
} |
|
||||
|
|
||||
.header-title { |
|
||||
flex: 1; |
|
||||
font-size: 24px; |
|
||||
font-family: Source Han Sans CN, Source Han Sans CN-Bold; |
|
||||
font-weight: 700; |
|
||||
text-align: center; |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,115 +0,0 @@ |
|||||
<template> |
|
||||
<div class="count">{{ time }}{{ markerList.runTime }}</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import { mapState } from 'vuex'; |
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
markerList: { |
|
||||
runTotal: '3600', |
|
||||
runTime: '00:00', |
|
||||
}, |
|
||||
minute: 0, |
|
||||
second: 0, |
|
||||
requestCount: 0, |
|
||||
lastTime: 0, |
|
||||
currentTime: 0, |
|
||||
}; |
|
||||
}, |
|
||||
computed: { |
|
||||
...mapState('patient', ['patientData', 'timerData']), |
|
||||
time() { |
|
||||
const { timerData, patientData } = this; |
|
||||
if (!timerData && !patientData) return null; |
|
||||
if (timerData.firstAidId !== patientData.firstAidId) return null; |
|
||||
const { countdown } = timerData; |
|
||||
if (countdown === null && !countdown) return null; |
|
||||
const totalSeconds = countdown; |
|
||||
// ?️ 获取完整分钟数 |
|
||||
const minutes = Math.floor(totalSeconds / 60); |
|
||||
this.minute = minutes; |
|
||||
// ?️ 获得剩余的秒数 |
|
||||
const seconds = totalSeconds % 60; |
|
||||
this.second = seconds; |
|
||||
// ✅ 格式化为 MM:SS |
|
||||
const result = `${this.padTo2Digits(minutes)}:${this.padTo2Digits( |
|
||||
seconds |
|
||||
)}`; |
|
||||
this.markerList.runTime = result; |
|
||||
if (this.markerList.runTotal === countdown) { |
|
||||
this.utils.AnimationFrame.done('countTask'); |
|
||||
} else { |
|
||||
this.utils.AnimationFrame.create( |
|
||||
'countTask', |
|
||||
1000, |
|
||||
true, |
|
||||
(min) => { |
|
||||
this.runStart(min); |
|
||||
} |
|
||||
); |
|
||||
} |
|
||||
}, |
|
||||
}, |
|
||||
methods: { |
|
||||
padTo2Digits(num) { |
|
||||
return num.toString().padStart(2, '0'); |
|
||||
}, |
|
||||
runStart(min) { |
|
||||
// 改版 防抖 |
|
||||
// 当前定时器一直在执行,并非隔一秒才执行, 而是每隔一秒1 |
|
||||
// 通过防抖来限制该函数一秒内只执行一次 |
|
||||
this.currentTime = new Date().getTime(); |
|
||||
if (this.currentTime - this.lastTime > 1000) { |
|
||||
this.lastTime = this.currentTime; |
|
||||
// //开始计时 |
|
||||
this.second = this.second + 1; |
|
||||
if (this.second >= 60) { |
|
||||
this.second = 0; |
|
||||
this.minute = this.minute + 1; |
|
||||
} |
|
||||
// console.log(this.minute) |
|
||||
if (this.minute >= 60) { |
|
||||
this.minute = 60; |
|
||||
this.second = 0; |
|
||||
} |
|
||||
this.markerList.runTime = |
|
||||
this.Zero(this.minute) + ':' + this.Zero(this.second); |
|
||||
} |
|
||||
// 窗口小化定时器校验无法进入, requestCount 的值停留在了窗口小化那一瞬间 |
|
||||
// if (this.requestCount === n) { |
|
||||
// console.log('countTask::', n); |
|
||||
// this.requestCount = n + 1; |
|
||||
// //开始计时 |
|
||||
// this.second = this.second + 1; |
|
||||
// if (this.second >= 60) { |
|
||||
// this.second = 0; |
|
||||
// this.minute = this.minute + 1; |
|
||||
// } |
|
||||
// // console.log(this.minute) |
|
||||
// if (this.minute >= 60) { |
|
||||
// this.minute = 60; |
|
||||
// this.second = 0; |
|
||||
// } |
|
||||
// this.markerList.runTime = |
|
||||
// this.Zero(this.minute) + ':' + this.Zero(this.second); |
|
||||
// } |
|
||||
}, |
|
||||
//补零 |
|
||||
Zero(n) { |
|
||||
return n < 10 ? '0' + n : '' + n; |
|
||||
}, |
|
||||
}, |
|
||||
}; |
|
||||
</script> |
|
||||
|
|
||||
<style lang="less" scoped> |
|
||||
.count { |
|
||||
font-size: 44px; |
|
||||
font-family: Source Han Sans CN, Source Han Sans CN-Bold; |
|
||||
font-weight: 700; |
|
||||
color: #393d4e; |
|
||||
line-height: 44px; |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,80 +0,0 @@ |
|||||
<!-- |
|
||||
* @desc: 拖拽 |
|
||||
* @Author: gaowenya |
|
||||
* @Date: 2023-07-06 11:00 |
|
||||
* @LastEditors: |
|
||||
* @LastEditTime: |
|
||||
--> |
|
||||
<template> |
|
||||
<div |
|
||||
@touchstart="onTouchStart" |
|
||||
@touchmove="onTouchMove" |
|
||||
@touchend="onTouchEnd" |
|
||||
ref="floatWindow" |
|
||||
:style="{ right: right + 'px', top: top + 'px' }" |
|
||||
class="dragger" |
|
||||
> |
|
||||
<slot> </slot> |
|
||||
</div> |
|
||||
</template> |
|
||||
<script> |
|
||||
import { mapState } from 'vuex'; |
|
||||
export default { |
|
||||
props: {}, |
|
||||
data() { |
|
||||
return { |
|
||||
startX: 0, |
|
||||
startY: 0, |
|
||||
offsetX: 0, |
|
||||
offsetY: 0, |
|
||||
right: 0, |
|
||||
top: 300, |
|
||||
isScrolling: false, |
|
||||
}; |
|
||||
}, |
|
||||
computed: {}, |
|
||||
methods: { |
|
||||
onTouchStart(e) { |
|
||||
this.startX = e.touches[0].clientX; |
|
||||
this.startY = e.touches[0].clientY; |
|
||||
this.offsetX = this.right; |
|
||||
this.offsetY = this.top; |
|
||||
this.isScrolling = false; |
|
||||
}, |
|
||||
onTouchMove(e) { |
|
||||
const x = this.startX - e.touches[0].clientX + this.offsetX; |
|
||||
const y = e.touches[0].clientY - this.startY + this.offsetY; |
|
||||
const maxX = window.innerWidth - this.$refs.floatWindow.offsetWidth; |
|
||||
const maxY = |
|
||||
window.innerHeight - this.$refs.floatWindow.offsetHeight; |
|
||||
this.right = x < 0 ? 0 : x > maxX ? maxX : x; |
|
||||
this.top = y < 0 ? 0 : y > maxY ? maxY : y; |
|
||||
if ( |
|
||||
Math.abs(this.startX - e.touches[0].clientX) > 5 || |
|
||||
Math.abs(e.touches[0].clientY - this.startY) > 5 |
|
||||
) { |
|
||||
this.isScrolling = true; |
|
||||
} |
|
||||
}, |
|
||||
onTouchEnd(e) { |
|
||||
if (!this.isScrolling) { |
|
||||
if (e.changedTouches[0].clientX > window.innerWidth / 2) { |
|
||||
this.right = 0; |
|
||||
} else { |
|
||||
this.right = |
|
||||
window.innerWidth - this.$refs.floatWindow.offsetWidth; |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
}, |
|
||||
}; |
|
||||
</script> |
|
||||
<style scoped lang="less"> |
|
||||
.dragger { |
|
||||
position: fixed; |
|
||||
right: 0; |
|
||||
top: 0; |
|
||||
transform: translate3d(0, 0, 0); |
|
||||
transition: right 0.3s ease-out; |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,546 +0,0 @@ |
|||||
<template> |
|
||||
<div class="myKeyboard" @click.stop="handleFocus" @blur="handleBlur" tabindex="0"> |
|
||||
<div class="input-container"> |
|
||||
<div class="input-top"> |
|
||||
<div class="input-label" :style="labelStyle" :class="labelClass"> |
|
||||
{{ inputLabel }} |
|
||||
</div> |
|
||||
<div class="inputText" id="inputText" :style="inputStyle" :class="inputClass"> |
|
||||
<span class="cursor"> |
|
||||
<span class="holder showWhite">|</span> |
|
||||
</span> |
|
||||
<span class="place-holder">{{ placeHolder }}</span> |
|
||||
<span class="right-space" :style="{ color: zcolor }" @click="moveCursor"> </span> |
|
||||
<span class="right-btn"> |
|
||||
<a-icon class="clear" v-if="clearShow" type="close-circle" @click="handleClear" /> |
|
||||
<slot></slot> |
|
||||
</span> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="error" :style="errorStyle" v-if="errorShow"> |
|
||||
{{ errorMessage }} |
|
||||
</div> |
|
||||
<div class="errorSpace" v-else></div> |
|
||||
</div> |
|
||||
<div class="number hidden" :class="numberClass" :style="numberStyle"> |
|
||||
<div class="mybtn" @click.stop="handleBlur"> |
|
||||
<a-icon type="down" /> |
|
||||
</div> |
|
||||
<div class="mynum"> |
|
||||
<div class="num" @click="handleNum('1')">1</div> |
|
||||
<div class="num" @click="handleNum('2')">2</div> |
|
||||
<div class="num" @click="handleNum('3')">3</div> |
|
||||
<div class="num" @click="handleNum('4')">4</div> |
|
||||
<div class="num" @click="handleNum('5')">5</div> |
|
||||
<div class="num" @click="handleNum('6')">6</div> |
|
||||
<div class="num" @click="handleNum('7')">7</div> |
|
||||
<div class="num" @click="handleNum('8')">8</div> |
|
||||
<div class="num" @click="handleNum('9')">9</div> |
|
||||
<div class="num" @click="handleNum('0')">0</div> |
|
||||
<div v-if="keyboard == 'card'" class="num" @click="handleNum('X')"> |
|
||||
X |
|
||||
</div> |
|
||||
<div v-if="keyboard == 'tel'" class="num" @click="handleNum('0')"> |
|
||||
0 |
|
||||
</div> |
|
||||
<div class="num" @click.stop="handleDelete" @touchstart="gtouchstart" @touchend="gtouchend" |
|
||||
@touchmove="gtouchmove"> |
|
||||
<a-icon type="close-circle" /> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
props: { |
|
||||
// inputS: { |
|
||||
// type: String, |
|
||||
// default: '', |
|
||||
// }, |
|
||||
// inputH: { |
|
||||
// type: String, |
|
||||
// default: '2.5rem', |
|
||||
// }, |
|
||||
// inputB: { |
|
||||
// type: String, |
|
||||
// default: 'none', |
|
||||
// }, |
|
||||
// inputW: { |
|
||||
// type: String, |
|
||||
// default: '', |
|
||||
// }, |
|
||||
// inputBgc: { |
|
||||
// type: String, |
|
||||
// default: '#fff', |
|
||||
// }, |
|
||||
// labelS: { |
|
||||
// type: String, |
|
||||
// default: '', |
|
||||
// }, |
|
||||
// labelC: { |
|
||||
// type: String, |
|
||||
// default: '', |
|
||||
// }, |
|
||||
// labelW: { |
|
||||
// type: String, |
|
||||
// default: '', |
|
||||
// }, |
|
||||
// 输入框索引（必填字段） |
|
||||
indexNum: { |
|
||||
type: Number, |
|
||||
default: 0, |
|
||||
}, |
|
||||
// 是否聚焦（true:不聚焦，false:聚焦） |
|
||||
numberDis: { |
|
||||
type: Boolean, |
|
||||
default: false, |
|
||||
}, |
|
||||
// 是否必填（true:出现红星，false:不出现） |
|
||||
required: { |
|
||||
type: Boolean, |
|
||||
default: false, |
|
||||
}, |
|
||||
// 键盘类型（card:身份证，tel:数字） |
|
||||
keyboard: { |
|
||||
type: String, |
|
||||
default: 'card', |
|
||||
}, |
|
||||
// 父组件存的值 |
|
||||
oldValue: { |
|
||||
type: String, |
|
||||
default: '', |
|
||||
}, |
|
||||
// 占位符颜色（建议设置和输入框背景同色） |
|
||||
zcolor: { |
|
||||
type: String, |
|
||||
default: 'transparent', |
|
||||
}, |
|
||||
// label文字 |
|
||||
inputLabel: { |
|
||||
type: String, |
|
||||
default: '', |
|
||||
}, |
|
||||
// 当输入框内无文字时显示 |
|
||||
placeHolder: { |
|
||||
type: String, |
|
||||
default: '请输入', |
|
||||
}, |
|
||||
// 错误提示信息 |
|
||||
errorMessage: { |
|
||||
type: String, |
|
||||
default: '请输入正确的信息', |
|
||||
}, |
|
||||
// 是否显示错误提示信息 |
|
||||
errorShow: { |
|
||||
type: Boolean, |
|
||||
default: false, |
|
||||
}, |
|
||||
// 错误提示信息样式 |
|
||||
errorStyle: { |
|
||||
type: Object, |
|
||||
default: function() { |
|
||||
return {} |
|
||||
}, |
|
||||
}, |
|
||||
// 是否显示清除键 |
|
||||
clearShow: { |
|
||||
type: Boolean, |
|
||||
default: false, |
|
||||
}, |
|
||||
// label动态类名 |
|
||||
labelClass: { |
|
||||
type: String, |
|
||||
default: '', |
|
||||
}, |
|
||||
// label样式 |
|
||||
labelStyle: { |
|
||||
type: Object, |
|
||||
default: function() { |
|
||||
return {} |
|
||||
}, |
|
||||
}, |
|
||||
// input动态类名 |
|
||||
inputClass: { |
|
||||
type: String, |
|
||||
default: '', |
|
||||
}, |
|
||||
// input样式 |
|
||||
inputStyle: { |
|
||||
type: Object, |
|
||||
default: function() { |
|
||||
return {} |
|
||||
}, |
|
||||
}, |
|
||||
// number类名 |
|
||||
numberClass: { |
|
||||
type: String, |
|
||||
default: '', |
|
||||
}, |
|
||||
// number样式 |
|
||||
numberStyle: { |
|
||||
type: Object, |
|
||||
default: function() { |
|
||||
return {} |
|
||||
}, |
|
||||
}, |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
inputArea: '', |
|
||||
stop: false, |
|
||||
clickNum: false, |
|
||||
show: false, |
|
||||
value: '', |
|
||||
inputValue: '', |
|
||||
} |
|
||||
}, |
|
||||
watch: { |
|
||||
oldValue(val) { |
|
||||
if (val != this.inputValue) { |
|
||||
this.handleClear() |
|
||||
this.handleOld() |
|
||||
} |
|
||||
}, |
|
||||
required(val) { |
|
||||
this.handleRequired(val) |
|
||||
}, |
|
||||
}, |
|
||||
created() { |
|
||||
this.$toast.clear() |
|
||||
}, |
|
||||
mounted() { |
|
||||
this.handleRequired(this.required) |
|
||||
this.handleOld() |
|
||||
}, |
|
||||
methods: { |
|
||||
// 是否必填 |
|
||||
handleRequired(val) { |
|
||||
const inputLabel = |
|
||||
document.getElementsByClassName('input-label')[this.indexNum] |
|
||||
if (val) { |
|
||||
inputLabel.className = 'input-label required' |
|
||||
} else { |
|
||||
inputLabel.className = 'input-label' |
|
||||
} |
|
||||
}, |
|
||||
// 父组件改变值 |
|
||||
handleOld() { |
|
||||
// 获取父组件存的值后画数字 |
|
||||
if (this.oldValue != '') { |
|
||||
for (const item of this.oldValue) { |
|
||||
const span = document.createElement('span') //创建包含值的元素 |
|
||||
span.className = 'val' |
|
||||
span.innerText = item |
|
||||
const space = document.createElement('span') |
|
||||
space.className = 'space' |
|
||||
space.innerText = '' |
|
||||
span.addEventListener('click', this.moveCursor) |
|
||||
const cursor = |
|
||||
document.getElementsByClassName('cursor')[this.indexNum] |
|
||||
const inputArea = |
|
||||
document.getElementsByClassName('inputText')[this.indexNum] |
|
||||
inputArea.insertBefore(space, cursor) //插入空列 |
|
||||
inputArea.insertBefore(span, cursor) //插入值 |
|
||||
} |
|
||||
} |
|
||||
const placeHolder = |
|
||||
document.getElementsByClassName('place-holder')[this.indexNum] |
|
||||
|
|
||||
if (this.oldValue == '') { |
|
||||
placeHolder.className = 'place-holder' |
|
||||
} else { |
|
||||
placeHolder.className = 'place-holder hidden' |
|
||||
} |
|
||||
this.inputValue = this.oldValue |
|
||||
this.$emit('keyboard-input', this.inputValue) |
|
||||
}, |
|
||||
// 聚焦 |
|
||||
handleFocus(event) { |
|
||||
if (!this.numberDis) { |
|
||||
this.$emit('indexNum', this.indexNum) |
|
||||
const number = document.getElementsByClassName('number')[this.indexNum] |
|
||||
number.className = 'number' |
|
||||
this.setCursorFlash() |
|
||||
this.handleValue() |
|
||||
} |
|
||||
}, |
|
||||
//字符插入，在光标前插入字符 |
|
||||
handleNum(value) { |
|
||||
const number = document.getElementsByClassName('number')[this.indexNum] |
|
||||
number.className = 'number' |
|
||||
const span = document.createElement('span') //创建包含值的元素 |
|
||||
span.className = 'val' |
|
||||
span.innerText = value |
|
||||
|
|
||||
const space = document.createElement('span') |
|
||||
space.className = 'space' |
|
||||
space.innerText = '' |
|
||||
span.addEventListener('click', this.moveCursor) |
|
||||
const cursor = document.getElementsByClassName('cursor')[this.indexNum] |
|
||||
const inputArea = |
|
||||
document.getElementsByClassName('inputText')[this.indexNum] |
|
||||
inputArea.insertBefore(space, cursor) //插入空列 |
|
||||
inputArea.insertBefore(span, cursor) //插入值 |
|
||||
this.handleValue() |
|
||||
}, |
|
||||
// 失焦 |
|
||||
handleBlur(e) { |
|
||||
clearInterval(this.intervalId) |
|
||||
const placeHolder = |
|
||||
document.getElementsByClassName('holder')[this.indexNum] |
|
||||
placeHolder.className = 'holder showWhite' |
|
||||
const number = document.getElementsByClassName('number')[this.indexNum] |
|
||||
number.className = 'number hidden' |
|
||||
const inputText = |
|
||||
document.getElementsByClassName('inputText')[this.indexNum] |
|
||||
inputText.className = 'inputText' |
|
||||
this.handleValue() |
|
||||
const inputArea = |
|
||||
document.getElementsByClassName('inputText')[this.indexNum] |
|
||||
const reset = |
|
||||
document.getElementsByClassName('place-holder')[this.indexNum] |
|
||||
const cursor = document.getElementsByClassName('cursor')[this.indexNum] //获取光标 |
|
||||
const ele = inputArea.replaceChild(reset.previousSibling, cursor) |
|
||||
inputArea.insertBefore(ele, reset) |
|
||||
}, |
|
||||
// 移动光标位置 |
|
||||
moveCursor(event) { |
|
||||
const inputArea = |
|
||||
document.getElementsByClassName('inputText')[this.indexNum] |
|
||||
const cursor = document.getElementsByClassName('cursor')[this.indexNum] //获取光标 |
|
||||
if (event.currentTarget.className == 'right-space') { |
|
||||
const ele = inputArea.replaceChild( |
|
||||
event.currentTarget.previousSibling.previousSibling, |
|
||||
cursor, |
|
||||
) |
|
||||
inputArea.insertBefore(ele, event.currentTarget.previousSibling) |
|
||||
} else { |
|
||||
const tempEle = event.currentTarget |
|
||||
const nodeName = event.currentTarget.nextSibling.nodeName |
|
||||
const temp = event.currentTarget.previousSibling |
|
||||
const ele = inputArea.replaceChild(temp, cursor) //把光标替换成当前元素 |
|
||||
inputArea.insertBefore(ele, event.currentTarget) |
|
||||
} |
|
||||
}, |
|
||||
// 删除 |
|
||||
handleDelete() { |
|
||||
const inputArea = |
|
||||
document.getElementsByClassName('inputText')[this.indexNum] |
|
||||
// this.setCursorFlash() |
|
||||
const cursor = document.getElementsByClassName('cursor')[this.indexNum] |
|
||||
let n = 2 //两个删除动作 |
|
||||
while (cursor.previousSibling && n > 0) { |
|
||||
inputArea.removeChild(cursor.previousSibling) |
|
||||
n-- |
|
||||
} |
|
||||
this.handleValue() |
|
||||
}, |
|
||||
//开始按 |
|
||||
gtouchstart(e) { |
|
||||
this.timeOutEvent = setTimeout(() => { |
|
||||
this.longPress() |
|
||||
}, 500) |
|
||||
return false |
|
||||
}, |
|
||||
gtouchend() { |
|
||||
clearTimeout(this.timeOutEvent) |
|
||||
clearInterval(this.press) |
|
||||
if (this.timeOutEvent != 0) { |
|
||||
// alert('你这是点击，不是长按') |
|
||||
} |
|
||||
return false |
|
||||
}, |
|
||||
gtouchmove() { |
|
||||
clearTimeout(this.timeOutEvent) |
|
||||
clearInterval(this.press) |
|
||||
this.timeOutEvent = 0 |
|
||||
}, |
|
||||
longPress() { |
|
||||
this.timeOutEvent = 0 |
|
||||
this.press = setInterval(() => { |
|
||||
this.handleDelete() |
|
||||
}, 300) |
|
||||
}, |
|
||||
//设置光标定时任务 |
|
||||
setCursorFlash() { |
|
||||
const placeHolder = |
|
||||
document.getElementsByClassName('holder')[this.indexNum] |
|
||||
let isShowCursor = false |
|
||||
if (this.intervalId) { |
|
||||
clearInterval(this.intervalId) |
|
||||
} |
|
||||
this.intervalId = setInterval(function() { |
|
||||
isShowCursor = !isShowCursor |
|
||||
if (isShowCursor) { |
|
||||
placeHolder.className = 'holder' |
|
||||
} else { |
|
||||
placeHolder.className = 'holder showWhite' |
|
||||
} |
|
||||
}, 500) |
|
||||
}, |
|
||||
// 全清 |
|
||||
handleClear() { |
|
||||
const father = document.getElementsByClassName('inputText')[this.indexNum] |
|
||||
const child = |
|
||||
document.getElementsByClassName('inputText')[this.indexNum].childNodes |
|
||||
for (let i = child.length - 1; i >= 0; i--) { |
|
||||
if (child[i].className == 'val' || child[i].className == 'space') { |
|
||||
father.removeChild(child[i]) |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
// 获取值 |
|
||||
handleValue() { |
|
||||
const val = document |
|
||||
.getElementsByClassName('inputText')[this.indexNum].querySelectorAll('.val') |
|
||||
const arr = [] |
|
||||
arr[this.indexNum] = [] |
|
||||
for (let i = 0; i < val.length; i++) { |
|
||||
arr[this.indexNum].push(val[i].innerHTML) |
|
||||
} |
|
||||
this.inputValue = arr[this.indexNum].toString() |
|
||||
this.inputValue = this.inputValue.split(',').join('') |
|
||||
this.$emit('keyboard-input', this.inputValue) |
|
||||
const placeHolder = |
|
||||
document.getElementsByClassName('place-holder')[this.indexNum] |
|
||||
|
|
||||
if (this.inputValue == '') { |
|
||||
placeHolder.className = 'place-holder' |
|
||||
} else { |
|
||||
placeHolder.className = 'place-holder hidden' |
|
||||
} |
|
||||
}, |
|
||||
}, |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style scoped lang="less"> |
|
||||
.myKeyboard{ |
|
||||
padding-top: 0.15vw; |
|
||||
} |
|
||||
.myKeyboard:focus { |
|
||||
outline: none; |
|
||||
} |
|
||||
|
|
||||
.input-container { |
|
||||
display: flex; |
|
||||
// align-items: center; |
|
||||
flex-direction: column; |
|
||||
box-sizing: border-box; |
|
||||
width: 100%; |
|
||||
font-size: 1rem; |
|
||||
border: 1px solid #d9d9d9; |
|
||||
background: #f9f9f9; |
|
||||
padding-left: 12px; |
|
||||
border-radius: .3rem; |
|
||||
box-sizing: border-box; |
|
||||
.acitve { |
|
||||
border: 1px solid #2e8fff !important; |
|
||||
} |
|
||||
|
|
||||
.input-top { |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
box-sizing: border-box; |
|
||||
width: 100%; |
|
||||
} |
|
||||
|
|
||||
.error { |
|
||||
color: #ee0a24; |
|
||||
font-size: 18px; |
|
||||
} |
|
||||
|
|
||||
.errorSpace {} |
|
||||
|
|
||||
.required::before { |
|
||||
position: absolute; |
|
||||
left: 6px; |
|
||||
color: #ee0a24; |
|
||||
content: '*'; |
|
||||
font-size: 22px; |
|
||||
} |
|
||||
|
|
||||
.inputText { |
|
||||
position: relative; |
|
||||
flex: 1; |
|
||||
width: 80%; |
|
||||
border: none; |
|
||||
height: 2.91vw; |
|
||||
} |
|
||||
|
|
||||
.right-btn { |
|
||||
position: absolute; |
|
||||
right: 2%; |
|
||||
|
|
||||
.clear { |
|
||||
width: 1.5rem; |
|
||||
} |
|
||||
|
|
||||
// :nth-child(1) { |
|
||||
// width: 1.5rem; |
|
||||
// } |
|
||||
:nth-child(2) {} |
|
||||
} |
|
||||
|
|
||||
.right-space { |
|
||||
// color: #fff; |
|
||||
} |
|
||||
|
|
||||
.place-holder { |
|
||||
color: #c8c8c8; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.number { |
|
||||
position: fixed; |
|
||||
left: 0; |
|
||||
right: 0; |
|
||||
bottom: 0; |
|
||||
z-index: 999999; |
|
||||
width: 100%; |
|
||||
background-color: #f0f0f0; |
|
||||
font-size: 24px; |
|
||||
|
|
||||
.mybtn { |
|
||||
padding: 5px 0; |
|
||||
text-align: center; |
|
||||
line-height: 24px; |
|
||||
|
|
||||
img { |
|
||||
height: 100%; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.mynum { |
|
||||
display: flex; |
|
||||
flex-wrap: wrap; |
|
||||
padding-bottom: 10px; |
|
||||
.num { |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
flex: 1 0 25%; |
|
||||
justify-content: center; |
|
||||
padding: 5px 0; |
|
||||
border-top: 1px solid #eee; |
|
||||
border-left: 1px solid #eee; |
|
||||
background-color: #fff; |
|
||||
text-align: center; |
|
||||
|
|
||||
&:active { |
|
||||
background-color: rgb(202, 202, 202); |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.hidden { |
|
||||
display: none; |
|
||||
} |
|
||||
|
|
||||
.showWhite { |
|
||||
color: transparent; |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,4 +0,0 @@ |
|||||
@font-face { |
|
||||
font-family: SONG; |
|
||||
src: url(./仿宋字体.ttf); |
|
||||
} |
|
||||
@ -1,104 +0,0 @@ |
|||||
<template> |
|
||||
<div class="canvaspanel-conntainer"> |
|
||||
<div class="canvaspanel"> |
|
||||
<div class="canvasborder"> |
|
||||
<vue-esign |
|
||||
ref="esign" |
|
||||
:width="width" |
|
||||
:height="300" |
|
||||
:isCrop="isCrop" |
|
||||
:lineWidth="lineWidth" |
|
||||
:lineColor="lineColor" |
|
||||
:bgColor.sync="bgColor" |
|
||||
style="width: 100% !important" |
|
||||
/> |
|
||||
</div> |
|
||||
<div class="buttongroup"> |
|
||||
<a-button type="gray" size="large" @click="handleReset" icon="delete"> 清除 </a-button> |
|
||||
<a-button type="link" size="large" @click="handleGenerate" icon="check-circle"> 保存 </a-button> |
|
||||
</div> |
|
||||
</div> |
|
||||
<img :src="resultImg" alt="" v-show="false" /> |
|
||||
</div> |
|
||||
</template> |
|
||||
<script> |
|
||||
export default { |
|
||||
name: 'esign', |
|
||||
components: {}, |
|
||||
data() { |
|
||||
return { |
|
||||
title: '手写签名', |
|
||||
width: 0, |
|
||||
lineWidth: 10, |
|
||||
lineColor: '#000000', |
|
||||
bgColor: '', |
|
||||
resultImg: '', |
|
||||
isCrop: false, |
|
||||
}; |
|
||||
}, |
|
||||
created() { |
|
||||
this.width = window.innerWidth - 16*2 - 16*2; |
|
||||
}, |
|
||||
methods: { |
|
||||
handleReset() { |
|
||||
this.$refs['esign'].reset(); //清空画布 |
|
||||
this.$emit('reset'); |
|
||||
}, |
|
||||
handleGenerate() { |
|
||||
this.$refs['esign'] |
|
||||
.generate() |
|
||||
.then(res => { |
|
||||
this.resultImg = res; // 得到了签字生成的base64图片 |
|
||||
this.base64ImgtoFile(this.resultImg); |
|
||||
let data = this.base64ImgtoFile(this.resultImg); |
|
||||
//调用接口 |
|
||||
this.$emit('close', data); |
|
||||
}) |
|
||||
.catch(err => { |
|
||||
this.$message.error('请签名后再保存'); |
|
||||
}); |
|
||||
}, |
|
||||
// 将base64，转换成图片 |
|
||||
base64ImgtoFile(dataurl, filename = 'file') { |
|
||||
const arr = dataurl.split(','); |
|
||||
const mime = arr[0].match(/:(.*?);/)[1]; |
|
||||
const suffix = mime.split('/')[1]; |
|
||||
const bstr = atob(arr[1]); |
|
||||
let n = bstr.length; |
|
||||
const u8arr = new Uint8Array(n); |
|
||||
while (n--) { |
|
||||
u8arr[n] = bstr.charCodeAt(n); |
|
||||
} |
|
||||
return new File([u8arr], `${filename}.${suffix}`, { |
|
||||
type: mime, |
|
||||
}); |
|
||||
}, |
|
||||
}, |
|
||||
}; |
|
||||
</script> |
|
||||
<style lang="less" scope> |
|
||||
.canvasborder { |
|
||||
background: #efefef; |
|
||||
border-radius: 8px; |
|
||||
width: 100%; |
|
||||
|
|
||||
} |
|
||||
.canvaspanel { |
|
||||
display: flex; |
|
||||
position: relative; |
|
||||
margin: 16px 0; |
|
||||
} |
|
||||
|
|
||||
.buttongroup { |
|
||||
position: absolute; |
|
||||
right: 16px; |
|
||||
bottom: 16px; |
|
||||
} |
|
||||
|
|
||||
.autograph { |
|
||||
margin-left: 20px; |
|
||||
} |
|
||||
.clos { |
|
||||
width: 88px; |
|
||||
} |
|
||||
</style> |
|
||||
Binary file not shown.
@ -1,288 +0,0 @@ |
|||||
<template> |
|
||||
<div style="width: 100%; height: 100%"> |
|
||||
<div id="dicomImage"></div> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
// 加载相关库文件 |
|
||||
import cornerstone from './dist/cornerstone.js'; |
|
||||
import cornerstoneTools from './dist/cornerstoneTools'; |
|
||||
import cornerstoneWADOImageLoader from './dist/cornerstoneWADOImageLoader.bundle.min'; |
|
||||
import Hammer from './dist/hammer'; |
|
||||
import dicomParser from './dist/dicomParser.min'; |
|
||||
import cornerstoneMath from './dist/cornerstoneMath.min'; |
|
||||
|
|
||||
export default { |
|
||||
name: 'dcmview', |
|
||||
props: { |
|
||||
currentDcm: { |
|
||||
type: Array, |
|
||||
default: [], |
|
||||
}, |
|
||||
imgurl: { |
|
||||
type: String, |
|
||||
default: '', |
|
||||
}, |
|
||||
toolType: { |
|
||||
type: String, |
|
||||
default: '', |
|
||||
}, |
|
||||
width: { |
|
||||
type: String, |
|
||||
default: '750rpx', |
|
||||
}, |
|
||||
height: { |
|
||||
type: String, |
|
||||
default: '1000rpx', |
|
||||
}, |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
imageIds: [], |
|
||||
}; |
|
||||
}, |
|
||||
watch: { |
|
||||
toolType: { |
|
||||
handler(newVal, lodVal) { |
|
||||
console.log(newVal, lodVal); |
|
||||
this.viewDcm1(); |
|
||||
}, |
|
||||
}, |
|
||||
currentDcm: { |
|
||||
handler(newVal, lodVal) { |
|
||||
console.log('newVal', newVal); |
|
||||
this.handleDcm(newVal); |
|
||||
}, |
|
||||
}, |
|
||||
}, |
|
||||
mounted() { |
|
||||
console.log(11111111, '1212'); |
|
||||
this.handleDcm(this.currentDcm); |
|
||||
console.log(11111111, this.currentDcm); |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
// 处理获取图像数组 |
|
||||
async handleDcm(_Arr) { |
|
||||
let that = this; |
|
||||
this.imageIds = []; |
|
||||
await _Arr.forEach((item) => { |
|
||||
this.imageIds.push('dicomweb:' + item.dcmPath); |
|
||||
}); |
|
||||
this.viewDcm(); |
|
||||
}, |
|
||||
// 显示dcm图片函数 |
|
||||
viewDcm() { |
|
||||
cornerstoneTools.external.cornerstone = cornerstone; |
|
||||
cornerstoneTools.external.cornerstoneMath = cornerstoneMath; |
|
||||
cornerstoneTools.external.Hammer = Hammer; |
|
||||
cornerstoneWADOImageLoader.external.dicomParser = dicomParser; |
|
||||
cornerstoneWADOImageLoader.external.cornerstone = cornerstone; |
|
||||
cornerstoneWADOImageLoader.webWorkerManager.initialize({ |
|
||||
maxWebWorkers: navigator.hardwareConcurrency || 1, |
|
||||
startWebWorkersOnDemand: true, |
|
||||
taskConfiguration: { |
|
||||
decodeTask: { |
|
||||
initializeCodecsOnStartup: false, |
|
||||
}, |
|
||||
}, |
|
||||
webWorkerPath: './dist/cornerstoneWADOImageLoader.bundleCopy.min.js', |
|
||||
}); |
|
||||
cornerstoneTools.init({ |
|
||||
mouseEnabled: true, //触摸 |
|
||||
touchEnabled: true, //鼠标 |
|
||||
showSVGCursors: true, |
|
||||
autoResizeViewports: true, |
|
||||
}); |
|
||||
const element = document.getElementById('dicomImage'); |
|
||||
|
|
||||
cornerstone.enable(element); |
|
||||
|
|
||||
// const PanTool = cornerstoneTools.PanTool; |
|
||||
|
|
||||
const StackScrollTool = cornerstoneTools.StackScrollTool; |
|
||||
const StackScrollMouseWheelTool = |
|
||||
cornerstoneTools.StackScrollMouseWheelTool; |
|
||||
const imageIds = this.imageIds; |
|
||||
const stack = { |
|
||||
currentImageIdIndex: 0, |
|
||||
imageIds: imageIds, |
|
||||
}; |
|
||||
console.log('imageIds', imageIds); |
|
||||
element.addEventListener('cornerstonenewimage', (event) => { |
|
||||
console.log('event: ', event); |
|
||||
// console.log(event.detail.oldImage, stack.currentImageIdIndex, 'event') |
|
||||
this.hanldeByValue(stack.currentImageIdIndex); |
|
||||
}); |
|
||||
element.addEventListener('cornerstonetap', (event) => { |
|
||||
console.log('cornerstonetap: ', cornerstonetap); |
|
||||
const direction = event.detail.direction; |
|
||||
if (direction === 'LEFT') { |
|
||||
// 向左划动 |
|
||||
stack.currentImageIdIndex++; |
|
||||
} else if (direction === 'RIGHT') { |
|
||||
// 向右划动 |
|
||||
stack.currentImageIdIndex--; |
|
||||
} |
|
||||
|
|
||||
// 更新堆栈中的当前图像 |
|
||||
const imageIds = stack.imageIds; |
|
||||
const newImageIdIndex = stack.currentImageIdIndex; |
|
||||
const newImageId = imageIds[newImageIdIndex]; |
|
||||
cornerstone |
|
||||
.loadAndCacheImage(newImageId) |
|
||||
.then((loadedImage) => { |
|
||||
cornerstone.displayImage(element, loadedImage); |
|
||||
}); |
|
||||
}); |
|
||||
console.log('imageIds,', imageIds) |
|
||||
cornerstone.loadImage(imageIds[0]).then((image) => { |
|
||||
console.log(image, 'image'); |
|
||||
cornerstone.displayImage(element, image); |
|
||||
cornerstoneTools.addStackStateManager(element, ['stack']); |
|
||||
cornerstoneTools.addToolState(element, 'stack', stack); |
|
||||
// cornerstoneTools.addTool(PanTool); |
|
||||
cornerstoneTools.addTool(StackScrollTool, { |
|
||||
configuration: { |
|
||||
loop: true, |
|
||||
allowSkipping: true, |
|
||||
}, |
|
||||
}); |
|
||||
cornerstoneTools.addTool(StackScrollMouseWheelTool, { |
|
||||
configuration: { |
|
||||
loop: true, |
|
||||
allowSkipping: true, |
|
||||
invert: false, |
|
||||
}, |
|
||||
}); |
|
||||
// cornerstoneTools.setToolActive('Pan', { mouseButtonMask: 1 }); |
|
||||
cornerstoneTools.setToolActive('StackScroll', { |
|
||||
mouseButtonMask: 1, |
|
||||
}); |
|
||||
cornerstoneTools.setToolActive('StackScrollMouseWheel', { |
|
||||
mouseButtonMask: 4, |
|
||||
}); |
|
||||
}); |
|
||||
}, |
|
||||
// 显示dcm图片函数 |
|
||||
viewDcm1() { |
|
||||
var element = document.getElementById('dicomImage'); |
|
||||
//激活获取到的用于图片加载的区域 |
|
||||
console.log('this.toolType: ', this.toolType); |
|
||||
switch (this.toolType) { |
|
||||
case 'ScrollTool': |
|
||||
const StackScrollTool = cornerstoneTools.StackScrollTool; |
|
||||
const StackScrollMouseWheelTool = |
|
||||
cornerstoneTools.StackScrollMouseWheelTool; |
|
||||
cornerstoneTools.addTool(StackScrollTool, { |
|
||||
configuration: { |
|
||||
loop: true, |
|
||||
allowSkipping: true, |
|
||||
}, |
|
||||
}); |
|
||||
cornerstoneTools.addTool(StackScrollMouseWheelTool, { |
|
||||
configuration: { |
|
||||
loop: true, |
|
||||
allowSkipping: true, |
|
||||
invert: false, |
|
||||
}, |
|
||||
}); |
|
||||
// cornerstoneTools.setToolActive('Pan', { mouseButtonMask: 1 }); |
|
||||
cornerstoneTools.setToolActive('StackScroll', { |
|
||||
mouseButtonMask: 1, |
|
||||
}); |
|
||||
cornerstoneTools.setToolActive('StackScrollMouseWheel', { |
|
||||
mouseButtonMask: 4, |
|
||||
}); |
|
||||
break; |
|
||||
case 'Wwwc': |
|
||||
// 从cornerstoneTools库中获取窗宽,窗高工具 |
|
||||
const WwwcTool = cornerstoneTools.WwwcTool; |
|
||||
//添加WwwcTool窗宽,窗高工具 |
|
||||
cornerstoneTools.addTool(WwwcTool); |
|
||||
// 绑定工具操作功能到鼠标左键 |
|
||||
cornerstoneTools.setToolActive('Wwwc', { |
|
||||
mouseButtonMask: 1, |
|
||||
}); |
|
||||
break; |
|
||||
case 'Angle': |
|
||||
// 角度工具 |
|
||||
const AngleTool = cornerstoneTools.AngleTool; |
|
||||
cornerstoneTools.addTool(AngleTool); |
|
||||
cornerstoneTools.setToolActive('Angle', { |
|
||||
mouseButtonMask: 1, |
|
||||
}); |
|
||||
break; |
|
||||
case 'RectangleRoi': |
|
||||
// 矩形Roi工具 |
|
||||
const RectangleRoiTool = cornerstoneTools.RectangleRoiTool; |
|
||||
cornerstoneTools.addTool(RectangleRoiTool); |
|
||||
cornerstoneTools.setToolActive('RectangleRoi', { |
|
||||
mouseButtonMask: 1, |
|
||||
}); |
|
||||
break; |
|
||||
case 'DragProbe': |
|
||||
// 拖动探针工具 |
|
||||
const DragProbeTool = cornerstoneTools.DragProbeTool; |
|
||||
cornerstoneTools.addTool(DragProbeTool); |
|
||||
cornerstoneTools.setToolActive('DragProbe', { |
|
||||
mouseButtonMask: 1, |
|
||||
}); |
|
||||
break; |
|
||||
case 'Length': |
|
||||
// 长度工具 |
|
||||
const LengthTool = cornerstoneTools.LengthTool; |
|
||||
cornerstoneTools.addTool(LengthTool); |
|
||||
cornerstoneTools.setToolActive('Length', { |
|
||||
mouseButtonMask: 1, |
|
||||
}); |
|
||||
break; |
|
||||
case 'Zoom': |
|
||||
// 放大缩小 |
|
||||
const ZoomMouseWheelTool = |
|
||||
cornerstoneTools.ZoomMouseWheelTool; |
|
||||
cornerstoneTools.addTool(ZoomMouseWheelTool); |
|
||||
cornerstoneTools.setToolActive('ZoomMouseWheel', { |
|
||||
mouseButtonMask: 1, |
|
||||
}); |
|
||||
break; |
|
||||
case 'eliminate': |
|
||||
// 清空效果 |
|
||||
cornerstoneTools.clearToolState(element, 'Length'); |
|
||||
break; |
|
||||
default: |
|
||||
throw new Error('工具参数错误'); |
|
||||
break; |
|
||||
} |
|
||||
}, |
|
||||
clearAllTool() { |
|
||||
for (let k in this.name) { |
|
||||
cornerstoneTools.clearToolState(this.element, this.name[k]); |
|
||||
} |
|
||||
// 写了他才能让界面也更新清除了tool的视图 |
|
||||
cornerstone.updateImage(this.element); |
|
||||
// reset viewport将视图重置位置 |
|
||||
cornerstone.reset(this.element); |
|
||||
}, |
|
||||
// 给父组件传值 |
|
||||
hanldeByValue(_index) { |
|
||||
this.$emit('byValue', _index); |
|
||||
}, |
|
||||
}, |
|
||||
}; |
|
||||
</script> |
|
||||
|
|
||||
<style> |
|
||||
/* 定义图片显示区域div大小 */ |
|
||||
#dicomImage { |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
} |
|
||||
|
|
||||
.btn { |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
flex-wrap: wrap; |
|
||||
} |
|
||||
</style> |
|
||||
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,3 +0,0 @@ |
|||||
/*! cornerstone-web-image-loader - 2.1.1 - 2018-12-05 | (c) 2016 Chris Hafey | https://github.com/cornerstonejs/cornerstoneWebImageLoader */ |
|
||||
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("cornerstoneWebImageLoader",[],t):"object"==typeof exports?exports.cornerstoneWebImageLoader=t():e.cornerstoneWebImageLoader=t()}(window,function(){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:r})},n.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=5)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.external=void 0;var r,o=n(4),a=(r=o)&&r.__esModule?r:{default:r};var u=void 0,i={set cornerstone(e){u=e,(0,a.default)(u)},get cornerstone(){return u}};t.external=i},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.loadImage=function(e){var t=r.external.cornerstone,n=new XMLHttpRequest;return n.open("GET",e,!0),n.responseType="arraybuffer",i.beforeSend(n),n.onprogress=function(n){if(n.lengthComputable){var r=n.loaded,o=n.total,a=Math.round(r/o*100),u={imageId:e,loaded:r,total:o,percentComplete:a};t.triggerEvent(t.events,"cornerstoneimageloadprogress",u)}},{promise:new Promise(function(t,r){n.onload=function(){(0,o.default)(this.response).then(function(n){var r=(0,a.default)(n,e);t(r)},r)},n.send()}),cancelFn:function(){n.abort()}}},t.configure=function(e){i=e};var r=n(0),o=u(n(3)),a=u(n(2));function u(e){return e&&e.__esModule?e:{default:e}}var i={beforeSend:function(){}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e,t){var n=e.naturalHeight,u=e.naturalWidth;return{imageId:t,minPixelValue:0,maxPixelValue:255,slope:1,intercept:0,windowCenter:128,windowWidth:255,render:r.external.cornerstone.renderWebImage,getPixelData:function(){return(n=void 0,a===t?n=o.getContext("2d"):(o.height=e.naturalHeight,o.width=e.naturalWidth,(n=o.getContext("2d")).drawImage(e,0,0),a=t),n.getImageData(0,0,e.naturalWidth,e.naturalHeight)).data;var n},getCanvas:function(){return a===t?o:(o.height=e.naturalHeight,o.width=e.naturalWidth,o.getContext("2d").drawImage(e,0,0),a=t,o)},getImage:function(){return e},rows:n,columns:u,height:n,width:u,color:!0,rgba:!1,columnPixelSpacing:void 0,rowPixelSpacing:void 0,invert:!1,sizeInBytes:n*u*4}};var r=n(0),o=document.createElement("canvas"),a=void 0},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){return new Promise(function(t,n){var r=new Image,o=new Uint8Array(e),a=new Blob([o]),u=window.URL||window.webkitURL,i=u.createObjectURL(a);r.src=i,r.onload=function(){t(r),u.revokeObjectURL(i)},r.onerror=function(e){u.revokeObjectURL(i),n(e)}})}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){e.registerImageLoader("http",r.loadImage),e.registerImageLoader("https",r.loadImage)};var r=n(1)},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.external=t.configure=t.loadImage=t.createImage=t.arrayBufferToImage=void 0;var r=i(n(3)),o=i(n(2)),a=n(1),u=n(0);function i(e){return e&&e.__esModule?e:{default:e}}var d={arrayBufferToImage:r.default,createImage:o.default,loadImage:a.loadImage,configure:a.configure,external:u.external};t.arrayBufferToImage=r.default,t.createImage=o.default,t.loadImage=a.loadImage,t.configure=a.configure,t.external=u.external,t.default=d}])}); |
|
||||
//# sourceMappingURL=cornerstoneWebImageLoader.min.js.map
|
|
||||
File diff suppressed because it is too large
File diff suppressed because it is too large
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue