manyi/static/admaster/tpl/adManage.html

<div class="bg-light lter b-b wrapper-md">
    <h1 class="m-n font-thin h4">投放广告</h1>
</div>
<div class="wrapper-md" ng-controller="adManageCtrl">
    <style>
        .condition-row{
            background: #eee;
            margin: 10px -5px !important;
            border: 1px solid #ccc;
            padding: 5px !important;
        }
    </style>
    <div class="panel panel-default">

        <div class="row wrapper">
            <div class="col-sm-4">
                <div>
                    <div class="btn btn-default" ng-click="addAd()"><i class="fa fa-plus-circle"></i> 新增</div>
                    <div class="btn btn-default" ng-click="editAd()"><i class="fa fa-edit "></i> 修改</div>
                    <div class="btn btn-default" ng-click="deleteAd()"><i class="fa fa-trash-o"></i> 删除</div>
                </div>
            </div>

            <div class="col-sm-2">
            </div>

            <div class="col-sm-6">
                <div class="col-sm-6 text-right">
                    <div class="btn-group dropdown" dropdown>
                        <button class="btn  btn-default dropdown-toggle" dropdown-toggle>
                            <span class="dropdown-label">{{condition.online.label}}</span>
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu">
                            <li ng-repeat="item in enum.online" ng-click="event.conditionChange('online',item)">
                                <a href ng-bind="item.label"></a></li>
                        </ul>
                    </div>

                    <div class="btn-group dropdown" dropdown>
                        <button class="btn  btn-default dropdown-toggle" dropdown-toggle>
                            <span class="dropdown-label">{{condition.adType.label}}</span>
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu">
                            <li ng-repeat="item in enum.adType" ng-click="event.conditionChange('adType',item)">
                                <a href ng-bind="item.label"></a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="btn-group input-group">
                        <input type="text" class=" form-control" ng-model="condition.searchKey"
                               ng-keydown="$event.keyCode==13&&event.search()"
                               placeholder="名称、广告词等">
                    <span class="input-group-btn">
                         <div class="btn  btn-default" ng-click="event.search()"><i class="fa fa-search"></i> 搜索</div>
                    </span>
                    </div>
                </div>

            </div>
        </div>

        <div class="table-responsive">
            <div ui-grid="gridOptions" style="min-height:420px" ui-grid-pagination ui-grid-selection ui-grid-expandable
                 ui-grid-resize-columns></div>
            <div class="grid-mask" ng-if="gridOptionsLoading"><span>正在加载，请稍候...</span></div>
        </div>
    </div>

    <!--禁止enter提交-->
    <form name="adForm" id="adPanel" class="form-horizontal form-validation modal fade" role="dialog"
          onkeydown="if(event.keyCode==13){return false;}"
          style=" width: 1280px;height: 80%">
        <div class="panel panel-default">
            <div class="panel-heading">
                <strong ng-bind="dialogName"></strong>
            </div>

            <div class="panel-body no-animate">
                <accordion close-others="false">
                    <accordion-group is-open="dialogStatus.openbase">
                        <accordion-heading>
                            基本配置<i class="pull-right fa fa-angle-right"
                                   ng-class="{'fa-angle-down': dialogStatus.openbase, 'fa-angle-right': !dialogStatus.openbase}"></i>
                        </accordion-heading>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">是否开启</label>

                            <div class="col-sm-3">
                                <div class="checkbox">
                                    <label class="i-checks">
                                        <input type="checkbox" ng-model="dialogData.online">
                                        <i></i>
                                    </label>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">名称<i class="text-danger text-base"> *</i></label>
                            <div class="col-sm-4">
                                <input type="text" ng-model="dialogData.name" class="form-control" placeholder="名称"
                                       required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">广告场景<i class="text-danger text-base"> *</i></label>
                            <div class="col-sm-9">
                                <div class="radio pull-left">
                                    <label class="i-checks">
                                        <input type="radio" name="adType" value="init" required
                                               ng-model="dialogData.adType">
                                        <i></i>
                                        主页广告
                                    </label>
                                </div>

                                <!--<div class="radio pull-left m-l">-->
                                    <!--<label class="i-checks">-->
                                        <!--<input type="radio" name="adType" value="payAfter" required-->
                                               <!--ng-model="dialogData.adType">-->
                                        <!--<i></i>-->
                                        <!--投币后-->
                                    <!--</label>-->
                                <!--</div>-->
                            </div>
                        </div>

                        <div ng-if="dialogData.adType=='init'">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">自动下线</label>

                                <div class="col-sm-2">
                                    <input type="number" min="0" ng-model="dialogData.offlineFansNumber"
                                           class="form-control"
                                           placeholder="0"
                                           required>
                                </div>
                                <div class="col-sm-7 m-t-xs ">
                                    <span class="">吸粉达到指定数目下线，输入0则不下线</span>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-3 control-label">吸粉号类型<i class="text-danger text-base">
                                    *</i></label>
                                <div class="col-sm-9">
                                    <div class="radio pull-left">
                                        <label class="i-checks">
                                            <input type="radio" name="fansType" value="person" required
                                                   ng-model="dialogData.fansType">
                                            <i></i>
                                            个人号
                                        </label>
                                    </div>

                                    <div class="radio pull-left m-l">
                                        <label class="i-checks">
                                            <input type="radio" name="fansType" value="official" required
                                                   ng-model="dialogData.fansType">
                                            <i></i>
                                            公众号
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div ng-if="dialogData.adType=='payAfter'&&(!dialogData.scriptType)">
                            <div class="line line-dashed b-b line-lg pull-in"></div>

                            <div class="form-group">
                                <label class="col-sm-3 control-label">跳转行为<i class="text-danger text-base">
                                    *</i></label>
                                <div class="col-sm-9">
                                    <div class="radio pull-left">
                                        <label class="i-checks">
                                            <input type="radio" name="autoRedirect" ng-value="false" required
                                                   ng-model="dialogData.configs.autoRedirect">
                                            <i></i>
                                            点击跳转
                                        </label>
                                    </div>

                                    <div class="radio pull-left m-l">
                                        <label class="i-checks">
                                            <input type="radio" name="autoRedirect" ng-value="true" required
                                                   ng-model="dialogData.configs.autoRedirect">
                                            <i></i>
                                            自动跳转
                                        </label>
                                    </div>

                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-3 control-label">广告链接<i class="text-danger text-base"> *</i></label>
                                <div class="col-sm-9">
                                    <input type="url" ng-model="dialogData.link" class="form-control"
                                           placeholder="http://www.baidu.com" required>
                                </div>
                            </div>
                        </div>

                        <div ng-if="dialogData.adType=='payAfter'">
                            <div class="line line-dashed b-b line-lg pull-in"></div>

                            <div class="form-group">
                                <label class="col-sm-3 control-label">广告脚本</label>
                                <div class="col-sm-9">

                                    <div class="radio pull-left ">
                                        <label class="i-checks">
                                            <input type="radio" name="fansType" value="remote"
                                                   ng-model="dialogData.scriptType">
                                            <i></i>
                                            远程脚本路径
                                        </label>
                                    </div>

                                    <div class="radio pull-left m-l">
                                        <label class="i-checks">
                                            <input type="radio" name="fansType" value="inline"
                                                   ng-model="dialogData.scriptType">
                                            <i></i>
                                            代码文本
                                        </label>
                                    </div>

                                    <div class="radio pull-left m-l">
                                        <label class="i-checks">
                                            <input type="radio" name="fansType" value=""
                                                   ng-model="dialogData.scriptType">
                                            <i></i>
                                            无
                                        </label>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group" ng-if="dialogData.scriptType=='remote'">
                                <label class="col-sm-3 control-label">脚本代码</label>
                                <div class="col-sm-9">
                                    <input type="url" ng-model="dialogData.script" class="form-control"
                                           placeholder="">
                                </div>
                            </div>

                            <div class="form-group" ng-if="dialogData.scriptType=='inline'">
                                <label class="col-sm-3 control-label">脚本代码</label>
                                <div class="col-sm-9">
                                       <textarea ng-model="dialogData.script" style="height: 100px;"
                                                 class="form-control" placeholder="代码"></textarea>
                                </div>
                            </div>
                        </div>

                        <div class="line line-dashed b-b line-lg pull-in"></div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">广告词<i ng-if="dialogData.adType=='init'"
                                                                        class="text-danger text-base"> *</i></label>
                            <div class="col-sm-4">
                                <input type="text" ng-model="dialogData.word" class="form-control" name="word"
                                       placeholder="广告词"
                                       ng-required="dialogData.adType=='init'">
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">图片|素材</label>
                            <div class="col-sm-5">
                                <!---文件选择-->
                                <input type="file" nv-file-select="" id="fileUpload" uploader="uploader"/>
                                <input type="hidden" name="img" id="fileUploadValue" title="图片路径隐藏域"
                                       class="form-control hide-required-img-input img-input"
                                       ng-model="dialogData.img"/>

                                <!---上传进度-->
                                <div class="progress bg-light dker" style="margin-top: 10px;margin-bottom: 10px">
                                    <div class="progress-bar progress-bar-striped bg-info" role="progressbar"
                                         ng-style="{ 'width': uploader.progress + '%' }"></div>
                                </div>
                                <!---上传按钮-->
                                <button type="button" class="btn btn-addon btn-success" ng-click="uploader.uploadAll()"
                                        ng-disabled="!uploader.getNotUploadedItems().length">
                                    <i class="fa fa-arrow-circle-o-up"></i> 上传图片
                                </button>
                            </div>
                            <div class="col-sm-4">
                                <!---图片预览-->
                                <img id="previewImg"
                                     ng-src="{{dialogData.img+(dialogData.img?('?t='+dialogData._nowTime):'')}}"
                                     style="max-height: 160px;max-width: 100%">
                            </div>
                        </div>
                    </accordion-group>


                    <accordion-group is-open="dialogStatus.opentarget" ng-click="ngEvent.openDeviceTarget()">
                        <accordion-heading>
                            投放目标<i class="pull-right fa fa-angle-right"
                                   ng-class="{'fa-angle-down': dialogStatus.opentarget, 'fa-angle-right': !dialogStatus.opentarget}"></i>
                        </accordion-heading>

                        <div style="min-height: 600px">

                            <div class="form-group m-b-xs ">
                                <label class="col-sm-4 control-label text-left padding-t-0">地址类型</label>
                            </div>
                            <div class="form-group form-inline ">
                                <div class="col-sm-12">
                                    <div class="checkbox m-l m-r-xs"
                                         ng-repeat="item in dialogData.selectAddressType">
                                        <label class="i-checks">
                                            <input type="checkbox"
                                                   ng-true-value="true"
                                                   ng-false-value="false" ng-model="item.checked"><i></i>
                                            {{item.label}}
                                        </label>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group m-b-xs ">
                                <label class="col-sm-4 control-label text-left padding-t-0">设备类型</label>
                            </div>
                            <div class="form-group form-inline ">
                                <div class="col-sm-12">
                                    <div class="checkbox m-l m-r-xs"
                                         ng-repeat="item in dialogData.selectDevType">
                                        <label class="i-checks">
                                            <input type="checkbox"
                                                   ng-true-value="true"
                                                   ng-false-value="false" ng-model="item.checked"><i></i>
                                            {{item.name}}
                                        </label>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group m-b-xs col-sm-12">
                                <button type="button" class="btn btn-info" ng-click="ngEvent.findDevList()">查询
                                </button>
                            </div>
                            <div class="line line-dashed b-b line-lg pull-in"></div>

                            <div class="form-group m-b-xs ">
                                <div class="checkbox m-l m-r-xs">
                                    <label class="i-checks">
                                        <input type="checkbox" ng-change="ngEvent.selectAllDevice()"
                                               ng-true-value="true"
                                               ng-false-value="false"
                                               ng-model="dialogData.selectAllDeviceChecked"><i></i>
                                        全选
                                    </label>
                                    <label class=" control-label text-left padding-t-0">目标设备（将投放广告给这些选中设备）</label>
                                </div>

                            </div>
                            <div class="form-group ">
                                <div class="table-responsive">
                                    <div ui-grid="deviceGridOptions" ui-grid-pagination
                                         ui-grid-resize-columns></div>
                                </div>
                            </div>

                            <div class="line line-dashed b-b line-lg pull-in"></div>

                            <div class="form-group m-b-xs ">
                                <label class="col-sm-4 control-label text-left ">目标人群性别</label>
                            </div>
                            <div class="form-group">
                                <div class="col-sm-4">
                                    <select class="form-control" ng-model="dialogData.targetSex">
                                        <option value="*">*</option>
                                        <option value="男">男</option>
                                        <option value="女">女</option>
                                    </select>
                                </div>
                            </div>

                            <div class="form-group m-b-xs ">
                                <label class="col-sm-4 control-label text-left ">手机系统</label>
                            </div>
                            <div class="form-group form-inline">
                                <div class="col-sm-12">
                                    <div class="checkbox m-l m-r-xs"
                                         ng-repeat="item in dialogData.selectPhoneOS">
                                        <label class="i-checks">
                                            <input type="checkbox" value="item.name"
                                                   ng-true-value="true"
                                                   ng-false-value="false" ng-model="item.checked"><i></i>
                                            {{item.name}}
                                        </label>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group m-b-xs ">
                                <label class="col-sm-4 control-label text-left ">网关</label>
                            </div>
                            <div class="form-group form-inline">
                                <div class="col-sm-12">
                                    <div class="checkbox m-l m-r-xs"
                                         ng-repeat="item in dialogData.selectGateway">
                                        <label class="i-checks">
                                            <input type="checkbox" value="item.name"
                                                   ng-true-value="true"
                                                   ng-false-value="false" ng-model="item.checked"><i></i>
                                            {{item.name}}
                                        </label>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </accordion-group>

                    <accordion-group is-open="dialogStatus.openptime">
                        <accordion-heading>
                            投放时间<i class="pull-right fa fa-angle-right"
                                   ng-class="{'fa-angle-down': dialogStatus.openptime, 'fa-angle-right': !dialogStatus.openptime}"></i>
                        </accordion-heading>

                        <div style="min-height: 400px">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">开始时间</label>
                                <div class="col-sm-4">
                                    <div class="dropdown" dropdown is-open="startTimeOpen">
                                        <a class="dropdown-toggle" data-target="#" href="">
                                            <div class="input-group" dropdown-toggle>
                                                <input type="text" class="form-control" onkeydown="return false"
                                                       name="startTime"
                                                       ui-validate="'$value==null||$value&&$value<dialogData.endTime'"
                                                       ui-validate-watch=" 'dialogData.endTime'"
                                                       ng-model="dialogData.startTime"
                                                       placeholder="请选择开始时间">
                                    <span class="input-group-addon"><i
                                            class="glyphicon glyphicon-calendar"></i></span>
                                            </div>
                                        </a>
                            <span ng-show="adForm.startTime.$invalid"
                                  class="text-danger">开始时间必须小于结束时间!</span>
                                        <ul class="dropdown-menu" dropdown-menu>
                                            <datetimepicker on-set-time="timeChange()" class="max"
                                                            data-datetimepicker-config="{modelType: 'YYYY-MM-DD HH:mm'}"
                                                            data-ng-model="dialogData.startTime"></datetimepicker>
                                        </ul>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-3 control-label">结束时间</label>
                                <div class="col-sm-4">
                                    <div class="dropdown" dropdown is-open="endTimeOpen">
                                        <a class="dropdown-toggle" data-target="#" href="">
                                            <div class="input-group" dropdown-toggle>

                                                <input type="text" class="form-control" onkeydown="return false"
                                                       name="endTime"
                                                       ui-validate="'$value==null||$value&&$value>dialogData.startTime'"
                                                       ui-validate-watch=" 'dialogData.startTime'"
                                                       ng-model="dialogData.endTime"
                                                       placeholder="请选择结束时间">
                                    <span class="input-group-addon"><i
                                            class="glyphicon glyphicon-calendar"></i></span>
                                            </div>
                                        </a>
                            <span ng-show="adForm.endTime.$invalid"
                                  class="text-danger">开始时间必须小于结束时间!</span>
                                        <ul class="dropdown-menu" dropdown-menu>
                                            <datetimepicker on-set-time="timeChange()" class="max"
                                                            data-datetimepicker-config="{modelType: 'YYYY-MM-DD HH:mm'}"
                                                            data-ng-model="dialogData.endTime"></datetimepicker>
                                        </ul>
                                    </div>

                                </div>

                                <div class="col-sm-4">
                                    <div class="btn-group dropdown" dropdown>
                                        <input type="button" class="dropdown-toggle form-control  v-middle" value="快速选择"
                                               dropdown-toggle>

                                        <ul class="dropdown-menu" id="adTimeRange">
                                            <li ng-click="modelEvent.adQuickTime($event,3)"><a href>未来3天</a></li>
                                            <li ng-click="modelEvent.adQuickTime($event,30)"><a href>未来30天</a></li>
                                            <li ng-click="modelEvent.adQuickTime($event,90)"><a href>未来90天</a></li>
                                            <li ng-click="modelEvent.adQuickTime($event,180)"><a href>未来180天</a></li>
                                            <li ng-click="modelEvent.adQuickTime($event,365)"><a href>未来1年</a></li>
                                            <li ng-click="modelEvent.adQuickTime($event,365*3)"><a href>未来3年</a></li>
                                            <li ng-click="modelEvent.adQuickTime($event,365*10)"><a href>未来10年</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </accordion-group>


                </accordion>
            </div>
            <footer class="panel-footer text-right bg-light lter">
                <button type="submit" class="btn btn-success" ng-click="saveData()">保存
                </button>
            </footer>
        </div>
    </form>

    <div id="copyLinkPanel" class="form-horizontal form-validation modal fade" role="dialog"
         style="width: 480px;min-height: 180px;height: 180px">
        <div class="panel panel-default">
            <div class="panel-heading text-center">
                <strong>复制链接</strong>
            </div>

            <div class="panel-body">
                <div class="form-group">
                    <div class="col-sm-12">
                        <input type="text" ng-model="copyLinkData.link" class="form-control" placeholder=""
                               id="copyLinkInput"
                               required>
                    </div>
                </div>

            </div>
            <footer class="panel-footer text-center bg-light lter">
                <button id="copyLinkBtn" data-clipboard-target="#copyLinkInput" type="submit" class="btn btn-info"
                >复制
                </button>
            </footer>
        </div>
    </div>

    <div id="chartInfoPanel" class="form-horizontal form-validation modal fade" role="dialog"
         style="height:80%;width: 80%;">
        <div class="panel panel-default">

            <div class="nav-tabs-alt panel-heading">
                <ul class="nav nav-tabs ">
                    <li ng-class="{active:adFansDetailShow=='chart'}">
                        <a ng-click="modelEvent.adFansDetailShow('chart')"><i class="fa fa-bar-chart-o"></i> 查看统计图</a>
                    </li>
                    <li ng-class="{active:adFansDetailShow=='grid'}">
                        <a ng-click="modelEvent.adFansDetailShow('grid')"><i class="fa fa-list"></i> 查看列表</a>
                    </li>
                </ul>
            </div>

            <div class="panel-heading" style="height: auto">
                <div class="m-l-xs  btn-group dropdown" dropdown is-open="modelEvent.startTimeOpen">
                    <input type="text" class="form-control  w-xs" dropdown-toggle
                           ng-model="chartCondition.startTime"
                           placeholder="开始日期">
                    <ul class="dropdown-menu" dropdown-menu>
                        <datetimepicker
                                data-datetimepicker-config="{modelType: 'YYYY-MM-DD',startView:'day',minView:'day'}"
                                on-set-time="modelEvent.timeChange()"
                                data-ng-model="chartCondition.startTime"></datetimepicker>
                    </ul>
                </div>
                <span class="v-middle">至</span>
                <div class="btn-group  dropdown" dropdown is-open="modelEvent.endTimeOpen">
                    <input type="text" class=" form-control  w-xs" dropdown-toggle
                           ng-model="chartCondition.endTime"
                           placeholder="结束日期">
                    <ul class="dropdown-menu" dropdown-menu>
                        <datetimepicker
                                data-datetimepicker-config="{modelType: 'YYYY-MM-DD',startView:'day',minView:'day'}"
                                on-set-time="modelEvent.timeChange()"
                                data-ng-model="chartCondition.endTime"></datetimepicker>
                    </ul>
                </div>

                <div class="btn-group dropdown" dropdown>
                    <input type="button" class="dropdown-toggle form-control  v-middle" value="快捷日期"
                           dropdown-toggle>

                    <ul class="dropdown-menu" id="timeRange">
                        <li ng-click="modelEvent.quickTime($event,1)"><a href>今天</a></li>
                        <li ng-click="modelEvent.quickTime($event,7)"><a href>过去7天</a></li>
                        <li ng-click="modelEvent.quickTime($event,15)"><a href>过去15天</a></li>
                        <li ng-click="modelEvent.quickTime($event,30)"><a href>最近30天</a></li>
                        <li ng-click="modelEvent.quickTime($event,60)"><a href>最近60天</a></li>
                        <li ng-click="modelEvent.quickTime($event,90)"><a href>最近90天</a></li>
                    </ul>
                </div>

                <div class="btn btn-default   btn-info" ng-click="modelEvent.searchDetail()"><i
                        class="fa fa-search"></i> 查询
                </div>

                <!--<div class=" inline" ng-show="adFansDetailShow=='grid'">-->
                    <!--<div ng-disabled="ngEvent.exportExcelOpen" class="btn btn-default  btn-success"-->
                         <!--ng-click="ngEvent.exportExcel()"><i class="fa fa-file-excel-o"></i>-->
                        <!--生成报表-->
                    <!--</div>-->
                <!--</div>-->

            </div>

            <div class="panel-body">
                <div id="adChartPanel" style="height: 100%" ng-show="adFansDetailShow=='chart'"></div>

                <div class="table-responsive" style="height: 100%" ng-show="adFansDetailShow=='grid'">
                    <div ui-grid="adFansDetailGridOptions" style="min-height:96%" ui-grid-pagination
                         ui-grid-resize-columns></div>
                </div>
            </div>

            <footer class="panel-footer text-center bg-light lter">
                <button type="button" class="btn btn-info margin-5" ng-click="closeChart()"
                        style="margin-left: 8px"><i
                        class="fa fa-close"></i> 关闭
                </button>
            </footer>
        </div>
    </div>


    <div id="QRCodePanel" class="form-horizontal form-validation modal fade" role="dialog"
         style=" width: 360px;min-height: 388px;height: 388px">
        <div class="panel panel-default">
            <div class="panel-heading text-center">
                <strong ng-if="!currentWxIsLogin">扫码登录</strong>
                <strong ng-if="currentWxIsLogin" class="text-success">{{currentWxUserName}}已登录</strong>
            </div>

            <div class="panel-body">
                <div class="form-group text-center">
                    <img id="qrCodePreviewImg"
                         style="z-index: 9;position:relative;box-shadow: 0 0 4px #ccc;background: #fff"
                         width="200"
                         height="230"/></div>

                <div class="text-center">
                    <a href="javascript:void(0)" ng-if="currentWxTimeout" ng-click="refreshQRCode()"
                       class="text-danger">已超时，点此处刷新二维码</a>
                </div>
            </div>

            <footer class="panel-footer text-center bg-light lter">
                <button type="button" class="btn btn-info margin-5" ng-click="closeQRCode()" style="margin-left: 8px"><i
                        class="fa fa-close"></i> 关闭
                </button>
            </footer>
        </div>
    </div>
</div>