|
@@ -0,0 +1,246 @@
|
|
|
+<template>
|
|
|
+ <div class="container">
|
|
|
+ <div class="bgimg"></div>
|
|
|
+ <div class="content">
|
|
|
+ <div class="title">出血打卡</div>
|
|
|
+ <div class="loginForm">
|
|
|
+ <div class="numSubTitle">
|
|
|
+ <mt-field class="inputDisable" disabled placeholder="请选择时间" v-model="form.bleed_time"
|
|
|
+ @click.native="flag=0">
|
|
|
+ <img src="../assets/images/down.png" alt="" width="16px">
|
|
|
+ </mt-field>
|
|
|
+ <span>出血时间</span>
|
|
|
+ </div>
|
|
|
+ <mt-field class="inputDisable" disabled label="出血部位" v-model="form.bleed_part"
|
|
|
+ @click.native="flag=1" placeholder="请选择">
|
|
|
+ <img src="../assets/images/down.png" alt="" width="16px">
|
|
|
+ </mt-field>
|
|
|
+ <mt-field v-if='form.bleed_part == "关节出血"' class="inputDisable" disabled label="关节" v-model="form.bleed_part_detail"
|
|
|
+ @click.native="flag=2" placeholder="请选择">
|
|
|
+ <img src="../assets/images/down.png" alt="" width="16px">
|
|
|
+ </mt-field>
|
|
|
+ <mt-field class="inputDisable" disabled label="出血原因" v-model="form.bleed_reason"
|
|
|
+ @click.native="flag=3" placeholder="请选择">
|
|
|
+ <img src="../assets/images/down.png" alt="" width="16px">
|
|
|
+ </mt-field>
|
|
|
+ <mt-field class="inputDisable" disabled label="出血程度" v-model="form.bleed_level"
|
|
|
+ @click.native="flag=4" placeholder="请选择">
|
|
|
+ <img src="../assets/images/down.png" alt="" width="16px">
|
|
|
+ </mt-field>
|
|
|
+ </div>
|
|
|
+ <div class="footer">
|
|
|
+ <div class="jbbtn" @click="$router.go(-1)">返回</div>
|
|
|
+ <button :disabled="lock ? 'disabled':false" class="jbbtn" @click="submit">确认</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 注射时间t0 -->
|
|
|
+ <mt-datetime-picker ref="t0Picker" type="datetime" year-format="{value} 年" month-format="{value} 月"
|
|
|
+ date-format="{value} 日" hourFormat="{value}时" minuteFormat="{value}分" @confirm='changeTime0' :endDate='endDate'
|
|
|
+ :startDate='startDate' v-model="now" @touchmove.native.stop.prevent>
|
|
|
+ </mt-datetime-picker>
|
|
|
+ <vue-hash-calendar
|
|
|
+ :visible="flag==0"
|
|
|
+ ref="zssjt0"
|
|
|
+ model="dialog"
|
|
|
+ :is-show-action="true"
|
|
|
+ picker-type="datetime"
|
|
|
+ format="YY-MM-DD hh:mm"
|
|
|
+ @confirm="dateConfirmZssjt0"
|
|
|
+ :change-year-fast="true"
|
|
|
+ ></vue-hash-calendar>
|
|
|
+ <!-- 出血部位 -->
|
|
|
+ <mt-picker v-if="flag == 1" :slots="options.chux_parts" ref="Picker1" class="sexPicker"
|
|
|
+ :showToolbar="true" @change="(picker,values)=>onValuesChange(picker,values,'bleed_part')">
|
|
|
+ <div class="pickerConfirm" @click="flag=-1">确认</div>
|
|
|
+ </mt-picker>
|
|
|
+ <!-- 关节 -->
|
|
|
+ <mt-picker v-if="flag == 2" :slots="options.guanjie" ref="sexPicker" class="sexPicker"
|
|
|
+ :showToolbar="true" @change="(picker,values)=>onValuesChange(picker,values,'bleed_part_detail')">
|
|
|
+ <div class="pickerConfirm" @click="flag=-1">确认</div>
|
|
|
+ </mt-picker>
|
|
|
+ <!-- 出血原因-->
|
|
|
+ <mt-picker v-if="flag == 3" :slots="options.chux_reason" ref="sexPicker" class="sexPicker"
|
|
|
+ :showToolbar="true" @change="(picker,values)=>onValuesChange(picker,values,'bleed_reason')">
|
|
|
+ <div class="pickerConfirm" @click="flag=-1">确认</div>
|
|
|
+ </mt-picker>
|
|
|
+ <!-- 出血程度 -->
|
|
|
+ <mt-picker v-if="flag == 4" :slots="options.chux_level" ref="sexPicker" class="sexPicker"
|
|
|
+ :showToolbar="true" @change="(picker,values)=>onValuesChange(picker,values,'bleed_level')">
|
|
|
+ <div class="pickerConfirm" @click="flag=-1">确认</div>
|
|
|
+ </mt-picker>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ Field,
|
|
|
+ Picker,
|
|
|
+ MessageBox
|
|
|
+ } from 'mint-ui'
|
|
|
+
|
|
|
+ export default {
|
|
|
+ name: 'Index',
|
|
|
+ components: {
|
|
|
+ Field,
|
|
|
+ Picker,
|
|
|
+ MessageBox
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ lock:false,
|
|
|
+ form: {
|
|
|
+ bleed_time:'',
|
|
|
+ bleed_part:''
|
|
|
+ },
|
|
|
+ flag:-1,
|
|
|
+ startDate: new Date(this.$datetime.formatDateTime(new Date("2023/01/01 00:00:00"))),
|
|
|
+ endDate: new Date(this.$datetime.formatDateTime(new Date("2024/01/01 00:00:00"))),
|
|
|
+ now: new Date(),
|
|
|
+ options:{
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ goPage(path) {
|
|
|
+ this.$router.push(path)
|
|
|
+ },
|
|
|
+ changeTime0(value) {
|
|
|
+ this.form.bleed_time = this.$datetime.formatDateTime(value).replaceAll("/", "-")
|
|
|
+ },
|
|
|
+ dateConfirmZssjt0(value){
|
|
|
+ this.form.bleed_time = value
|
|
|
+ this.flag = -1
|
|
|
+ },
|
|
|
+ onValuesChange(picker, values, item) {
|
|
|
+ this.$set(this.form,item,values[0])
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ if (!this.form.bleed_part) {
|
|
|
+ MessageBox({
|
|
|
+ title: '提示',
|
|
|
+ message: '请选择出血部位'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }else if(this.form.bleed_part == "关节出血" && !this.form.bleed_part_detail){
|
|
|
+ MessageBox({
|
|
|
+ title: '提示',
|
|
|
+ message: '请选择出血关节'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (!this.form.bleed_reason) {
|
|
|
+ MessageBox({
|
|
|
+ title: '提示',
|
|
|
+ message: '请输入出血原因'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (!this.form.bleed_level) {
|
|
|
+ MessageBox({
|
|
|
+ title: '提示',
|
|
|
+ message: '请选择出血程度'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.lock=true
|
|
|
+ let params = this.form
|
|
|
+ this.$api.regPatientClockBleed(params).then(res => {
|
|
|
+ if (!res.data.code) {
|
|
|
+ this.goPage("/patclockbleedsuc")
|
|
|
+ }else{
|
|
|
+ this.lock=false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.form.bleed_time=this.$datetime.formatDateTime(new Date()).replaceAll("/", "-")
|
|
|
+ this.$api.get_patient_bleed_options().then(res=>{
|
|
|
+ const data=res.data.data
|
|
|
+ const opt={
|
|
|
+ flex: 1,
|
|
|
+ values: [],
|
|
|
+ className: 'slot1',
|
|
|
+ textAlign: 'center'
|
|
|
+ }
|
|
|
+ const options={
|
|
|
+ chux_parts:[{...opt}],
|
|
|
+ guanjie:[{...opt}],
|
|
|
+ chux_reason:[{...opt}],
|
|
|
+ chux_level:[{...opt}]
|
|
|
+ }
|
|
|
+ options.chux_parts[0].values=data.chux_parts
|
|
|
+ options.guanjie[0].values=data['关节出血']
|
|
|
+ options.chux_reason[0].values=data.chux_reason
|
|
|
+ options.chux_level[0].values=data.chux_level
|
|
|
+ this.options=options
|
|
|
+ })
|
|
|
+ },
|
|
|
+ }
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+ .loginForm {
|
|
|
+ width: 84%;
|
|
|
+ margin: auto;
|
|
|
+ margin-top: 4rem;
|
|
|
+ background: #fff;
|
|
|
+ padding: 1rem;
|
|
|
+ border-radius: 5px;
|
|
|
+ // height: 12rem;
|
|
|
+
|
|
|
+ .mint-field {
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ border-radius: 50px;
|
|
|
+ margin-top: 1rem;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mint-cell {
|
|
|
+ min-height: 2.12rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .numSubTitle {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ span {
|
|
|
+ position: absolute;
|
|
|
+ left: 15px;
|
|
|
+ top: 10px;
|
|
|
+ font-size:1.2rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .numSubTitle .mint-field-core {
|
|
|
+ margin-left: 105px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .mint-cell .mint-cell-title {
|
|
|
+ /* width: 60%; */
|
|
|
+ /* text-align: left; */
|
|
|
+ font-size:1.2rem;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .mint-cell .mint-cell-value {
|
|
|
+ /* width: 40%; */
|
|
|
+ /* text-align: right; */
|
|
|
+ font-size:1.2rem;
|
|
|
+ }
|
|
|
+
|
|
|
+ .footer {
|
|
|
+ display: flex;
|
|
|
+ margin-top:2rem;
|
|
|
+ .jbbtn {
|
|
|
+ width: 42%;
|
|
|
+ margin-top: 1rem;
|
|
|
+ margin-bottom: 1rem;
|
|
|
+ border: none;
|
|
|
+ &:disabled{
|
|
|
+ background: #d9d9d9;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+</style>
|