 <!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('随访任务详情')" />
    <th:block th:include="include :: layout-latest-css" />
    <th:block th:include="include :: ztree-css" />
</head>
<style>
    .styled-input5 {
        /*display: block; /* 使其独占一行 */
        width: 150px; /* 宽度为容器宽度 */
        height: 26px;
        padding: 6px; /* 内边距 */
        font-size: 14px; /* 字体大小 */
        color: #333; /* 字体颜色 */
        /*background-color: #fff; !* 背景颜色 *!*/
        border: 1px solid #ccc; /* 边框 */
        border-radius: 4px; /* 圆角边框 */
        outline: none; /* 移除轮廓 */
        transition: all 0.3s ease; /* 过渡动画 */
    }
    .btn {
        background-color: #f2f2f2;
        border: none;
        color: black;
        padding: 5px 10px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: 4px 2px;
        cursor: pointer;
    }

    .btn-primary {
        background-color: #1a7bb9;
        color: white;
    }

    .btn-w-m {
        width: max-content;
    }

    .btn-default {
        background-color: #f2f2f2;
        color: black;
    }
    .btn:hover {
        opacity: 0.8;
    }
    .tab-1a {
        padding-left: 50px;
        width: 100px;
        font-size: 15px
    }
    .tab-1b {
        width: 100px;
        color: blue;
        font-size:15px;
    }
    .task-follow-up {
        display: flex;
        align-items: center;
    }

    .follow-up-person, .plan-buttons {
        flex: 1;
    }

    .plan-buttons {
        text-align: right;
    }
    .ibox-title2 {
        display: flex;
        align-items: center;
        justify-content: start;
        padding: 10px;
        border-bottom: 1px solid #ddd;
    }
    .right-aligned-link {
        float: right;
        margin-left: 20px; /* 增加左侧边距 */
    }

    .right-aligned-link::after {
        content: ">";
        color: blue;
    }
    .task-info {
        flex: 1;
    }

    .task-details {
        flex: 2;
        display: flex;
        align-items: center;
        gap: 20px;
    }

    .task-buttons {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 10px;
    }

    .task-buttons span {
        margin-left: 10px;
    }

    .task-details span {
        display: flex;
        align-items: center;
        gap: 5px;
    }
    .custom-file-upload {
        position: relative;
        overflow: hidden;
        cursor: pointer;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .custom-file-upload input[type=file] {
        opacity: 0;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        position: absolute;
    }

    .custom-file-upload label {
        background-color: white;
        border: 2px dashed #007bff;
        color: #007bff;
        padding: 20px;
        text-align: center;
        display: block;
        min-height: 150px;
    }
    #hbyyjlTable {
        width: 100%;
        border-collapse: collapse;
    }

     th,
     td {
        padding: 10px;
        text-align: center;
        border-bottom: 1px solid #ddd;
    }

     thead th {
        background-color: #f2f2f2;
        font-weight: bold;
    }

     tbody tr:hover {
        background-color: #f5f5f5;
    }

     .no-data {
        text-align: center;
        padding: 0px;
    }

    .btn-primarys {
        margin-left: 10px;
        color: green;
    }



    .customize-form-group3 {
        width: 700px;
        display: flex;
    }

    .input-groups3 {
        flex-direction: column;
    }

    .radio-item {
        margin-bottom: 10px;
    }

    .radio-item label {
        margin-left: 5px;
    }
    .hidden {
        display: none;
    }

    .shown {
        display: block;
    }
</style>
<script>

