|
@@ -0,0 +1,611 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div class="topbar">
|
|
|
+ <div class="topbar_left">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-fanhui"></use>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+ <div class="topbar_middle">
|
|
|
+ 审批
|
|
|
+ </div>
|
|
|
+ <div class="topbar_right">
|
|
|
+ <!-- <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-caidan"></use>
|
|
|
+ </svg> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="oaview_toparea" :class="colortop">
|
|
|
+ <div class="oaview_top_type" v-if="tasktype==0">单据审批</div>
|
|
|
+ <div class="oaview_top_type" v-if="tasktype==1">公文审批</div>
|
|
|
+ <div class="oaview_top_flag">{{taskflag_dt}}</div>
|
|
|
+ </div>
|
|
|
+ <div class="oaview_toparea_sec" :class="colortop_sec"></div>
|
|
|
+ <div class="oaview_toparea_thr" :class="colortop_thr"></div>
|
|
|
+
|
|
|
+ <div class="oaview">
|
|
|
+
|
|
|
+ <div class="oaview_main">
|
|
|
+ <div class="oaview_info" v-if="tasktype==1">
|
|
|
+ <span>年假申请,2019年9月1日至2019年9月7日,望审批。</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 客户订单信息 -->
|
|
|
+ <div v-if="tasktype==0" style="margin:10px 0 0 0 ">
|
|
|
+
|
|
|
+ <!-- <div class="liubai_dt"></div> -->
|
|
|
+ <div class="oaview_flex">
|
|
|
+ <div class="oaview_title">单号</div>
|
|
|
+ <div class="oaview_item">SC190812002</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="oaview_flex">
|
|
|
+ <div class="oaview_title">类型</div>
|
|
|
+ <div class="oaview_item">销售订单</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="oaview_flex">
|
|
|
+ <div class="oaview_title">客户</div>
|
|
|
+ <div class="oaview_item">红岸家私城</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="oaview_flex">
|
|
|
+ <div class="oaview_title">业务员</div>
|
|
|
+ <div class="oaview_item">章北海</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="oaview_flex">
|
|
|
+ <div class="oaview_title">金额</div>
|
|
|
+ <div class="oaview_item">200,000元</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="oaview_flex">
|
|
|
+ <div class="oaview_title">交期</div>
|
|
|
+ <div class="oaview_item">2019年8月30日</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div style="color:#666;margin:10px 0 0 20px">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-chakan"></use>
|
|
|
+ </svg>
|
|
|
+ 查看单据详细信息
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="liubai_dt"></div>
|
|
|
+
|
|
|
+ <div class="oaview_emp">
|
|
|
+ <div class="oaview_emp_list">
|
|
|
+ <div class="oaview_emp_list_icon">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-CombinedShape"></use>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div>
|
|
|
+ 发起:黎小娟
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="oaview_emp_list_time">
|
|
|
+ 2019-08-12 09:23
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="oaview_emp_list">
|
|
|
+ <div class="oaview_emp_list_icon">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-CombinedShape"></use>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div>
|
|
|
+ 主管审:黎小娟
|
|
|
+ </div>
|
|
|
+ <div class="oaview_emp_list_time">
|
|
|
+ 2019-08-12 10:12
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="oaview_emp_list">
|
|
|
+ <div class="oaview_emp_list_icon">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-buzouweijinxing"></use>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div>
|
|
|
+ 财务审:王小千
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="quote_edit_btn_wrap">
|
|
|
+ <div class="quote_edit_btn">
|
|
|
+ <span>同意</span>
|
|
|
+ <span>否决</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 完成任务、验收任务弹出界面 -->
|
|
|
+ <div v-if="ifresponse>0">
|
|
|
+ <div class="oaview_mask"></div>
|
|
|
+
|
|
|
+ <div :class="response_height" class="oaview_response">
|
|
|
+ <div style="display:flex;align-items: center;">
|
|
|
+ <div style="font-size:15px;padding:0 20px;color:#888">
|
|
|
+ <span v-if="ifresponse==2">任务验收</span>
|
|
|
+ <span v-if="ifresponse==1">完成任务</span>
|
|
|
+ </div>
|
|
|
+ <div style="position: absolute;right: 20px;color: #ccc;font-size: 12px;">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-guanbi"></use>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 评价星级 -->
|
|
|
+ <div class="oaview_flex" style="margin-top:15px;" v-if="ifresponse==2">
|
|
|
+ <div class="oaview_title">评分</div>
|
|
|
+ <div class="oaview_item" style="font-size:22px;">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-xing1"></use>
|
|
|
+ </svg>
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-xing1"></use>
|
|
|
+ </svg>
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-xing1"></use>
|
|
|
+ </svg>
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-xing"></use>
|
|
|
+ </svg>
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-xing"></use>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 评语 或 汇报 录入 -->
|
|
|
+ <div style="width: 100%;text-align: center;">
|
|
|
+ <textarea name="banreason" rows="5" placeholder="请填写评语" style="width: 90%;font-size: 15px;margin: 10px;"
|
|
|
+ v-if="ifresponse==2">
|
|
|
+ </textarea>
|
|
|
+
|
|
|
+ <textarea name="banreason" rows="5" placeholder="请填写任务汇报" style="width: 90%;font-size: 15px;margin: 10px;"
|
|
|
+ v-if="ifresponse==1">
|
|
|
+ </textarea>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 添加图片 -->
|
|
|
+ <div style="display:flex" v-if="ifresponse==1">
|
|
|
+ <div class="oaview_addpic">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-tianjiatupian"></use>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 完成任务时添加附件 -->
|
|
|
+ <div v-if="ifresponse==1" class="taskedit_fjarea" style="padding:0 0 0 20px;color:#666">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-fujian"></use>
|
|
|
+ </svg>
|
|
|
+ 添加附件
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 验收任务时选择是否需要返工 -->
|
|
|
+ <div v-if="ifresponse==2"
|
|
|
+ style="display:flex;line-height: 45px;align-items: flex-start;margin:0 0 0 20px;color:#888">
|
|
|
+ <div class="taskedit_title">需要返工</div>
|
|
|
+ <div style="margin-left:10px;font-size:40px">
|
|
|
+ <svg class="icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-uni_icon_kaiguan_guan"></use>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 提交按钮 -->
|
|
|
+ <div class="quote_edit_btn_wrap">
|
|
|
+ <div class="quote_edit_btn">
|
|
|
+ <span v-if="ifresponse==2">验收</span>
|
|
|
+ <span v-if="ifresponse==1">完成</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ name: 'oaview',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tasktype: 0, //0-单据审批 1-公文审批
|
|
|
+ taskflag_dt: "处理中", //处理中,通过,否决
|
|
|
+ ifresponse: 0, //弹窗 0:不弹 1:完成任务界面 2:验收任务界面
|
|
|
+ iffg: 0 //0-不是返工 1-返工
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ colortop: function () {
|
|
|
+ return {
|
|
|
+ oaview_toparea_green: this.taskflag_dt == "处理中",
|
|
|
+ oaview_toparea_blue: this.taskflag_dt == "通过"
|
|
|
+ };
|
|
|
+ },
|
|
|
+ colortop_sec: function () {
|
|
|
+ return {
|
|
|
+ oaview_toparea_green_sec: this.taskflag_dt == "处理中",
|
|
|
+ oaview_toparea_blue_sec: this.taskflag_dt == "通过"
|
|
|
+ };
|
|
|
+ },
|
|
|
+ colortop_thr: function () {
|
|
|
+ return {
|
|
|
+ oaview_toparea_green_thr: this.taskflag_dt == "处理中",
|
|
|
+ oaview_toparea_blue_thr: this.taskflag_dt == "通过"
|
|
|
+ };
|
|
|
+ },
|
|
|
+ response_height: function () {
|
|
|
+ return {
|
|
|
+ response_height_1: this.ifresponse == 1,
|
|
|
+ response_height_2: this.ifresponse == 2
|
|
|
+ };
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+ body {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ background-color: #fff;
|
|
|
+ font-family: "微软雅黑";
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_emp {
|
|
|
+ padding: 0px 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_emp_list {
|
|
|
+ display: flex;
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_emp_list_icon {
|
|
|
+ color: #000;
|
|
|
+ margin: 0 10px 0 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_emp_list_time {
|
|
|
+ color: #888;
|
|
|
+ margin: 0 0 0 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_iffg {
|
|
|
+ background-color: #fdd1cd;
|
|
|
+ color: #ff6f61;
|
|
|
+ font-size: 12px;
|
|
|
+ margin: 0 4px 0 0;
|
|
|
+ padding: 3px 8px;
|
|
|
+ border-radius: 15px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .response_height_1 {
|
|
|
+ height: 330px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .response_height_2 {
|
|
|
+ height: 270px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_mask {
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ background-color: #1d1d1d;
|
|
|
+ opacity: 0.8;
|
|
|
+ position: fixed;
|
|
|
+ top: 0px;
|
|
|
+ z-index: 9998;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_response {
|
|
|
+ z-index: 9999;
|
|
|
+ background-color: #ffffff;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0px;
|
|
|
+ /* height: 330px; */
|
|
|
+ width: 100%;
|
|
|
+ border-top-left-radius: 15px;
|
|
|
+ border-top-right-radius: 15px;
|
|
|
+ padding: 10px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .topbar {
|
|
|
+ min-height: 44px;
|
|
|
+ border-bottom: 1px solid #e5e5e5;
|
|
|
+ background: #fff;
|
|
|
+ position: fixed;
|
|
|
+ width: 100%;
|
|
|
+ z-index: 9997;
|
|
|
+ display: flex;
|
|
|
+ font-size: 18px;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .topbar_left {
|
|
|
+ flex: 0 0 20px;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .topbar_middle {
|
|
|
+ /* text-align: center; */
|
|
|
+ padding: 0 0 0 10px;
|
|
|
+ flex: 0 0 89%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .topbar_right {
|
|
|
+ flex: 0 0 20px;
|
|
|
+ position: absolute;
|
|
|
+ right: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_info {
|
|
|
+ font-size: 16px;
|
|
|
+ padding: 5px 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_toparea {
|
|
|
+ position: absolute;
|
|
|
+ top: 44px;
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ color: #fff;
|
|
|
+ background-color: #fc4e2c;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ align-items: center;
|
|
|
+ height: 35px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_toparea_green {
|
|
|
+ background-color: #8dc026;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_toparea_blue {
|
|
|
+ background-color: #46a4da;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_toparea_sec {
|
|
|
+ position: absolute;
|
|
|
+ top: 79px;
|
|
|
+ height: 5px;
|
|
|
+ background-color: #fd8e78;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_toparea_green_sec {
|
|
|
+ background-color: #bbe26e;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_toparea_blue_sec {
|
|
|
+ background-color: #90cef1;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_toparea_thr {
|
|
|
+ position: absolute;
|
|
|
+ top: 84px;
|
|
|
+ height: 5px;
|
|
|
+ background-color: #ffdbd4;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_toparea_green_thr {
|
|
|
+ background-color: #e3f8b8;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_toparea_blue_thr {
|
|
|
+ background-color: #d1edfd;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_top_type {
|
|
|
+ padding: 0 0 0 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_top_flag {
|
|
|
+ position: absolute;
|
|
|
+ right: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_top_delay {
|
|
|
+ position: absolute;
|
|
|
+ right: 80px;
|
|
|
+ font-size: 12px;
|
|
|
+ height: 24px;
|
|
|
+ line-height: 24px;
|
|
|
+ background-color: #fdd1cd;
|
|
|
+ color: #ff6f61;
|
|
|
+ width: 45px;
|
|
|
+ border-radius: 15px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_finish_delay {
|
|
|
+ margin: 0 0 0 10px;
|
|
|
+ font-size: 12px;
|
|
|
+ height: 18px;
|
|
|
+ line-height: 18px;
|
|
|
+ background-color: #fdd1cd;
|
|
|
+ color: #ff6f61;
|
|
|
+ width: 40px;
|
|
|
+ border-radius: 15px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview {
|
|
|
+ position: absolute;
|
|
|
+ top: 90px;
|
|
|
+ width: 100%;
|
|
|
+ margin-bottom: 80px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_main {
|
|
|
+ padding: 0px 0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_flex {
|
|
|
+ display: flex;
|
|
|
+ line-height: 25px;
|
|
|
+ align-items: flex-start;
|
|
|
+ padding: 0px 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .oaview_title {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ flex: 0 0 60px;
|
|
|
+ text-align: justify;
|
|
|
+ text-align-last: justify;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_check_title {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ padding: 5px 0 0 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_check_dscrp {
|
|
|
+ color: #777;
|
|
|
+ padding: 0 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_item {
|
|
|
+ /* flex: 0 0 80%; */
|
|
|
+ /* border-bottom: 1px solid #e5e5e5; */
|
|
|
+ margin: 0 0 0 10px;
|
|
|
+ color: #777
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_pzbtn {
|
|
|
+ /* position: absolute;
|
|
|
+ right: 20px; */
|
|
|
+ margin-left: 20px;
|
|
|
+ color: #ccc;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_date {
|
|
|
+ position: absolute;
|
|
|
+ right: 40px;
|
|
|
+ color: #777
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_dscrp {
|
|
|
+ padding: 10px;
|
|
|
+ line-height: 20px;
|
|
|
+ border: 1px solid #e5e5e5;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin: 5px 0 5px 10px;
|
|
|
+ height: 100px;
|
|
|
+ color: #777;
|
|
|
+ width: 100%
|
|
|
+ }
|
|
|
+
|
|
|
+ .color_sub {
|
|
|
+ color: #999
|
|
|
+ }
|
|
|
+
|
|
|
+ .quote_edit_btn_wrap {
|
|
|
+ display: flex;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ /* background-color: #fc4e2c; */
|
|
|
+ width: 100%;
|
|
|
+ z-index: 9990;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ /* padding: 5px 0 2px 0; */
|
|
|
+ box-shadow: 0 -1px 3px #f1f1f1;
|
|
|
+ }
|
|
|
+
|
|
|
+ .quote_edit_btn {
|
|
|
+ /* background-color: #ffb732; */
|
|
|
+ background-color: #fc4e2c;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ text-align: center;
|
|
|
+ padding: 8px;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_fjarea {
|
|
|
+ margin: 10px 20px;
|
|
|
+ color: #777
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_fjlist {
|
|
|
+ padding: 0px 0 0 20px;
|
|
|
+ align-items: center;
|
|
|
+ display: flex;
|
|
|
+ font-size: 14px;
|
|
|
+ height: 25px;
|
|
|
+ line-height: 25px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_fjsize {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #aaa;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_fjdel {
|
|
|
+ font-size: 15px;
|
|
|
+ color: #fc4e2c;
|
|
|
+ position: absolute;
|
|
|
+ right: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .oaview_addpic {
|
|
|
+ margin: 0 0 20px 15px;
|
|
|
+ background-color: #f6f6f6;
|
|
|
+ color: #bbb;
|
|
|
+ height: 100px;
|
|
|
+ flex: 0 0 100px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 100px;
|
|
|
+ font-size: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .liubai_dt {
|
|
|
+ width: 100%;
|
|
|
+ height: 10px;
|
|
|
+ background-color: #f6f6f6;
|
|
|
+ margin: 10px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+</style>
|