123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331 |
- <template>
- <div>
- <common @asynCallBack="asynCallBack"></common>
- <top-header :pageTitle="pageTitle"></top-header>
- <div class="mui-content margin60">
- <div class="mui-content-padded vongi-qingjiadt vongi-editme">
- <form class="mui-input-group">
- <div class="mui-input-row">
- <label>就医医院<i style="color: red">*</i></label>
- <input type="text" class="mui-input-clear" v-model="detail.hospitalName" placeholder="请填写医院名称" />
- </div>
- <div class="mui-input-row">
- <label>就医时间<i style="color: red">*</i></label>
- <button class="mui-btn mui-btn-block mui-navigate-right mui-ellipsis" @click="selectDate" type="button" style="width: 65%">
- {{ detail.hospitalTime ? detail.hospitalTime : "请选择" }}
- </button>
- </div>
- </form>
- </div>
- <div class="vongi-meform-pho mui-content-padded">
- <h4>病因<i style="color: red">*</i></h4>
- <div class="mui-input-row">
- <textarea id="textarea" rows="5" v-model="detail.pathogeny" placeholder="请填写病因"></textarea>
- </div>
- </div>
- <div class="vongi-meform-pho mui-content-padded">
- <h4>就医结果</h4>
- <div class="mui-input-row">
- <textarea id="textarea" rows="5" v-model="detail.result" placeholder="请填写就医结果"></textarea>
- </div>
- </div>
- <div class="vongi-wordcard vongi-meform-pho mui-content-padded">
- <h4>结果图片记录</h4>
- <div class="fyy-upphoto">
- <div class="mui-col-xs-3 fyy-upphoto-close" v-for="(picture, index) in resultImg" :key="index">
- <img v-image-preview v-if="picture" :src="picture + '?x-oss-process=image/resize,m_fill,w_128,h_128'" />
- <a class="mui-icon mui-icon-closeempty" @click="delImg('1', index)"></a>
- </div>
- <div class="mui-col-xs-3">
- <a><span class="mui-icon mui-icon-camera" @click="changeImg('1')"></span></a>
- </div>
- </div>
- </div>
- <div class="vongi-meform-pho mui-content-padded">
- <h4>使用药品</h4>
- <div class="mui-input-row">
- <textarea id="textarea" rows="5" v-model="detail.drugs" placeholder="请填写使用药品"></textarea>
- </div>
- </div>
- <div class="vongi-wordcard vongi-meform-pho mui-content-padded">
- <h4>药品图片记录</h4>
- <div class="fyy-upphoto">
- <div class="mui-col-xs-3 fyy-upphoto-close" v-for="(picture, index) in drugsImg" :key="index">
- <img v-image-preview v-if="picture" :src="picture + '?x-oss-process=image/resize,m_fill,w_128,h_128'" />
- <a class="mui-icon mui-icon-closeempty" @click="delImg('2', index)"></a>
- </div>
- <div class="mui-col-xs-3">
- <a><span class="mui-icon mui-icon-camera" @click="changeImg('2')"></span></a>
- </div>
- </div>
- </div>
- <div class="mui-content-padded vongi-qingjiadt vongi-editme">
- <form class="mui-input-group">
- <div class="mui-input-row">
- <label>诊疗费用(元)</label>
- <span style="padding-top: 0px; padding-bottom: 0px">
- <input v-model="detail.cost" placeholder="请填写诊疗费用" class="mui-input-clear" type="number" />
- </span>
- </div>
- </form>
- </div>
- <div class="vongi-wordcard vongi-meform-pho mui-content-padded">
- <h4>诊疗费用图</h4>
- <div class="fyy-upphoto">
- <div class="mui-col-xs-3 fyy-upphoto-close" v-for="(picture, index) in costImg" :key="index">
- <img v-image-preview v-if="picture" :src="picture + '?x-oss-process=image/resize,m_fill,w_128,h_128'" />
- <a class="mui-icon mui-icon-closeempty" @click="delImg('3', index)"></a>
- </div>
- <div class="mui-col-xs-3">
- <a><span class="mui-icon mui-icon-camera" @click="changeImg('3')"></span></a>
- </div>
- </div>
- </div>
- </div>
- <div class="fyy-footer">
- <div class="bindfyy-btn">
- <button type="submit" class="mui-btn mui-btn-pink" @click="submit()">
- 保 存
- </button>
- </div>
- </div>
- <loading :visible="isLoading"></loading>
- </div>
- </template>
- <script>
- require("$project/assets/js/mui.picker.min.js");
- import * as API from "@/apis/Master/hospital";
- import Common from "$project/components/Common.vue";
- import Loading from "$project/components/Loading.vue";
- import TopHeader from "$project/components/TopHeader.vue";
- import * as WxJsApi from "$project/utils/wxJsApi";
- import {
- mapGetters,
- mapMutations
- } from "vuex";
- import {} from "$project/utils";
- export default {
- name: "MasterHospitalForm",
- components: {
- Common,
- Loading,
- TopHeader,
- },
- data() {
- return {
- pageTitle: "就医记录",
- isLoading: false,
- drugsImg: [],
- resultImg: [],
- costImg: [],
- detail: {
- cost: "", //费用
- costImg: "",
- delFlag: false,
- drugs: "", //药品
- drugsImg: "",
- hospitalName: "", //医院
- hospitalTime: "",
- id: "",
- popedomId: "",
- pathogeny: "", //病因
- result: "", //就医结果
- resultImg: "", //结果图片
- updateBy: "",
- updateTime: "",
- },
- };
- },
- created() {
- },
- methods: {
- checkForm() {
- if (!this.detail.hospitalName) {
- mui.toast("请输入就医医院");
- return false;
- } else if (!this.detail.hospitalTime) {
- mui.toast("请选择就医时间");
- return false;
- } else if (!this.detail.pathogeny) {
- mui.toast("请输入病因");
- return false;
- }
- return true;
- },
- submit() {
- if (!this.checkForm()) {
- return;
- }
- this.detail.popedomId = this.$route.query.popedomId;
- this.detail.resultImg = this.resultImg.join(",");
- this.detail.drugsImg = this.drugsImg.join(",");
- this.detail.costImg = this.costImg.join(",");
- this.isLoading = true;
- if (!this.detail.id) {
- API.medicalRecordAdd(this.detail)
- .then((res) => {
- this.$router.push({
- name: "MasterHospital",
- query: {},
- });
- this.detail = res;
- mui.toast("已提交");
- })
- .catch((error) => {
- this.isLoading = false;
- mui.toast(error);
- });
- } else {
- API.medicalRecordUpdate(this.detail)
- .then((res) => {
- this.$router.push({
- name: "MasterHospital",
- query: {},
- });
- this.detail = res;
- mui.toast("已提交");
- })
- .catch((error) => {
- this.isLoading = false;
- mui.toast(error);
- });
- }
- },
- changeImg(type) {
- var sz = [];
- if (type == 1) {
- sz = this.resultImg;
- } else if (type == 2) {
- sz = this.drugsImg;
- } else if (type == 3) {
- sz = this.costImg;
- }
- if (sz.length >= 10) {
- mui.toast("只能上传10张照片");
- return;
- }
- var _this = this;
- WxJsApi.chooseImage()
- .then((res) => {
- var localData = res.localData;
- if (localData.indexOf("data:image") != 0) {
- //判断是否有这样的头部
- localData = "data:image/jpeg;base64," + localData;
- }
- localData = localData
- .replace(/\r|\n/g, "")
- .replace("data:image/jgp", "data:image/jpeg");
- this.imgBase64 = localData;
- //显示裁剪图片
- //_this.showCropper(field);
- this.uploadpic(sz);
- })
- .catch((error) => {
- mui.toast(error);
- });
- },
- delImg(type, index) {
- var sz;
- if (type == 1) {
- sz = this.resultImg;
- } else if (type == 2) {
- sz = this.drugsImg;
- } else if (type == 3) {
- sz = this.costImg;
- }
- sz.splice(index, 1);
- },
- //上传图片
- uploadpic(sz) {
- this.isLoading = true;
- WxJsApi.uploadPic(this.imgBase64)
- .then((response) => {
- this.isLoading = false;
- sz.push(response);
- })
- .catch((error) => {
- this.isLoading = false;
- mui.toast(error);
- });
- },
- selectDate() {
- var dtPicker = new mui.DtPicker({
- type: "date",
- beginYear: 1900,
- endDate: new Date(),
- });
- dtPicker.show((selectItems) => {
- var year = selectItems.y.value;
- var month = selectItems.m.value;
- var day = selectItems.d.value;
- var curDate = year + "-" + month + "-" + day;
- this.detail.hospitalTime = curDate;
- });
- },
- getDetail() {
- this.isLoading = true;
- API.medicalRecordDetail(this.$route.query.id)
- .then((res) => {
- this.detail = res;
- this.isLoading = false;
- if (this.detail.resultImg) {
- this.resultImg = this.detail.resultImg.split(",");
- }
- if (this.detail.drugsImg) {
- this.drugsImg = this.detail.drugsImg.split(",");
- }
- if (this.detail.costImg) {
- this.costImg = this.detail.costImg.split(",");
- }
- })
- .catch((error) => {
- this.isLoading = false;
- });
- },
- asynCallBack() {},
- },
- mounted() {
- WxJsApi.getWxConfig();
- if (this.$route.query.id) {
- this.getDetail();
- }
- //
- },
- destroyed() {},
- computed: {
- ...mapGetters({
- openId: "wx_openid",
- token: "token",
- person_data: "person_data",
- person_popedom: "person_popedom",
- }),
- },
- };
- </script>
- <style scoped src="$project/assets/css/pension.css"></style>
- <style scoped src="$project/assets/css/xpwyfyy.css"></style>
- <style src="$project/assets/css/iconfont.css"></style>
- <style src="$project/assets/css/mui.picker.min.css"></style>
- <style>
- </style>
|