</script>
<body>
<div class="">
    <div class="ibox">
        <form id="form-followUp-edit1">
        <div class="ibox-title">
            <button class="btn btn-w-m btn-primary"  onclick="editArchives()">完善档案</button>
            <button type="button" class="btn btn-sm btn-danger pull-right" onclick="closeItem()">返回上一级</button>
        </div>

        <input type="hidden" id="id" name="id" th:value="${id}">
        <div class="customize-form-group">
            <label>姓名：</label>
            <input name="name" id="name"   class="select-input" type="text"  th:value="${name}" disabled="true"/>
            &nbsp; <i class="fa" th:class="${realNameStatus == 1 ? 'fa fa-check' : 'fa fa-close'}" id="checkName"  ></i>
            <input name="realNameStatus" id="realNameStatus" class="status" type="text"   th:value="${realNameStatus == 1 ? '已实名' : (realNameStatus == 0 ? '未实名' : '')}" readonly>
            <label>性别：</label>
            <select name="gender" class="select-input" th:with="type=${@dict.getType('sys_user_sex')}" disabled="true" />
                <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"
                        th:selected="${dict.dictValue} == ${gender}" ></option>
            </select>
            <span class="span_line" readonly></span>
            <label>出生年月：</label>
            <input name="dateBirth" id="dateBirth" placeholder="出生年月" class="select-input"  type="text"    th:value="${dateBirth}" disabled="true" />
            <span class="status" style="width: 66px">
            <input  name="age" type="text" id="age" th:value="${age}" style="text-align: center;width: 30px;border: none;" readonly />岁</span>
        </div>


        <div class="ibox-content">
            <div>
                <span>信息完整度：已完善---></span>
                <div class="stat-percent">90%</div>
                <div class="progress progress-mini">
                    <div style="width: 90%;" class="progress-bar"></div>
                </div>
            </div>
        </div>
     </form>
    </div>
    <div class="ui-layout-center">
        <div class="row">
            <div class="col-sm-12">
                <div class="tabs-container">
                    <ul class="nav nav-tabs" id="myUlTabs">
                        <li class="active"><a data-toggle="tab" href="#tab-1" aria-expanded="true"> 基本信息</a>
                        </li>
                        <li class=""><a data-toggle="tab" href="#tab-2" aria-expanded="false">用药购药</a>
                        </li>
                        <li class=""><a data-toggle="tab" href="#tab-3" aria-expanded="false">随访计划</a>
                        </li>
                    </ul>
                    <div class="tab-content">
                        <div id="tab-1" class="tab-pane active">
                                <form class="customize-search-form" id="form-followUp-edit2" >

                                    <div class="customize-form-group edit">
                                        <label>手机号码：</label>
                                        <input name="phoneNumber" id="phoneNumber" class="styled-input" type="text" maxlength="30" th:value="${phoneNumber}" disabled="true">
                                        <span class="span_line" readonly></span>
                                    </div>

                                    <div class="customize-form-group">
                                        <label>配送地址：</label>
                                        <input name="addr" disabled="true"  id="addr" class="styled-input " type="text" th:value="${addr}">
                                        <span class="span_line" readonly></span>
                                    </div>
                                    <div class="customize-form-group">
                                        <label>联系人手机号：</label>
                                        <input name="contactPhone" disabled="true"  id="contactPhone" class="styled-input" type="text" th:value="${contactPhone}">
                                        <span class="span_line" readonly></span>
                                    </div>
                                    <div class="customize-form-group">
                                        <label>联系人姓名：</label>
                                        <input name="contactName"disabled="true"  id="contactName" class="styled-input" type="text" th:value="${contactName}">
                                        <span class="span_line" readonly></span>
                                    </div>
                                    <div class="customize-form-group edit">
                                        <label>D值品名称：</label>
                                        <input name="dvalueName" id="dvalueName" class="styled-input" type="text"  th:value="${dvalueName}" disabled="true">
                                        <span class="span_line" readonly></span>
                                    </div>
                                    <div class="customize-form-group edit">
                                        <label>D值品天数：</label>
                                        <input name="dvalueDay" id="dvalueDay" class="styled-input" type="text" th:value="${dvalueDay}" disabled="true">
                                        <span class="span_line" readonly></span>
                                    </div>
                                    <div class="customize-form-group edit select-time">
                                        <label>首次确诊时间：</label>
                                        <input name="timeFirstDiagnosis" disabled="true" class="styled-input"  type="text"  th:value="${timeFirstDiagnosis}">
                                        <span class="span_line" readonly></span>
                                    </div>
                                    <div class="customize-form-group edit">
                                        <label >证件号码：</label>
                                        <input name="documentType" placeholder="证件类型" class="styled-input short" type="text"  th:value="${documentType}" disabled="true">
                                        <input name="documentNumber" placeholder="请输入证件号码" class="styled-input" type="text" maxlength="30" th:value="${documentNumber}" disabled="true">
                                        <span class="span_line" readonly></span>
                                    </div>
                                    <div class="customize-form-group-container">
                                        <div class="customize-form-group">
                                            <label class="col-sm-1 control-label">肿瘤发病部位疾病：</label>
                                            <select id="category-select1"   class="styled-input edit_inputs select2-multiple" disabled="true">
                                            </select>
                                        </div>
                                        <div class="customize-form-group">
                                            <label class="col-sm-1 control-label">肿瘤治疗并发症与合并症：</label>
                                            <select id="category-select2" class="styled-input edit_inputs select2-multiple" disabled="true">
                                            </select>
                                        </div>
                                        <div class="customize-form-group">
                                            <label class="col-sm-1 control-label">风湿免疫疾病名称：</label>
                                            <select id="category-select3"   class="styled-input edit_inputs select2-multiple"  disabled="true">
                                            </select>
                                        </div>
                                        <div class="customize-form-group">
                                            <label class="col-sm-1 control-label">罕见病疾病：</label>
                                            <select id="category-select4" class="styled-input edit_inputs select2-multiple"  disabled="true">
                                            </select>
                                        </div>
                                        <div class="customize-form-group">
                                            <label class="col-sm-1 control-label">感染类疾病：</label>
                                            <select id="category-select5"   class="styled-input edit_inputs select2-multiple" disabled="true">
                                            </select>
                                        </div>
                                        <div class="customize-form-group">
                                            <label class="col-sm-1 control-label">临时慢病：</label>
                                            <select id="category-select6"   class="styled-input edit_inputs select2-multiple" disabled="true">
                                            </select>
                                        </div>
                                    </div>
                                </form>
                        </div>
                        <div id="tab-2" class="tab-pane">
                                    <div class="panel-body">
                                            <div class="row">
                                                <div class="col-sm-12 select-table table-striped">
                                                    <table id="bootstrap-table-2"></table>
                                                </div>
                                            </div>
                                    </div>
                        </div>
                    <div id="tab-3" class="tab-pane">
                            <div class="task-follow-up">
                                <div class="follow-up-person">
                                    <label for="followUpPerson" style="padding-left: 50px;">随访跟进人：</label>
                                    <input type="text" id="followUpPerson" value="蒋娟" style="border: none; width: 40px; color: red;" />
                                    <input type="hidden" id="followUpPersonId" name="followUpPersonId"/>
                                    <a href="#" onclick="editGenJinRen()">修改<i class="glyphicon glyphicon-pencil"></i></a>
                                </div>
                                <div class="plan-buttons">
                                    <button class="btn btn-w-m btn-primary" onclick="showAllPlan()">查看全部计划</button>
                                </div>
                            </div>
                            <div class="row">
                                <div class="ibox-content">
                                    <div class="ibox-title2">
                                             <code style="font-size: 1.5rem;padding-right: 30px;">
                                                 甲磺酸仑伐替尼胶囊药名
                                                 <a onclick="editGenJinRen()"><i class="glyphicon glyphicon-pencil"></i></a>
                                             </code>
                                        <code style="font-size: 1.5rem; padding-right: 30px;">
                                            20mg(1ml)/瓶
                                        </code>
                                        <code style="font-size: 1.5rem;color: #00B83F;padding-right: 30px;"><i class="glyphicon glyphicon-ice-lolly">常规随访</i></code>
                                        <code style="font-size: 1.5rem;color: #00B83F;padding-right: 30px;">进行中</code>
                                        <a onclick="closePlane()" href="javascript:void(0)" class="right-aligned-link">关闭计划</a>
                                    </div>
                                    </div>
                            </div>
                            <div class="row">
                                <div class="ibox-content">
                                    <div class="ibox-title2">
                                        <span style="padding-left: 10px;font-size:15px;">创建人:</span>
                                        <span style="width: 120px;color: #2E2D3C;font-size:15px;padding-right: 40px;">系统订单</span>
                                        <span style="font-size:15px;">开始时间:</span> <span style="width: 120px;color: #2E2D3C;font-size:15px;padding-right: 40px;">2024-08-19</span>
                                        <span style="font-size:15px;">更新人:</span> <span style="width: 100px;color: #2E2D3C;font-size:15px;">宝智达</span>
                                        <span style="font-size:15px;">更新时间:</span> <span style="width: 100px;color: #2E2D3C;font-size:15px;">2024-08-19</span>
                                        <a href="javascript:void(0)" onclick="ViewOperationLog()" class="right-aligned-link">查看操作记录</a>
                                    </div>

                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-12 select-table table-striped">
                                    <table id="bootstrap-table-4"></table>
                                </div>
                            </div>
                            <div class="row">
                                <div class="ibox-content">
                                    <div class="ibox-title2">
                                        <code style="font-size: 1.5rem; padding-right: 30px;">
                                            甲磺酸仑伐替尼胶囊药名
                                            <a onclick="editGenJinRen()"><i class="glyphicon glyphicon-pencil"></i> </a>
                                        </code>
                                        <code style="font-size: 1.5rem; padding-right: 30px;">
                                            20mg(1ml)/瓶
                                        </code>
                                        <code style="font-size: 1.5rem; color:#ec971f;padding-right: 30px;"><i class="glyphicon glyphicon-ice-lolly-tasted">脱落召回</i></code>
                                        <code style="font-size: 1.5rem;color: #00B83F;padding-right: 30px;">进行中</code>
                                        <a onclick="closePlane()" href="javascript:void(0)" class="right-aligned-link">关闭计划</a>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="ibox-content">
                                    <div class="ibox-title2">
                                        <span style="padding-left: 10px;font-size:15px;">创建人:</span>
                                        <span style="width: 120px;color: #2E2D3C;font-size:15px;padding-right: 40px;">系统订单</span>
                                        <span style="font-size:15px;">开始时间:</span> <span style="width: 120px;color: #2E2D3C;font-size:15px;padding-right: 40px;">2024-08-19</span>
                                        <span style="font-size:15px;">更新人:</span> <span style="width: 100px;color: #2E2D3C;font-size:15px;">宝智达</span>
                                        <span style="font-size:15px;">更新时间:</span> <span style="width: 100px;color: #2E2D3C;font-size:15px;">2024-08-19</span>
                                        <a href="javascript:void(0)" onclick="ViewOperationLog()" class="right-aligned-link">查看操作记录</a>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-12 select-table table-striped">
                                    <table id="bootstrap-table-5"></table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="ibox-content">
            <div class="ibox-title2">
                <div class="task-info">
                    <h4>本次任务 <code style="font-size: 1.5rem;">待执行</code></h4>
                </div>
                <div class="task-details">
                    <span style="font-size:15px;">任务名称：
                        <span style="font-size:15px;">随访</span>
                    </span>
