From 530b44a4ee4c02d4cb29428633946cbbede36394 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=BE=89?= <814457906@qq.com>
Date: Wed, 30 Oct 2024 14:36:36 +0800
Subject: [PATCH] xg

---
 src/api/system/questionnaireinquiry.js        |  21 +
 src/components/myPagination/index.vue         |   2 -
 src/views/components/DepartmentList.vue       |   5 +
 src/views/index.vue                           |   1 -
 .../questionnaireinquirycomponent.vue         | 209 +++++++
 src/views/system/question/index.vue           |   2 +-
 .../system/questionnaireinquiry/index.vue     | 508 ++++++++++++++++++
 7 files changed, 744 insertions(+), 4 deletions(-)
 create mode 100644 src/api/system/questionnaireinquiry.js
 create mode 100644 src/views/system/components/questionnaireinquirycomponent.vue
 create mode 100644 src/views/system/questionnaireinquiry/index.vue

diff --git a/src/api/system/questionnaireinquiry.js b/src/api/system/questionnaireinquiry.js
new file mode 100644
index 0000000..a46f99a
--- /dev/null
+++ b/src/api/system/questionnaireinquiry.js
@@ -0,0 +1,21 @@
+import request from '@/utils/request'
+
+//列表
+export function departmenQuestionSubmitCount(query) {
+    return request({
+        url: '/system/patientQuestionSubmitResult/departmenQuestionSubmitCount',
+        method: 'get',
+        params: query
+    })
+}
+
+
+
+//列表
+export function patientQuestionSubmitList(query) {
+    return request({
+        url: '/system/patientQuestionSubmitResult/patientQuestionSubmitList',
+        method: 'get',
+        params: query
+    })
+}
diff --git a/src/components/myPagination/index.vue b/src/components/myPagination/index.vue
index af2fb19..6383fac 100644
--- a/src/components/myPagination/index.vue
+++ b/src/components/myPagination/index.vue
@@ -209,7 +209,6 @@ export default {
     //监听当前页下标
     indexFromWrap: {
       handler(val) {
-        console.log(val)
         this.currentPage = val;
       },
       deep: true,
@@ -217,7 +216,6 @@ export default {
     },
     indexFrom: {
       handler(val) {
-        console.log(val, "100tiao");
         if (val) {
           this.currentpageSize = val;
         } else {
diff --git a/src/views/components/DepartmentList.vue b/src/views/components/DepartmentList.vue
index 0611766..d2cf5b2 100644
--- a/src/views/components/DepartmentList.vue
+++ b/src/views/components/DepartmentList.vue
@@ -68,6 +68,9 @@ import { listServicePackageNum } from "@/api/manage/servicepackage";
 import {
     selectDiseaseCount
 } from "@/api/system/specialDiseaseRoute";
+import {
+    departmenQuestionSubmitCount
+} from '@/api/system/questionnaireinquiry'
 import {
     selectDiseaseCounts,
 } from "@/api/system/departmentDisease";
@@ -251,6 +254,8 @@ export default {
                 method = selectDiseaseCount(this.querydepartmen)
             } else if (this.methods == 'selectDiseaseCounts') {
                 method = selectDiseaseCounts(this.querydepartmen)
+            } else if (this.methods == 'departmenQuestionSubmitCount') {
+                method = departmenQuestionSubmitCount(this.querydepartmen)
             }
             this.DepartmentoList = []
             method.then(response => {
diff --git a/src/views/index.vue b/src/views/index.vue
index cf1f70c..14765df 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -138,7 +138,6 @@ export default {
         this.taskSituationlist = res.data;
         this.taskSituationlist.forEach((e) => {
           e.content = Math.ceil((e.count / e.allCount) * 100);
-          console.log(e.content, " e.content");
         });
       });
     },
diff --git a/src/views/system/components/questionnaireinquirycomponent.vue b/src/views/system/components/questionnaireinquirycomponent.vue
new file mode 100644
index 0000000..7374946
--- /dev/null
+++ b/src/views/system/components/questionnaireinquirycomponent.vue
@@ -0,0 +1,209 @@
+<template>
+    <div class="container">
+        <el-button size="small" @click="classificationOpen = true" style="
+          width: 200px;
+          font-size: 14px;
+          text-align: left;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+          overflow: hidden;
+        " :style="handleselectName ? 'color:black' : 'color:#C0C4CC'">{{ handleselectName ? handleselectName : "选择问卷"
+            }}</el-button>
+        <el-dialog title="问卷库模板选择" :visible.sync="classificationOpen" width="70%"
+            :before-close="classificationOpenfalse" :modal-append-to-body="false">
+            <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="70px">
+                <el-form-item label="问卷标题" prop="questionnaireName">
+                    <el-input v-model="queryParams.questionnaireName" placeholder="请输入问卷标题" clearable
+                        @keyup.enter.native="handleQuery" />
+                </el-form-item>
+                <el-form-item label="病种名称" prop="diseaseTypeName">
+                    <el-input v-model="queryParams.diseaseTypeName" placeholder="请输入病种名称" clearable
+                        @keyup.enter.native="handleQuery" />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+                    <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+                </el-form-item>
+            </el-form>
+            <el-table v-loading="loading" :data="questionList" @row-dblclick="handleselect">
+                <el-table-column label="序号" type="index" width="48" align="center" />
+                <el-table-column label="问卷标题" align="center" prop="questionnaireName" />
+                <el-table-column label="问题个数" align="center" prop="questionCount" />
+                <el-table-column label="问卷模板ID" align="center" prop="questionnaireId" />
+                <el-table-column label="问卷状态" align="center" prop="questionnaireStatus">
+                    <template slot-scope="scope">
+                        <el-switch v-model="scope.row.questionnaireStatus" active-color="#13ce66"
+                            inactive-color="#ff4949" active-value="PUBLISHED" inactive-value="UNPUBLISHED" disabled
+                            @change="switchstatus($event, scope.row)">
+                        </el-switch>
+                    </template>
+                </el-table-column>
+                <el-table-column label="病种名称" align="center" prop="diseaseTypeName" />
+                <el-table-column label="操作" align="center">
+                    <template slot-scope="scope">
+                        <el-button size="mini" type="text" @click="handlesee(scope.row)">预览</el-button>
+                        <el-button size="mini" type="text" @click="handleselect(scope.row)"
+                            v-if="handleselectId != scope.row.id">选择</el-button>
+                        <el-button size="mini" type="text" @click="nohandleselect(scope.row)"
+                            v-if="handleselectId == scope.row.id">取消选择</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
+                :limit.sync="queryParams.pageSize" @pagination="getList" />
+        </el-dialog>
+        <el-dialog title="问卷预览" :visible.sync="showquestion" width="40%">
+            <div class="righttextarea">
+                <questionopennew :lookitemnew="lookitemnew" v-if="showquestion"></questionopennew>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import {
+    listQuestion,
+    getQuestion,
+    delQuestion,
+    addQuestion,
+    updateQuestion,
+    getDepartmentList,
+    selectUserDepartment,
+    diseaseList,
+    updateclassification,
+} from "@/api/system/question";
+import questionopennew from "./questionopennew.vue";
+import { questionname } from "@/api/system/taskExecuteRecord";
+export default {
+    name: "questionnaireinquirycomponent",
+    props: ["departmentId", 'hospitalAgencyId'],
+    components: {
+        questionopennew,
+    },
+    data() {
+        return {
+            showquestion: false,
+            classificationOpen: false,
+            // 遮罩层
+            loading: true,
+            // 总条数
+            total: 0,
+            // 问卷基本信息表格数据
+            questionList: [],
+            // 查询参数
+            queryParams: {
+                pageNum: 1,
+                pageSize: 10,
+                departmentId: null,
+                diseaseTypeName: null,
+                questionnaireName: null,
+                questionnaireStatus: "PUBLISHED",
+                // questionType: "REGULAR_QUESTIONNAIRE"
+            },
+            handleselectId: "",
+            handleselectName: null,
+            lookitemnew: [],
+        };
+    },
+    watch: {
+    },
+    created() {
+    },
+    mounted() {
+        this.queryParams.hospitalAgencyId = this.hospitalAgencyId
+        this.queryParams.departmentId = this.departmentId
+    },
+    watch: {
+        departmentId(newValue, oldValue) {
+            this.queryParams.departmentId = newValue
+            this.handleQuery();
+        },
+        hospitalAgencyId(newValue, oldValue) {
+            this.queryParams.hospitalAgencyId = newValue
+            this.handleQuery();
+        },
+    },
+    methods: {
+        // //接收科室列表传值
+        // clickdepartment(item) {
+        //     this.queryParams.hospitalAgencyId = item.hospitalAgencyId
+        //     this.queryParams.hospitalAgencyName = item.hospitalAgencyName
+        //     this.queryParams.departmentId = item.itemid
+        //     if (item.hospitalAgencyId) {
+        //         this.handleQuery();
+        //     }
+        //     this.$forceUpdate()
+        // },
+        handlesee(row) {
+            this.showquestion = true;
+            questionname(row.id).then((res) => {
+                this.lookitemnew = res.data;
+            });
+        },
+        clickDepartmenitem(item) {
+            this.loading = true;
+            this.queryParams.departmentId = item.id;
+            this.getList();
+        },
+        nohandleselect() {
+            this.handleselectId = "";
+            this.handleselectName = "";
+            this.$emit("on-template", { templateId: "", templateName: "" });
+        },
+        handleselect(item) {
+            this.handleselectId = item.id;
+            this.handleselectName = item.questionnaireName;
+            this.$emit("on-template", {
+                templateId: item.id,
+                templateName: item.questionnaireName,
+            });
+            this.classificationOpen = false;
+        },
+        classificationOpenfalse() {
+            this.classificationOpen = false;
+        },
+        /** 查询问卷基本信息列表 */
+        getList() {
+            this.loading = true;
+            this.queryParams.questionnaireStatus = "PUBLISHED";
+            // this.queryParams.questionType = "REGULAR_QUESTIONNAIRE"
+            listQuestion(this.queryParams).then((response) => {
+                this.questionList = response.rows;
+                this.total = response.total;
+                this.loading = false;
+            });
+        },
+        /** 搜索按钮操作 */
+        handleQuery() {
+            this.queryParams.pageNum = 1;
+            this.getList();
+        },
+        /** 重置按钮操作 */
+        resetQuery() {
+            this.resetForm("queryForm");
+            this.handleQuery();
+        },
+    },
+};
+</script>
+<style scoped lang="scss">
+::v-deep .el-dialog__body {
+    padding-bottom: 60px;
+}
+
+.righttextarea {
+    // height: 200px;
+    padding: 10px;
+    // width: 90%;
+    // height: 100%;
+    border: 1.5px solid #c7c7c7;
+    border-radius: 5px;
+}
+
+.container {
+    padding: 0 !important;
+    display: inline-block;
+    // background: red;
+    height: 42px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/system/question/index.vue b/src/views/system/question/index.vue
index 598dd6f..009df21 100644
--- a/src/views/system/question/index.vue
+++ b/src/views/system/question/index.vue
@@ -36,7 +36,7 @@
         <div ref="table">
           <el-table :max-height="maxTableHeight" v-loading="loading" :data="questionList">
             <el-table-column label="序号" type="index" width="48" align="center" />
-            <el-table-column label="问卷模板名称" align="center" prop="questionnaireName" />
+            <el-table-column label="问卷标题" align="center" prop="questionnaireName" />
             <el-table-column label="问题个数" align="center" prop="questionCount" />
             <el-table-column label="问卷模板ID" align="center" prop="questionnaireId" />
             <el-table-column label="问卷类型" align="center" prop="questionType">
diff --git a/src/views/system/questionnaireinquiry/index.vue b/src/views/system/questionnaireinquiry/index.vue
new file mode 100644
index 0000000..e3e05e8
--- /dev/null
+++ b/src/views/system/questionnaireinquiry/index.vue
@@ -0,0 +1,508 @@
+<template>
+    <div class="app-container" ref="layout">
+        <el-row :gutter="20">
+            <!--部门数据-->
+            <el-col :span="5" :xs="24">
+                <DepartmentList ref="DepartmentList" @clickdepartment="clickdepartment"
+                    :methods="'departmenQuestionSubmitCount'">
+                </DepartmentList>
+            </el-col>
+            <!--用户数据-->
+            <el-col :span="19" :xs="24">
+                <div ref="topform" class="form">
+                    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="70px">
+                        <el-form-item label="问卷标题" prop="questionnaireName">
+                            <questionnaireinquirycomponent :departmentId="queryParams.departmentId"
+                                @on-template="questionontemplate" ref="questionnaireinquirycomponent"
+                                :hospitalAgencyId="queryParams.hospitalAgencyId"></questionnaireinquirycomponent>
+                        </el-form-item>
+                        <el-form-item label="患者姓名" prop="diseaseTypeName">
+                            <el-input v-model="queryParams.diseaseTypeName" placeholder="请输入患者姓名" clearable
+                                @keyup.enter.native="handleQuery" />
+                        </el-form-item>
+                        <el-form-item label="日期" prop="diseaseTypeName" label-width="50px">
+                            <el-date-picker v-model="visitDate" type="daterange" range-separator="至"
+                                start-placeholder="起始日期" style="width: 220px" value-format="yyyy-MM-dd"
+                                end-placeholder="截止日期">
+                            </el-date-picker>
+                        </el-form-item>
+                        <el-form-item>
+                            <el-button type="primary" icon="el-icon-search" size="mini"
+                                @click="handleQuery">搜索</el-button>
+                            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+                        </el-form-item>
+                    </el-form>
+                </div>
+                <div ref="table">
+                    <el-table :max-height="maxTableHeight" v-loading="loading" :data="questionList">
+                        <el-table-column label="序号" type="index" width="48" align="center" />
+                        <el-table-column label="姓名" align="center" prop="patientName" />
+                        <el-table-column label="问卷标题" align="center" prop="questionnaireName" />
+                        <el-table-column label="得分" align="center" prop="totalScore" />
+                        <el-table-column label="填写时间" align="center" prop="createTime" />
+                        <el-table-column label="医院" align="center" prop="hospitalAgencyName" />
+                        <el-table-column label="科室" align="center" prop="departmentName" />
+                        <el-table-column label="入院时间" align="center" prop="admissionTime" />
+                        <el-table-column label="出院/就诊日期" align="center" prop="dischargeTime" />
+                        <el-table-column label="门诊/住院号" align="center" prop="inHospitalNumber" width="115" />
+                        <el-table-column label="操作" align="center">
+                            <template slot-scope="scope">
+                                <el-button size="mini" type="text" @click="look(scope.row)">详情</el-button>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+                <myPagination v-show="total > 0" :total="total" :pageSize="queryParams.pageSize"
+                    :indexFromWrap="queryParams.pageNum" @updateCPage="updateCPage"></myPagination>
+            </el-col>
+        </el-row>
+        <el-dialog title="问卷详情" :visible.sync="questionshow" width="40%">
+            <div class="bottomheader">
+                <div class="right">
+                    <div class="words" v-for="(item, index) in questiondata.subjectResultList" :key="index">
+                        {{ index + 1 }}.{{ item.questionName }}
+                        <span v-if="item.questionType == 'MULTIPLE_CHOICE'">（单选题）</span>
+                        <span v-if="item.questionType == 'MULTIPLE_CHOICE_QUESTIONS'">（多选题）</span>
+                        <span v-if="item.questionType == 'SCORING_QUESTIONS'">（打分题）</span>
+                        <span v-if="item.questionType == 'COMBINATION_RADIO_SUBJECT'">（组合单选题）</span>
+                        <span v-if="item.questionType == 'COMBINATION_MULTIPLE_SUBJECT'">（组合多选题）</span>
+                        <span v-if="item.questionType == 'COMBINATION_BLANKS_SUBJECT'">（组合填空题）</span>
+                        <span v-if="item.questionType == 'FILL_IN_THE_BLANKS'">（填空题）</span>
+                        <span v-if="item.questionType == 'COMBINATION_SCORING_SUBJECT'">（组合打分题）</span>
+                        <span v-if="item.questionType == 'DATE_BLANKS_SUBJECT'">（日期填空题）</span>
+                        <span v-if="item.questionType == 'TIME_BLANKS_SUBJECT'">（时间填空题）</span>
+                        <el-radio-group
+                            v-if="item.questionType == 'MULTIPLE_CHOICE' || item.questionType == 'COMBINATION_RADIO_SUBJECT' || item.questionType == 'SCORING_QUESTIONS' || item.questionType == 'COMBINATION_SCORING_SUBJECT'"
+                            v-model="item.checked" class="custom-radio-group" @change="radioGroupChange($event, item)">
+                            <el-radio disabled class="custom" v-for="(aitem, aindex) in item.optionResults"
+                                :key="aindex" :label="aitem.id" @change="radioChange($event, aitem, index)">
+                                {{ aitem.optionName }}
+                            </el-radio>
+                        </el-radio-group>
+                        <el-checkbox-group v-model="checkeddata" @change="radioGroupChange($event, item, 'checkbox')"
+                            v-if="item.questionType == 'MULTIPLE_CHOICE_QUESTIONS' || item.questionType == 'COMBINATION_MULTIPLE_SUBJECT'">
+                            <el-checkbox disabled v-for="(aitem, aindex) in item.optionResults" :key="aindex"
+                                :label="aitem.id" @change="radioChangecheck($event, aitem, index, aindex)">
+                                {{ aitem.optionName }}
+                            </el-checkbox>
+                        </el-checkbox-group>
+                        <div v-if="item.questionType == 'FILL_IN_THE_BLANKS' || item.questionType == 'COMBINATION_BLANKS_SUBJECT'"
+                            class="tk">
+                            <el-input disabled v-model="item.fillBlanksAnswer" placeholder="请输入答案" type="textarea" />
+                        </div>
+                        <div v-if="item.questionType == 'DATE_BLANKS_SUBJECT'" style="margin: 20px 0 10px 30px">
+                            <el-date-picker disabled @change="timepicker($event, index)" clearable
+                                v-model="item.fillBlanksAnswer" type="date" value-format="yyyy-MM-dd"
+                                placeholder="选择日期">
+                            </el-date-picker>
+                        </div>
+                        <div style="margin: 20px 0 10px 30px" v-if="item.questionType == 'TIME_BLANKS_SUBJECT'">
+                            <el-time-select disabled @change="timepickerselect($event, index)" clearable
+                                v-model="item.fillBlanksAnswer"
+                                :picker-options="{ start: '08:30', step: '00:30', end: '23:30', }" placeholder="选择时间">
+                            </el-time-select>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import {
+    selectQuestionnaireResult
+} from "@/api/system/SatisfactionQuestionnaireDetails";
+import { listQuestion, getQuestion, delQuestion, addQuestion, updateQuestion, getDepartmentList, selectUserDepartment, diseaseList, updateclassification } from "@/api/system/question";
+import DepartmentList from '../../components/DepartmentList.vue'
+import { copyBaselnfo } from "@/api/system/exportinfo";
+import questionexport from "@/views/manage/components/questionexport.vue"
+import questionnaireinquirycomponent from "../components/questionnaireinquirycomponent.vue"
+import {
+    patientQuestionSubmitList
+} from '@/api/system/questionnaireinquiry'
+export default {
+    components: {
+        DepartmentList,
+        questionexport,
+        questionnaireinquirycomponent
+    },
+    name: "questionnaireinquiry",
+    data() {
+        return {
+            // 导入弹框
+            maxTableHeight: undefined,
+            // 遮罩层
+            loading: true,
+            // 总条数
+            total: 0,
+            // 问卷基本信息表格数据
+            questionList: [],
+            departmentlist: [],
+            // 查询参数
+            queryParams: {
+                pageNum: 1,
+                pageSize: 10,
+                departmentId: null,
+                departmentName: null,
+                diseaseTypeId: null,
+                diseaseTypeName: null,
+                questionnaireName: null,
+                questionnaireDescription: null,
+                answeringMethod: null,
+                questionnaireId: null,
+                questionCount: null,
+                questionnaireTotalScore: null,
+                questionnaireStatus: null,
+                questionnaireSort: null,
+                questionnaireRemark: null,
+                startDate: null,
+                endDate: null,
+            },
+            visitDate: [],
+            //详情
+            questionshow: false,
+            questiondata: {
+                totalScore: 0, //总分
+                routeHandlePerson: null,
+                routeHandleId: null,
+            },
+            checkeddata: [],
+        };
+    },
+    created() {
+        // this.getList();
+    },
+    mounted() {
+        this.getMaxTableHeight()
+        this.screenChange()
+    },
+    methods: {
+        //详情
+        look(item) {
+            selectQuestionnaireResult(item.patientQuestionSubmitResultId).then(res => {
+                this.questiondata = res.data;
+                this.questiondata.subjectResultList.forEach((e) => {
+                    e.optionResults.forEach((el) => {
+                        if ((el.optionChooseSign == "0" && e.questionType == "MULTIPLE_CHOICE") || e.questionType == "COMBINATION_RADIO_SUBJECT") {
+                            e.checked = el.id;
+                        } else if (el.optionChooseSign == "0" && e.questionType == "MULTIPLE_CHOICE_QUESTIONS"
+                        ) {
+                            this.checkeddata.push(el.id);
+                        } else if (el.optionChooseSign == "0" && e.questionType == "SCORING_QUESTIONS"
+                        ) {
+                            e.checked = el.id;
+                        } else if (e.questionType == "COMBINATION_MULTIPLE_SUBJECT" && el.optionChooseSign == "0"
+                        ) {
+                            this.checkeddata.push(el.id);
+                        }
+                    });
+                });
+                this.questionshow = true
+            })
+        },
+        //问卷传值
+        questionontemplate(item) {
+            this.queryParams.questionInfoId = item.templateId
+            this.queryParams.questionnaireName = item.templateName
+        },
+        //接收科室列表传值
+        clickdepartment(item) {
+            this.queryParams.hospitalAgencyId = item.hospitalAgencyId
+            this.queryParams.hospitalAgencyName = item.hospitalAgencyName
+            this.queryParams.departmentId = item.itemid
+            this.queryParams.departmentName = item.itemName
+            this.departmentName = item.itemName
+            if (item.hospitalAgencyId) {
+                this.handleQuery();
+            }
+            this.$forceUpdate()
+        },
+        /** 查询问卷基本信息列表 */
+        getList() {
+            this.loading = true;
+            if (this.visitDate?.length > 0) {
+                this.queryParams.startDate = this.visitDate[0];
+                this.queryParams.endDate = this.visitDate[1];
+            } else {
+                this.queryParams.startDate = null;
+                this.queryParams.endDate = null;
+            }
+            patientQuestionSubmitList(this.queryParams).then(response => {
+                this.questionList = response.rows;
+                this.total = response.total;
+                this.loading = false;
+            });
+        },
+        /** 搜索按钮操作 */
+        handleQuery() {
+            this.queryParams.pageNum = 1;
+            this.getList();
+        },
+        /** 重置按钮操作 */
+        resetQuery() {
+            this.visitDate = [];
+            this.queryParams.visitDateStart = null;
+            this.queryParams.visitDateEnd = null;
+            this.$refs.questionnaireinquirycomponent.nohandleselect();
+            this.$refs.DepartmentList.resetQuery()
+            this.resetForm("queryForm");
+            // this.handleQuery();
+        },
+        updateCPage(index, size) {
+            this.queryParams.pageNum = index
+            this.queryParams.pageSize = size
+            this.getList();
+        },
+        // 获取表格最高高度
+        getMaxTableHeight() {
+            const windowInnerHeight = window.innerHeight // 屏幕可视高度
+            const layoutDiv = this.$refs.layout
+            const formDiv = this.$refs.topform
+            const mb8Div = this.$refs.mb8
+            this.maxTableHeight =
+                windowInnerHeight - 134 -
+                this.getBoxPadding(layoutDiv) -
+                this.getBoxHeight(mb8Div) -
+                this.getBoxHeight(formDiv)
+        },
+        // 屏幕resize监听
+        screenChange() {
+            // 屏幕resize监听事件：一旦屏幕宽高发生变化，就会执行resize
+            window.addEventListener('resize', this.getMaxTableHeight, true)
+            // 将屏幕监听事件移除
+            // 这步是必须的。离开页面时不移除，再返回，或者进入到别的有相同元素的页面会报错
+            // 或者将这里的方法直接写在beforeDestroy函数中也可以
+            this.$once('hook:beforeDestroy', () => {
+                window.removeEventListener('resize', this.getMaxTableHeight, true)
+            })
+        },
+    }
+};
+</script>
+<style scoped lang="scss">
+.left {
+    height: calc(100vh - 119px);
+    overflow: auto;
+
+    .name {
+        font-weight: 700;
+        margin-bottom: 10px;
+    }
+
+    .listitem {
+        width: 100%;
+        height: 50px;
+        border-bottom: 1px solid #dcdfe6;
+        position: relative;
+
+        .count {
+            display: inline-block;
+            position: absolute;
+            left: 210px;
+            color: #a4a6aa;
+            top: 50%;
+            transform: translateY(-50%);
+            font-size: 13px;
+        }
+
+        .all {
+            height: 50px;
+            line-height: 50px;
+            padding-left: 13px;
+        }
+
+        .allactive {
+            background: #e8f4ff;
+            height: 50px;
+            line-height: 50px;
+            padding-left: 13px;
+            border-left: 3px solid #4d9de7;
+        }
+    }
+}
+</style>
+<style lang="scss" scoped>
+.app-container {
+    padding: 20px 0 0 20px !important;
+}
+
+::v-deep .el-dialog__footer {
+    padding-top: 33px !important;
+
+}
+
+::v-deep .el-row {
+    height: 100% !important;
+}
+</style>
+<style lang="scss" scoped>
+::v-deep .el-input.is-disabled .el-input__inner{
+    background-color: #fff !important;
+    color: black !important;
+}
+::v-deep .el-textarea.is-disabled .el-textarea__inner{
+    background-color: #fff !important;
+    color: black !important;
+}
+::v-deep .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
+    border: 1px solid #DCDFE6 !important;
+    border-color: #1890ff !important;
+}
+
+::v-deep .el-checkbox__input.is-disabled+span.el-checkbox__label {
+    color: black !important;
+}
+
+::v-deep .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
+    border-color: #1890ff !important;
+}
+::v-deep .el-checkbox__input.is-disabled .el-checkbox__inner{
+    background-color: #fff !important;
+}
+::v-deep .el-radio__input.is-disabled .el-radio__inner {
+    border: 1px solid #DCDFE6 !important;
+    background-color: #fff !important;
+}
+
+::v-deep .el-radio__input.is-disabled.is-checked .el-radio__inner {
+    border-color: #1890ff !important;
+}
+
+::v-deep .el-radio__input.is-disabled.is-checked .el-radio__inner::after {
+    color: #1890ff !important;
+    background-color: #1890ff !important;
+}
+
+::v-deep .el-radio__input.is-disabled+span.el-radio__label {
+    color: black !important;
+}
+
+.tk {
+    ::v-deep .el-textarea__inner {
+        margin: 20px 0 10px 30px;
+    }
+}
+
+::v-deep .el-radio {
+    padding: 10px;
+}
+
+::v-deep .el-checkbox-group {
+    display: flex;
+    flex-direction: column;
+    padding: 10px 0px 10px 24px;
+}
+
+::v-deep .el-checkbox {
+    padding: 10px 0 10px 0px;
+    // padding: 10px;
+}
+
+.custom-radio-group {
+    display: flex;
+    flex-direction: column;
+    padding: 10px 0 10px 10px;
+
+    .custom {
+        padding: 10px 0 10px 10px;
+    }
+}
+
+.custom-radio-group {
+    display: flex;
+    flex-direction: column;
+    padding: 10px 0 10px 10px;
+
+    .custom {
+        padding: 10px 0 10px 10px;
+    }
+}
+
+.right {
+    width: 100%;
+    height: 500px;
+    // background: yellow;
+}
+
+.bottomheader {
+    height: calc(100vh - 170px);
+    overflow: auto;
+    width: 99%;
+    background-color: #fff;
+    margin: 10px auto;
+    padding: 10px 20px;
+
+    .sport {
+        padding: 10px 50px 10px 10px;
+        font-size: 20px;
+        font-weight: 600;
+    }
+
+    .words {
+        font-size: 15px;
+        padding: 10px 50px 10px 10px;
+    }
+
+    .sports {
+        position: absolute;
+        left: 50%;
+        transform: translate(-50%);
+        font-size: 18px;
+        font-weight: 600;
+    }
+
+    .word {
+        font-size: 14px;
+        font-weight: 550;
+        padding: 50px 50px 10px 10px;
+    }
+
+    .videoleft {
+        width: 40%;
+        height: 200px;
+        background: red;
+    }
+
+    .time {
+        font-size: 20px;
+        font-weight: 550;
+        padding: 10px 50px 10px 10px;
+    }
+
+    .number {
+        width: 25px;
+        height: 25px;
+        text-align: center;
+        display: inline-block;
+        color: white;
+        background: blue;
+        border-radius: 50%;
+    }
+
+    .nexttime {
+        font-size: 15px;
+        padding: 10px 50px 10px 10px;
+    }
+
+    .images {
+        width: 53%;
+        height: 241px;
+        margin: 0 auto;
+        background: red;
+    }
+
+    .attention {
+        font-size: 14px;
+        font-weight: 550;
+        padding: 10px 50px 10px 10px;
+    }
+
+    // .videobottom
+    // {
+    //   font-size: 14px;
+    //   font-weight: 550;
+    //   padding: 10px 50px 10px 10px;
+    // }
+}
+</style>