<!--                        <span style="font-size:15px;">任务主题：-->
<!--                            <span>-->
<!--                                <select name="taskTheme" class="styled-input" th:with="type=${@dict.getType('sys_select_dtp_sfrw_rwzt')}">-->
<!--                                    <option value="">请选择</option>-->
<!--                                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"></option>-->
<!--                                </select>-->
<!--                           </span>-->
<!--                       </span>-->
                    <span style="font-size:15px;">任务跟进人：
                        <span style="color: #2E2D3C;font-size:15px;"><code style="font-size: 1.4rem;font-size:15px;">蒋娟</code>
                       <a onclick="editGenJinRen()" style="font-size:15px;"> 修改 <i class="glyphicon glyphicon-pencil"></i></a>
                       </span>
                    </span>
                </div>
                <div class="task-buttons">
                    <button class="btn btn-w-m btn-primary" onclick="showDetailHistory()">查看历史随访</button>
                </div>
            </div>
        </div>
        <form id="form-followUp-edit3" class="form-horizontal">
            <div class="row">
                <div class="col-sm-12">
                <div class="panel blank-panel">
                    <div class="panel-heading" style="width: 1100px;">
                        <div class="panel-options">
                            <ul class="nav nav-tabs" id="myTabs2">
                                <li class="active"><a data-toggle="tab" href="#tab-4" aria-expanded="true">本次任务</a>
                                </li>
                                <li class=""><a data-toggle="tab" href="#tab-6">用药依从性</a>
                                </li>
                                <li class=""><a data-toggle="tab" href="#tab-7" >不良反应</a>
                                </li>
                            </ul>
                        </div>
                    </div>

                    <div class="panel-body">
                        <div class="tab-content">
                            <div id="tab-4" class="tab-pane active">
                                <div class="customize-form-group edit">
                                    <label class="is-required">回访方式：</label>
                                    <div class="input-groups" th:with="type=${@dict.getType('sys_select_dtp_ysfw_huifangfangshi')}">
                                        <input type="radio" class="form-check-radio" name="huifanffs" id="huifanffs" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"   th:checked="${dict.dictLabel}==${currentEconomicSituation}">
                                    </div>

                                    <span class="status"></span>
                                </div>

                                <div id="weixin" class="hidden">
                                    <div class="customize-form-group edit">
                                        <label class="is-required" for="adverseReactionImage">回访图片：</label>
                                        <div class="custom-file-upload">
                                            <input type="file" id="adverseReactionImage" accept=".jpg,.jpeg,.png,.gif">
                                            <label for="adverseReactionImage"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#007bff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg></label>
                                        </div>
                                    </div>
                                </div>

                                <div id="mianfang" class="hidden">
                                    <div class="customize-form-group edit">
                                        <label>面访记录：</label>
                                        <div class="input-groups"  style="width: 50%">
                                            <input name="mfjilu" id="mfjilu" placeholder="请输入面访记录" class="styled-input edit_inputs" type="text" th:value="${weight}">
                                        </div>
                                        <span class="status"></span>
                                    </div>
                                </div>
                                <div class="customize-form-group">
                                    <label>回访对象：</label>
                                    <select name="bloodPressureStatus" class="select-input edit_inputs" th:with="type=${@dict.getType('sys_select_dtp_ysfw_huifangduixaing')}">
                                        <option value="">请选择</option>
                                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"
                                                th:selected="${dict.dictLabel}==${bloodPressureStatus}"></option>
                                    </select>
                                    <span class="status"></span>
                                </div>
                                <div class="customize-form-group edit">
                                    <label class="is-required">是否配合：</label>
                                    <div class="input-groups" th:with="type=${@dict.getType('sys_yes_no')}">
                                        <input type="radio" class="form-check-radio" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"  th:checked="${dict.dictLabel}==${followUpFeedbackDoctor}"  name="followUpFeedbackDoctor" >
                                    </div>
                                    <span class="status"></span>
                                </div>
                            </div>
                            <div id="tab-6" class="tab-pane active">
                                <div class="customize-form-group edit" >
                                    <label>用药状态:</label>
                                    <div class="input-groups" style="width: 90%" th:with="type=${@dict.getType('sys_gxhpz_yyycx')}">
                                        <input type="radio" class="form-check-radio" name="ischixuyystatus"  id="ischixuyystatus" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"   th:checked="${dict.dictLabel}==${currentEconomicSituation}" >
                                    </div>
                                    <span class="status"></span>
                                </div>
                                <div class="customize-form-group edit">
                                    <label class="is-required">确诊后首次用药日期：</label>
                                    <div class="input-groups select-time">
                                        <input name="timeFirstDiagnosis" placeholder="确诊后首次用药日期" class="time-input time-input2" type="text"  th:value="${timeFirstDiagnosis}" required>
                                    </div>
                                    <span class="status"></span>
                                </div>
                                <div id="csyzyy" class="hidden">
                                <div class="customize-form-group edit" >
                                    <label>慈善援助用药：</label>
                                    <div class="input-groups" th:with="type=${@dict.getType('sys_gxhpz_chishan_yzyy')}">
                                        <input type="radio" class="form-check-radio" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"  th:checked="${dict.dictLabel}==${followUpFeedbackDoctor}"  name="followUpFeedbackDoctor" >
                                    </div>
                                    <span class="status"></span>
                                </div>
                                </div>
                                <div id="yjty" class="hidden">
                                <div class="customize-form-group edit">
                                    <label>永久停药时间：</label>
                                    <div class="input-groups">
                                        <input name="timeFirstDiagnosis" placeholder="永久停药时间" class="time-input time-input2" type="text"  th:value="${timeFirstDiagnosis}" required>
                                    </div>
                                    <span class="status"></span>
                                </div>
                                <div class="customize-form-group edit">
                                    <label>永久停药原因：</label>
                                    <div class="input-groups" style="width: 90%" th:with="type=${@dict.getType('sys_gxhpz_yong_jiu_ting_yao_yuanyin')}">
                                        <input type="radio" class="form-check-radio" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"  th:checked="${dict.dictLabel}==${followUpFeedbackDoctor}"  name="followUpFeedbackDoctor" >
                                    </div>
                                    <span class="status"></span>
                                </div>
                                <div class="customize-form-group edit">
                                    <label>直接永久停药：</label>
                                    <div class="input-groups" th:with="type=${@dict.getType('sys_yes_no')}">
                                        <input type="radio" class="form-check-radio" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"  th:checked="${dict.dictLabel}==${followUpFeedbackDoctor}"  name="followUpFeedbackDoctor" >
                                    </div>
                                    <span class="status"></span>
                                    <span class="status"></span>
                                </div>
                                </div>
                                <div id="qtgyqgy" class="hidden">
                                <div class="customize-form-group edit">
                                    <label>其他渠道购药：</label>
                                    <div class="input-groups" style="width: 90%" th:with="type=${@dict.getType('sys_gxhpz_othetqd_gy')}">
                                        <input type="radio" class="form-check-radio" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"  th:checked="${dict.dictLabel}==${followUpFeedbackDoctor}"  name="followUpFeedbackDoctor" >
                                    </div>
                                    <span class="status"></span>
                                    <span class="status"></span>
                                </div>
                                </div>
                                <div id="ycgyycjy" class="hidden">
                                <div class="customize-form-group edit">
                                    <label>延迟购药(医嘱建议):</label>
                                    <div class="input-groups" style="width: 90%" th:with="type=${@dict.getType('sys_gxhpz_yanchi_gy_ys_jy')}">
                                        <input type="radio" class="form-check-radio" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"  th:checked="${dict.dictLabel}==${followUpFeedbackDoctor}"  name="followUpFeedbackDoctor" >
                                    </div>
                                    <span class="status"></span>
                                </div>
                                </div>
                                <div id="ycgyhzyybgf" class="hidden">
                                <div class="customize-form-group edit">
                                    <label>延迟购药(用药不规范):</label>
                                    <div class="input-groups" style="width: 90%" th:with="type=${@dict.getType('sys_gxhpz_yanchi_gyhzyybgf')}">
                                        <input type="radio" class="form-check-radio" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"  th:checked="${dict.dictLabel}==${followUpFeedbackDoctor}"  name="followUpFeedbackDoctor" >
                                    </div>
                                    <span class="status"></span>
                                </div>
                            </div>
                             </div>
                            <div id="tab-7" class="tab-pane active">
                                <div class="customize-form-group edit">
                                    <label  >是否出现不良反应：</label>
                                    <div class="input-groups" th:with="type=${@dict.getType('sys_yes_no')}">
                                        <input type="radio" class="form-check-radio"  th:each="dict : ${type}"  name="blfyyesOrno" id="blfyyesOrno" th:text="${dict.dictLabel}" th:value="${dict.dictLabel}"   th:checked="${dict.dictLabel}==${currentEconomicSituation}">
                                    </div>
                                    <span class="status"></span>
                                </div>
                                <div id="bulfydiv" class="hidden">

                                    <div class="customize-form-group edit">
                                        <label>不良反应时间：</label>
                                        <div class="input-groups" th:with="type=${@dict.getType('sys_yes_no')}">
                                            <input name="nyfysj" placeholder="永久停药时间" class="time-input time-input2" type="text"  th:value="${timeFirstDiagnosis}" required>
                                        </div>
                                        <span class="status"></span>
                                    </div>
                                    <div class="customize-form-group edit">
                                    <span class="status"></span>
                                     <div  class="tab-pane fade in active">
                                      <div class="panel-body">
                                        <div class="customize-search-form">
                                            <div class="customize-form-group edit">
                                                <div style="/*display: flex;*/">
                                                    <label style="width: auto;">不良反应症状:</label>
                                                    <button type="button" data-toggle="modal"  class="btn btn-xs btn-primary" data-target="#myModal5">新增不良反应</button>
                                                    <table id="byfyTable" style="width: 340px;">
                                                        <thead>
                                                        <tr>
                                                            <th>序号</th>
                                                            <th>不良反应症状</th>
                                                            <th>操作</th>
                                                        </tr>
                                                        </thead>
                                                        <tbody id="blfyTableBody">
                                                        <!-- 表格行将在这里动态添加 -->
                                                        </tbody>
                                                    </table>
                                                </div>

                                                <div class="modal inmodal fade" id="myModal5" tabindex="-1" role="dialog" aria-hidden="true">
                                                    <div class="modal-dialog modal-lg" style="width: 1000px">
                                                        <div class="modal-content">
                                                            <div class="modal-header">
                                                                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
                                                                </button>
                                                                <h4 class="modal-title">不良反应系统</h4>
                                                                <!--<small class="font-bold">这里可以显示副标题。</small>-->
                                                            </div>
                                                            <div class="modal-body">
                                                                <div id="element1" class="row">
                                                                    <div class="col-sm-2">
                                                                        <select class="province form-control m-b" data-first-title="选择不良反应">
                                                                            <option value="">请选择</option>
                                                                        </select>
                                                                    </div>
                                                                    <div class="col-sm-3">
                                                                        <select class="city form-control m-b" data-first-title="选择不良反应位置">
                                                                            <option value="">请选择</option>
                                                                        </select>
                                                                    </div>
                                                                    <div class="col-sm-7">
                                                                        <select class="area form-control m-b" data-first-title="选择不良反应数值">
                                                                            <option value="">请选择</option>
                                                                        </select>
                                                                    </div>
                                                                </div>
                                                            </div>

                                                            <div class="modal-footer">
                                                                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                                                                <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="selectAdverseReactions()">保存</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                            </div>
                                        </div>
                                    </div>

                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
       </form>
       </div>
    </div>
</div>
<form style="background-color: #f5f3f3;text-align: center;width: auto;" id="form-followUpTaskDetails">
    <div class="ibox-content" style="background-color: #f5f3f3;">
        <div class="ibox-title2">
            <button type="button" class="btn btn-warning" style="background-color: #f56666;" onclick="closeItem()">关闭</button>
            <div class="task-buttons">
                <button type="button" class="btn btn-primary" onclick="submitHandler()">保 存</button>
            </div>
        </div>
    </div>
</form>
<th:block th:include="include :: footer" />
<th:block th:include="include :: jquery-cxselect-js" />
<th:block th:include="include :: layout-latest-js" />
<th:block th:include="include :: bootstrap-table-fixed-columns-js" />
<th:block th:include="include :: ztree-js" />
</body>
</html>

<script>
    var formSubmitted = true;
    var prefix = ctx + "dtp/pmService";
    var  blfyindex=0;
    function submitHandler() {
        var selectedValue = $('input[name="huifanffs"]:checked').val();



        if (!selectedValue) {
            alert('请选择回访方式！');
            return;
        }

        if (selectedValue === '微信' && !$('#adverseReactionImage')[0].files.length) {
            alert('微信回访时，回访图片为必填项！');
            return;
        }

        if (selectedValue === '面访' && !$('#mfjilu').val()) {
            alert('面访时，面访记录为必填项！');
            return;
        }
        if ($.validate.form()) {
            var data = $("#form-followUp-edit").serializeArray();
            $.operate.saveTab(prefix + "/followUpEdit", data);
        }

        const byfyTableBody = document.getElementById('byfyTableBody');
        const rows2 = byfyTableBody.getElementsByTagName('tr');


        if (rows2.length > 0) {
            const rowsbyfys = [];//用药情况table
            $('#byfyTableBody tr').each(function () {
                const row = {
                    id:  $("#id").val(),
                    byfyData: $(this).find('td:eq(1)').text(),
                };
                rowsbyfys.push(row);
            });
            data.push({name:"rowsbyfys",value:JSON.stringify(rowsbyfys)})
        }





    }
    function deleteRow(button) {
        const row = button.parentNode.parentNode;
        row.remove();
        updateIndices(); // 删除后更新所有行的序号
    }
    // 更新所有行的序号
    function updateIndices() {
        $('#blfyTableBody tr').each(function(index) {
            $(this).find('td:first-child').text(index + 1); // 设置序号为当前索引加1
        });
    }
    function selectAdverseReactions() {

        var province = $('.province').val();
        var city = $('.city').val();
        var area = $('.area').val();
        $('.province, .city, .area').val('');

        // 打印不良选择的不良反应
        console.log('Selected: ' + province + ', ' + city + ', ' + area);
            var row = '<tr>' +
                '<td></td>' +
                '<td>' + province + ', ' + city + ', ' + area + '</td>' +
                '<td><button class="btn-danger" onclick="deleteRow(this)">删除</button></td>' +
                '</tr>';
            $('#blfyTableBody').append(row);
        blfyindex++; // 增加索引
        updateIndices(); // 添加后更新所有行的序号
    };

    //初始化加载
    $(document).ready(function() {
        // 通过默认url获取
        var urlChina = prefix+'/selectAdverseReactions';
        $.cxSelect.defaults.url = urlChina;
        $('#element1').cxSelect({
            selects: ['province', 'city', 'area'],
            nodata: 'none'
        });
        $("#myModal5").hide();

        // 初始化时设置默认显示状态
        updateVisibility();

        // 监听回访方式的选择变化
        $('input[name="huifanffs"]').on('change', updateVisibility);
        // 监听用药状态的选择变化
        $('input[name="ischixuyystatus"]').on('change', updateVisibility);
        // 监听不良反应的选择变化
        $('input[name="blfyyesOrno"]').on('change', updateVisibility);

        // 监听点击事件，激活指定的选项卡
        $('#myUlTabs li a').click(function(e) {
            // 阻止默认行为
            //e.preventDefault();
            // 获取当前点击的选项卡链接
            var $this = $(this);
            if($this.attr('href') === '#tab-1'){
                formSubmitted=true;
            }
            if($this.attr('href') === '#tab-2'){
                formSubmitted=false;
                // 添加 active 类到当前点击的选项卡
                $(this).addClass('active');
                $this.attr('aria-expanded', 'true');

            }
            // 检查是否为“用药购药”选项卡
            if ($this.attr('href') === '#tab-2') {
                // 初始化表格
                initializeTableForTab('tab-2');
            }
            if ($this.attr('href') === '#tab-3') {
                // 初始化表格
                initializeTableForTab('tab-3');
                // 初始化表格
                initializeTableForTab('tab-4');
            }

        });

        $('#myTabs2 li a').click(function(e) {
            // 阻止默认行为
            e.preventDefault();
            // 获取当前点击的选项卡链接
            var $this = $(this);
            // 移除所有选项卡的 active 类
            //$('#myTabs li').removeClass('active');
            //$('.tab-pane').removeClass('active in');
            $('#myTabs2 li a').addClass('active');
            // 添加 active 类到当前点击的选项卡
            $this.parent().addClass('active');
            // 获取目标选项卡面板的 ID
            var target = $this.attr('href');
            // 展示对应的选项卡面板，并更新 aria-expanded
            $(target).addClass('active in');
            $this.attr('aria-expanded', 'true');
            // 执行点击链接对应的动作
            $this.tab('show');
            // 移除所有选项卡的激活类
            //$('.active').removeClass('active');
            $(this).addClass('active');
            // 滚动到目标选项卡位置
            // 将目标内容区滚动到视口中央
            $('html, body').animate({
                scrollTop: $(target).offset().top - ($(window).height() / 2)
            }, 500); // 500毫秒动画时间
            // scrollToTab($this);
            // 重新初始化当前选项卡内的表格
            var tableId = target.replace('#', '');
           // initializeTableForTab(tableId);
        });

    });
    // 默认显示/隐藏逻辑
    function updateVisibility() {
        var weixinDiv = $('#weixin');
        var mianfangDiv = $('#mianfang');

        var selectedValue = $('input[name="huifanffs"]:checked').val();
        if (selectedValue === '微信') {
            weixinDiv.removeClass('hidden');
            mianfangDiv.addClass('hidden');
        } else if (selectedValue === '电话') {
            weixinDiv.addClass('hidden');
            mianfangDiv.addClass('hidden');
        } else if (selectedValue === '面访') {
            weixinDiv.addClass('hidden');
            mianfangDiv.removeClass('hidden');
        }

        var ischixuyystatus = $('input[name="ischixuyystatus"]:checked').val();
        var csyzyy = $('#csyzyy');//慈善援助用药
        var yjty = $('#yjty');//永久停药
        var qtgyqgy = $('#qtgyqgy');//其他渠道购药
        var ycgyycjy = $('#ycgyycjy');//延迟购药(医嘱建议)
        var ycgyhzyybgf = $('#ycgyhzyybgf');//延迟购药(患者用药不规范
            debugger
        if (ischixuyystatus === '持续购药') {
            csyzyy.addClass('hidden');
            yjty.addClass('hidden');
            qtgyqgy.addClass('hidden');
            ycgyycjy.addClass('hidden');
            ycgyhzyybgf.addClass('hidden');
        } else if (ischixuyystatus === '领取慈善赠药') {
            csyzyy.removeClass('hidden');
            yjty.addClass('hidden');
            qtgyqgy.addClass('hidden');
            ycgyycjy.addClass('hidden');
            ycgyhzyybgf.addClass('hidden');
        } else if (ischixuyystatus === '永久停药') {
            yjty.removeClass('hidden');
            csyzyy.addClass('hidden');
            qtgyqgy.addClass('hidden');
            ycgyycjy.addClass('hidden');
            ycgyhzyybgf.addClass('hidden');
        }else if (ischixuyystatus === '其他渠道购药') {
            qtgyqgy.removeClass('hidden');
            yjty.addClass('hidden');
            csyzyy.addClass('hidden');
            ycgyycjy.addClass('hidden');
            ycgyhzyybgf.addClass('hidden');
        }
        else if (ischixuyystatus === '延迟用药（医嘱建议）') {
            ycgyycjy.removeClass('hidden');
            qtgyqgy.addClass('hidden');
            yjty.addClass('hidden');
            csyzyy.addClass('hidden');
            ycgyhzyybgf.addClass('hidden');
        }
        else if (ischixuyystatus === '延迟购药 (患者用药不规范)') {
            ycgyhzyybgf.removeClass('hidden');
            qtgyqgy.addClass('hidden');
            yjty.addClass('hidden');
            csyzyy.addClass('hidden');
            ycgyycjy.addClass('hidden');
        }

        //是否出现不良反应
        var bulfydiv = $('#bulfydiv');
        var blfyyesOrno = $('input[name="blfyyesOrno"]:checked').val();
        if (blfyyesOrno === '是') {
            bulfydiv.removeClass('hidden');
        }
        if (blfyyesOrno === '否') {
            bulfydiv.addClass('hidden');
        }
    }

    function addblfy() {
        $('#myModal5').show();
    }
    function initializeTableForTab(tabId) {
        debugger

        var tableId = 'bootstrap-table-' + tabId.substring(4);
        var tableElement = $('#' + tableId);

        var data = {
            "patientPhone": $('#phoneNumber').val(),
            "patientName": $('#name').val(),
            "id": $('#id').val(),
            "flag": tabId.substring(4),
        };
        console.log("tabId="+tabId.substring(4));
        if(tabId==='tab-2'){
            var data2=[];
            // 初始化表格 getDrugPurchaseList
            $.ajax({
                cache : true,
                type : "POST",
                url : ctx + "dtp/pmService/getDrugPurchaseList",
                data : data,
                async : false,
                error : function(request) {
                    $.modal.alertError("系统错误");
                },
                success : function(data) {
                    data2=data.rows;
                    $.operate.successCallback(data);
                }
            });

                var options = {
                    data: data2,
                    columns: [
                            {field: 'salesOrderNumber', title: '销售'},
                            {field: 'prescriptionNumber', title: '处方编号'},
                            {field: 'prescriptionDate', title: '处方日期'},
                            {field: 'hospital', title: '医院'},
                            {field: 'prescribingDoctor', title: '处方医生'},
                            {field: 'department', title: '科室'},
                            {field: 'attendingDoctor', title: '主管医生'},  // 注意这里使用的是 "attendingDoctor" 而不是 "attendingPhysician"
                            {field: 'clinicalDiagnosis', title: '临床诊断'},
                            {field: 'genericName', title: '药品通用名'},
                            {field: 'productName', title: '商品名'},
                            {field: 'medicationRoute', title: '用药途径'},
                            {field: 'dosageFrequency', title: '用药频次'},
                            {field: 'singleDoseUnit', title: '单次剂量'},
                            {field: 'registrant', title: '登记人'},
                            {field: 'registrationDate', title: '登记日期'},
                            {field: 'saleDate', title: '销售日期'},
                            {field: 'pharmacyName', title: '购药门店名称'}
                        ]

            };
            tableElement.bootstrapTable(options);
        }
        if(tabId==='tab-3'){
            var tableElement4 = $('#bootstrap-table-4');
            var data4=[];
            var data5=[];
            // 初始化表格 getDrugPurchaseList
            $.ajax({
                cache : true,
                type : "POST",
                url : ctx + "dtp/pmService/getDrugPurchaseList",
                data : data,
                async : false,
                error : function(request) {
                    $.modal.alertError("系统错误");
                },
                success : function(data) {
                    data4=data.rows;
                    data5=data.rows;
                    $.operate.successCallback(data);
                }
            });



           var options ={
                // 配置表格的相关属性
                // 例如数据源、列定义等
                // 示例配置
                data: data4,
                fitColumns: true,
                striped: true,
                autoRowHeight: true,
                rowNumbers: true,
                showFooter:true,  //是否显示表格底部区域。
                clickToSelect: true, //是否启用点击行时选中整行的功能。
                singleSelect: false, //是否仅允许选择一行
                fixedColumns: true,
                //fixedNumber: 3,
                fixedRightNumber: 1,
                columns : [
                        { field: 'id', title: '序号' },
                        { field: 'followUpPersonName', title: '任务名称' },
                        { field: 'disease', title: '任务类型'},
                        { field: 'filingDate', title: '预约时间' },
                        { field: 'lastPurchaseDate', title: '完成时间' },
                        { field: 'patientName', title: '任务跟进人' },
                        { field: 'patientAssignmentStatus', title: '任务状态' },
                        {
                            title: '操作',
                            align: 'center',
                            width: '180px',
                            formatter: function(value, row, index) {
                                if (row.id) {
                                    var actions = [];
                                    actions.push('<a class="btn-xs" href="javascript:void(0)" onclick="edit(\'' + row.id + '\')">查看</a> ');
                                    actions.push('<a class="btn-xs" href="javascript:void(0)" onclick="edit(\'' + row.id + '\')">关闭任务</a> ');
                                    return actions.join('');
                                } else {
                                    return "";
                                }
                            }
                        }
                ]
            };
            tableElement4.bootstrapTable(options);

           var tableElement5 = $('#bootstrap-table-5');
                   var options ={
                        // 配置表格的相关属性
                        // 例如数据源、列定义等
                        // 示例配置
                        data: data5,
                        fitColumns: true,
                        striped: true,
                        autoRowHeight: true,
                        rowNumbers: true,
                        showFooter:true,  //是否显示表格底部区域。
                        clickToSelect: true, //是否启用点击行时选中整行的功能。
                        singleSelect: false, //是否仅允许选择一行
                        fixedColumns: true,
                        //fixedNumber: 3,
                        fixedRightNumber: 1,
                        columns : [
                                { field: 'id', title: '序号' },
                                { field: 'followUpPersonName', title: '任务名称' },
                                { field: 'disease', title: '任务类型'},
                                { field: 'filingDate', title: '预约时间' },
                                { field: 'lastPurchaseDate', title: '完成时间' },
                                { field: 'patientName', title: '任务跟进人' },
                                { field: 'patientAssignmentStatus', title: '任务状态' },
                                {
                                    title: '操作',
                                    align: 'center',
                                    width: '180px',
                                    formatter: function(value, row, index) {
                                        if (row.id) {
                                            var actions = [];
                                            actions.push('<a class="btn-xs" href="javascript:void(0)" onclick="edit(\'' + row.id + '\')">查看</a> ');
                                            actions.push('<a class="btn-xs" href="javascript:void(0)" onclick="edit(\'' + row.id + '\')">关闭任务</a> ');
                                            return actions.join('');
                                        } else {
                                            return "";
                                        }
                                    }
                                }
                            ]
                    };
                   tableElement5.bootstrapTable(options);
             }
    }

    function editArchives(){
        var id = $("#id").val();
       // table.set();
        var prefix = ctx + "dtp/pmService/archivesEdit/{id}";
        $.modal.openTab("修改档案", prefix.replace("{id}", id));
    }
</script>
