修改布局细节问题

jero-web/src/assets/less/common.less

@@ -1,23 +1,27 @@
-
 /*列表上方操作按钮区域*/
 .ant-card-body .table-operator {
   margin-bottom: 18px;
   text-align: right;
 }
-.operator-text{
-   cursor: pointer;
-   margin-right: 50px;
-   font-size: 14px;
-   font-weight: 500;
-   display: inline-block;
+
+.operator-text {
+  cursor: pointer;
+  margin-right: 53px;
+  font-size: 14px;
+  font-weight: 400;
+  color: #040B29;
+  display: inline-block;
 }
-.operator-text:last-child{
+
+.operator-text:last-child {
   margin-right: 16px;
 }
+
 /** Button按钮间距 */
 .table-operator .ant-btn {
   margin: 0 8px 8px 0;
 }
+
 .table-operator .ant-btn-group .ant-btn {
   margin: 0;
 }
@@ -25,6 +29,7 @@
 .table-operator .ant-btn-group .ant-btn:last-child {
   margin: 0 8px 8px 0;
 }
+
 /*列表td的padding设置 可以控制列表大小*/
 .ant-table-tbody .ant-table-row td {
   padding-top: 15px;
@@ -47,21 +52,34 @@
   height: 90% !important;
   overflow-y: hidden
 }
+
 /*列表中有图片的加这个样式 参考用户管理*/
 .anty-img-wrap {
   height: 25px;
   position: relative;
 }
+
 .anty-img-wrap > img {
   max-height: 100%;
 }
+
 /*列表中范围查询样式*/
-.query-group-cust{width: calc(50% - 10px)}
-.query-group-split-cust:before{content:"~";width: 20px;display: inline-block;text-align: center}
+.query-group-cust {
+  width: calc(50% - 10px)
+}
+
+.query-group-split-cust:before {
+  content: "~";
+  width: 20px;
+  display: inline-block;
+  text-align: center
+}
 
 
 /*erp风格子表外框padding设置*/
-.ant-card-wider-padding.cust-erp-sub-tab>.ant-card-body{padding:5px 12px}
+.ant-card-wider-padding.cust-erp-sub-tab > .ant-card-body {
+  padding: 5px 12px
+}
 
 /* 内嵌子表背景颜色 */
 .j-inner-table-wrapper /deep/ .ant-table-expanded-row .ant-table-wrapper .ant-table-tbody .ant-table-row {
@@ -69,4 +87,6 @@
 }
 
 /**隐藏样式-modal确定按钮 */
-.jee-hidden{display: none}
+.jee-hidden {
+  display: none
+}

jero-web/src/components/PersonnelSelection/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <div class="box-title-text">
-      <a-input class="box-input" :value="value" @input="indexclick($event)" :placeholder="$t('PleaseEnterOrSelect')+query.db_field_name"/>
+      <a-input class="box-input" :value="value" @input="indexclick($event)" :placeholder="$t('PleaseEnterOrSelect')+query.db_field_txt"/>
       <a-button type="primary" class="button-box" @click="standardClick">
         人员选择
       </a-button>

jero-web/src/components/Standardselection/index.vue

@@ -6,7 +6,7 @@
       <!--        <span :class="{'title-text-text':false}">{{query.enName}}</span><br>-->
       <!--        <span :class="{'title-text-text':false}">{{query.name}}</span>-->
       <!--      </div>-->
-      <a-input class="box-input" :value="value" @input="indexclick($event)" :placeholder="$t('PleaseEnterOrSelect')+query.db_field_name"/>
+      <a-input class="box-input" :value="value" @input="indexclick($event)" :placeholder="$t('PleaseEnterOrSelect')+query.db_field_txt"/>
       <a-button type="primary" class="button-box" @click="standardClick">
         标准选择
       </a-button>

jero-web/src/components/layouts/TabLayout.vue

@@ -3,24 +3,24 @@
     <!-- update-begin- author:sunjianlei --- date:20191009 --- for: 提升右键菜单的层级 -->
     <contextmenu :itemList="menuItemList" :visible.sync="menuVisible" style="z-index: 9999;" @select="onMenuSelect"/>
     <!-- update-end- author:sunjianlei --- date:20191009 --- for: 提升右键菜单的层级 -->
-<!--    <a-tabs-->
-<!--      @contextmenu.native="e => onContextmenu(e)"-->
-<!--      v-if="multipage"-->
-<!--      :active-key="activePage"-->
-<!--      class="tab-layout-tabs"-->
-<!--      style="height:52px"-->
-<!--      :hide-add="true"-->
-<!--      type="editable-card"-->
-<!--      @change="changePage"-->
-<!--      @tabClick="tabCallBack"-->
-<!--      @edit="editPage">-->
-<!--      <a-tab-pane :id="page.fullPath" :key="page.fullPath" v-for="page in pageList"-->
-<!--                  :closable="!(page.meta.title=='首页')">-->
-<!--        <span slot="tab" :pagekey="page.fullPath">{{ page.meta.title }}</span>-->
-<!--      </a-tab-pane>-->
-<!--    </a-tabs>-->
-<!--    style="margin: 12px 12px 0;"-->
-    <Tabcrumbs v-if="isTrue"/>
+    <!--    <a-tabs-->
+    <!--      @contextmenu.native="e => onContextmenu(e)"-->
+    <!--      v-if="multipage"-->
+    <!--      :active-key="activePage"-->
+    <!--      class="tab-layout-tabs"-->
+    <!--      style="height:52px"-->
+    <!--      :hide-add="true"-->
+    <!--      type="editable-card"-->
+    <!--      @change="changePage"-->
+    <!--      @tabClick="tabCallBack"-->
+    <!--      @edit="editPage">-->
+    <!--      <a-tab-pane :id="page.fullPath" :key="page.fullPath" v-for="page in pageList"-->
+    <!--                  :closable="!(page.meta.title=='首页')">-->
+    <!--        <span slot="tab" :pagekey="page.fullPath">{{ page.meta.title }}</span>-->
+    <!--      </a-tab-pane>-->
+    <!--    </a-tabs>-->
+    <!--    style="margin: 12px 12px 0;"-->
+    <Tabcrumbs v-if="isTrue" :menuTitle="menuTitle"/>
     <div>
       <!-- update-begin-author:taoyan date:20201221 for:此处删掉transition标签 不知道为什么加上后 页面路由切换的时候即1及菜单切到2及菜单的时候 两个菜单页面会同时出现300-500秒左右 -->
       <keep-alive v-if="multipage">
@@ -65,7 +65,8 @@
           { key: '2', icon: 'arrow-right', text: '关闭右侧' },
           { key: '3', icon: 'close', text: '关闭其它' }
         ],
-        reloadFlag: true
+        reloadFlag: true,
+        menuTitle: {},
       }
     },
     /* update_begin author:wuxianquan date:20190828 for: 关闭当前tab页，供子页面调用 ->望菜单能配置外链，直接弹出新页面而不是嵌入iframe #428 */
@@ -84,13 +85,13 @@
           return this.$store.state.app.multipage
         }
       },
-      isTrue(){
-          if (this.$route.path == '/docManage/library/detail'){
-            return false
-          }else{
-            return true
-          }
-      },
+      isTrue() {
+        if (this.$route.path == '/docManage/library/detail') {
+          return false
+        } else {
+          return true
+        }
+      }
     },
     created() {
       if (this.$route.path != indexKey) {
@@ -447,15 +448,18 @@
 
   .ant-card {
     z-index: 999;
-    background: transparent!important;
-  }
-  .ant-input{
     background: transparent !important;
   }
-  .ant-select-selection{
+
+  .ant-input {
     background: transparent !important;
   }
-  .ant-table-placeholder{
+
+  .ant-select-selection {
+    background: transparent !important;
+  }
+
+  .ant-table-placeholder {
     background: transparent !important;
   }
 </style>

jero-web/src/components/layouts/Tabcrumbs.vue

@@ -15,10 +15,13 @@
 <script>
   export default {
     name: 'Tabcrumbs',
+    props: ['menuTitle'],
     data() {
       return {
         Navigation: '文档管理',
-        subNavigation: null
+        subNavigation: null,
+        selectedKeys: [],
+        openKeys:[],
       }
     },
     watch: {
@@ -27,7 +30,7 @@
           this.Navigation = val.meta.title
           this.subNavigation = null
         } else {
-          this.subNavigation = val.meta.title
+          this.updateMenu()
         }
       }
     },
@@ -36,11 +39,27 @@
         this.Navigation = this.$route.meta.title
         this.subNavigation = null
       } else {
+        this.updateMenu()
+      }
+    },
+    methods: {
+      updateMenu() {
+        const routes = this.$route.matched.concat()
+        const { hidden } = this.$route.meta
+        if (routes.length >= 3 && hidden) {
+          routes.pop()
+          this.selectedKeys = [routes[routes.length - 1].path]
+        } else {
+          this.selectedKeys = [routes.pop().path]
+        }
+        this.openKeys = []
+        routes.forEach(item => {
+          this.openKeys.push(item)
+        })
+        this.Navigation =this.openKeys[1].meta.title
         this.subNavigation = this.$route.meta.title
       }
-
-    },
-    methods: {}
+    }
   }
 </script>
 

jero-web/src/components/menu/SideMenu.vue

@@ -69,7 +69,7 @@
     methods: {
       onSelect(obj) {
         this.$emit('menuSelect', obj)
-      }
+      },
     }
   }
 </script>

jero-web/src/components/menu/index.js

@@ -26,7 +26,7 @@ export default {
       default: false
     }
   },
-  data () {
+  data() {
     return {
       openKeys: [],
       selectedKeys: [],
@@ -40,11 +40,11 @@ export default {
       return keys
     }
   },
-  mounted () {
+  mounted() {
     this.updateMenu()
   },
   watch: {
-    collapsed (val) {
+    collapsed(val) {
       if (val) {
         this.cachedOpenKeys = this.openKeys.concat()
         this.openKeys = []
@@ -52,14 +52,13 @@ export default {
         this.openKeys = this.cachedOpenKeys
       }
     },
-    $route: function () {
+    $route: function() {
       this.updateMenu()
     }
   },
   methods: {
     // select menu item
-    onOpenChange (openKeys) {
-
+    onOpenChange(openKeys) {
       // 在水平模式下时执行，并且不再执行后续
       if (this.mode === 'horizontal') {
         this.openKeys = openKeys
@@ -73,7 +72,7 @@ export default {
         this.openKeys = latestOpenKey ? [latestOpenKey] : []
       }
     },
-    updateMenu () {
+    updateMenu() {
       const routes = this.$route.matched.concat()
       const { hidden } = this.$route.meta
       if (routes.length >= 3 && hidden) {
@@ -89,24 +88,24 @@ export default {
         })
       }
       //update-begin-author:taoyan date:20190510 for:online表单菜单点击展开的一级目录不对
-      if(!this.selectedKeys || this.selectedKeys[0].indexOf(":")<0){
+      if (!this.selectedKeys || this.selectedKeys[0].indexOf(':') < 0) {
         this.collapsed ? (this.cachedOpenKeys = openKeys) : (this.openKeys = openKeys)
       }
       //update-end-author:taoyan date:20190510 for:online表单菜单点击展开的一级目录不对
     },
 
     // render
-    renderItem (menu) {
+    renderItem(menu) {
       if (!menu.hidden) {
         return menu.children && !menu.alwaysShow ? this.renderSubMenu(menu) : this.renderMenuItem(menu)
       }
       return null
     },
-    renderMenuItem (menu) {
+    renderMenuItem(menu) {
       const target = menu.meta.target || null
       const tag = target && 'a' || 'router-link'
       let props = { to: { name: menu.name } }
-      if(menu.route && menu.route === '0'){
+      if (menu.route && menu.route === '0') {
         props = { to: { path: menu.path } }
       }
 
@@ -122,42 +121,75 @@ export default {
       }
 
       return (
-        <Item {...{ key: menu.path }}>
-          <tag {...{ props, attrs }}>
-            {this.renderIcon(menu.meta.icon)}
-            <span>{menu.meta.title}</span>
-          </tag>
-        </Item>
-      )
+        < Item
+      {...
+        {
+          key: menu.path
+        }
+      }
+    >
+    <
+      tag
+      {...
+        {
+          props, attrs
+        }
+      }
+    >
+      {
+        this.renderIcon(menu.meta.icon)
+      }
+    <
+      span > { menu.meta.title } < /span>
+      < /tag>
+      < /Item>
+    )
     },
-    renderSubMenu (menu) {
+    renderSubMenu(menu) {
       const itemArr = []
       if (!menu.alwaysShow) {
         menu.children.forEach(item => itemArr.push(this.renderItem(item)))
       }
       return (
-        <SubMenu {...{ key: menu.path }}>
-          <span slot="title">
-            {this.renderIcon(menu.meta.icon)}
-            <span>{menu.meta.title}</span>
-          </span>
-          {itemArr}
-        </SubMenu>
-      )
+        < SubMenu
+      {...
+        {
+          key: menu.path
+        }
+      }
+    >
+    <
+      span
+      slot = 'title' >
+        { this.renderIcon(menu.meta.icon) }
+        < span > { menu.meta.title } < /span>
+        < /span>
+      {
+        itemArr
+      }
+    <
+      /SubMenu>
+    )
     },
-    renderIcon (icon) {
+    renderIcon(icon) {
       if (icon === 'none' || icon === undefined) {
         return null
       }
       const props = {}
       typeof (icon) === 'object' ? props.component = icon : props.type = icon
       return (
-        <Icon {... { props } }/>
-      )
+        < Icon
+      {...
+        {
+          props
+        }
+      }
+      />
+    )
     }
   },
 
-  render () {
+  render() {
     const { mode, theme, menu } = this
     const props = {
       mode: mode,
@@ -180,9 +212,21 @@ export default {
     })
     // {...{ props, on: on }}
     return (
-      <Menu vModel={this.selectedKeys} {...{ props, on: on }}>
-        {menuTree}
-      </Menu>
-    )
+      < Menu
+    vModel = { this.selectedKeys }
+    {...
+      {
+        props, on
+      :
+        on
+      }
+    }
+  >
+    {
+      menuTree
+    }
+  <
+    /Menu>
+  )
   }
 }

jero-web/src/components/page/GlobalLayout.vue

@@ -111,7 +111,7 @@
       return {
         collapsed: false,
         activeMenu: {},
-        menus: []
+        menus: [],
       }
     },
     computed: {
@@ -131,7 +131,6 @@
       //--update-begin----author:scott---date:20190320------for:根据后台菜单配置，判断是否路由菜单字段，动态选择是否生成路由（为了支持参数URL菜单）------
       //this.menus = this.mainRouters.find((item) => item.path === '/').children;
       this.menus = this.permissionMenuList
-
       //--update-begin----author:liusq---date:20210223------for:关于测边菜单遮挡内容问题详细说明 #2255
       this.collapsed = !this.sidebarOpened
       //--update-begin----author:liusq---date:20210223------for:关于测边菜单遮挡内容问题详细说明 #2255
@@ -157,6 +156,7 @@
       },
       //update-begin-author:taoyan date:20190430 for:动态路由title显示配置的菜单title而不是其对应路由的title
       myMenuSelect(value) {
+        console.log(value)
         //此处触发动态路由被点击事件
         this.findMenuBykey(this.menus, value.key)
         this.$emit('dynamicRouterShow', value.key, this.activeMenu.meta.title)

jero-web/src/views/documentManage/library/docDetail/index.vue

@@ -1,105 +1,105 @@
 <template>
-  <a-card :bordered="false">
-    <div class="doc-detail">
-      <div class="doc-detail-wrap">
-        <div class="doc-detail-header">
-          <div class="doc-detail-title">
-            <a-icon type="home" style="margin-right: 4px"/>
-            {{this.$route.query.serial_number}} 《{{this.$route.query.title}}》 标准详情
+  <div class="doc-detail">
+    <div class="doc-detail-wrap">
+      <div class="doc-detail-header">
+        <div class="doc-detail-title">
+          <a-icon type="home" style="margin-right: 4px"/>
+          {{this.$route.query.serial_number}} 《{{this.$route.query.title}}》 标准详情
+        </div>
+        <div class="doc-detail-right">
+          <div @click="UpdateLog" class="operator-text">
+            <a-icon type="reload"/>
+            更新log
           </div>
-          <div class="doc-detail-right">
-            <div @click="UpdateLog" class="operator-text">
-              <a-icon type="reload"/>
-              更新log
-            </div>
-            <div @click="DocumentSplitting" class="operator-text">
-              <a-icon type="codepen"/>
-              文档拆分
-            </div>
-            <div @click="UpdateLog" class="operator-text">
-              <a-icon type="file-pdf"/>
-              文档翻译
-            </div>
-            <div @click="UpdateLog" class="operator-text">
-              <a-icon type="wallet"/>
-              文档对比
-            </div>
-            <div @click="UpdateLog" class="operator-text">
-              <a-icon type="folder"/>
-              知识问答库
-            </div>
+          <div @click="DocumentSplitting" class="operator-text">
+            <a-icon type="codepen"/>
+            文档拆分
+          </div>
+          <div @click="UpdateLog" class="operator-text">
+            <a-icon type="file-pdf"/>
+            文档翻译
+          </div>
+          <div @click="UpdateLog" class="operator-text">
+            <a-icon type="wallet"/>
+            文档对比
+          </div>
+          <div @click="UpdateLog" class="operator-text">
+            <a-icon type="folder"/>
+            知识问答库
           </div>
         </div>
-        <div v-for="(item,index) in detailList">
-          <div v-for="val in Object.keys(item)" class="content">
-            <div class="header-text">
-              {{val}}
+      </div>
+      <div v-for="(item,index) in detailList" class="content-box">
+        <div v-for="val in Object.keys(item)" class="content">
+          <div class="header-text">
+            {{val}}
+          </div>
+          <div class="content-text" v-if="val == '基本信息'">
+            <div class="text-field" v-for="(ol,index1) in item[val]">
+              <span class="text-field-left">{{ol.db_field_txt}}</span>
+              <span class="text-field-right">{{ol.value ? ol.value : '--'}}</span>
             </div>
-            <div class="content-text" v-if="val == '基本信息'">
-              <div class="text-field" v-for="(ol,index1) in item[val]">
-                <span class="text-field-left">{{ol.db_field_txt}}</span>
-                <span class="text-field-right">{{ol.value ? ol.value : '--'}}</span>
-              </div>
-            </div>
-            <div class="TextInformation" v-if="val == '文本信息'">
-              <div class="TextInformationContent" v-for="(ol,index1) in item[val]" style="width: 100%">
+          </div>
+          <div class="TextInformation" v-if="val == '文本信息'">
+            <div class="TextInformationContent" v-for="(ol,index1) in item[val]" style="width: 100%">
               <span class="TextInformationContentLeft">
                  <span>{{ol.db_field_txt}}</span>
               </span>
-                <span class="TextInformationContentcontent">
+              <span style="margin-top: 2px">
+                 <span class="TextInformationContentcontent">
                          <span @click="pdfPreview(ol.value)">{{ol.value ? ol.value.fileName : '--'}}</span>
                 </span>
-                <span class="TextInformationContentright" v-show="ol.value" @click="download(ol.value)">
+              <span class="TextInformationContentright" v-show="ol.value" @click="download(ol.value)">
                 <a-icon type="vertical-align-bottom"/>
                    下载
               </span>
-              </div>
+              </span>
             </div>
-            <div class="TextInformation" v-else-if="val == '关联信息'">
-              <div class="TextInformationContent" v-for="(ol,index1) in item[val]" style="width: 100%">
+          </div>
+          <div class="TextInformation" v-else-if="val == '关联信息'">
+            <div class="TextInformationContent" v-for="(ol,index1) in item[val]" style="width: 100%">
                    <span class="TextInformationContentLeft">
                          {{ol.db_field_txt}}
                    </span>
-                <span class="TextInformationContentcontent">
+              <span class="TextInformationContentcontentButton">
                          {{ol.value ? ol.value : '--'}}
                  </span>
-              </div>
             </div>
           </div>
         </div>
       </div>
-      <a-modal
-        title="更新log"
-        :width="900"
-        :visible="visible"
-        :confirm-loading="confirmLoading"
-        :maskClosable="false"
-        @ok="handleOk"
-        @cancel="handleCancel"
-      >
-        <a-table
-          class="table"
-          :columns="columns"
-          :pagination="false"
-          :scroll="{y: 400}"
-          :data-source="dataSource"
-          :loading="loading"
-        >
-        </a-table>
-        <div class="page" v-if="dataSource.length > 0">
-          <a-pagination
-            :show-total="total => `共 ${total} 条`"
-            show-quick-jumper
-            show-size-changer
-            :page-size.sync="pageSize"
-            :total="total"
-            @change="onChange"
-            @showSizeChange="SizeChange"
-          />
-        </div>
-      </a-modal>
     </div>
-  </a-card>
+    <a-modal
+      title="更新log"
+      :width="900"
+      :visible="visible"
+      :confirm-loading="confirmLoading"
+      :maskClosable="false"
+      @ok="handleOk"
+      @cancel="handleCancel"
+    >
+      <a-table
+        class="table"
+        :columns="columns"
+        :pagination="false"
+        :scroll="{y: 400}"
+        :data-source="dataSource"
+        :loading="loading"
+      >
+      </a-table>
+      <div class="page" v-if="dataSource.length > 0">
+        <a-pagination
+          :show-total="total => `共 ${total} 条`"
+          show-quick-jumper
+          show-size-changer
+          :page-size.sync="pageSize"
+          :total="total"
+          @change="onChange"
+          @showSizeChange="SizeChange"
+        />
+      </div>
+    </a-modal>
+  </div>
 </template>
 <script>
   import { getAction, postAction, downFile, downloadFile } from '@/api/manage'
@@ -213,28 +213,31 @@
   @import '~@assets/less/common.less';
 
   .doc-detail {
-    padding: 0 8px;
-    box-sizing: border-box;
 
     .doc-detail-wrap {
       .doc-detail-header {
         width: 100%;
-        height: 44px;
+        height: 68px;
+        line-height: 68px;
+        padding: 0 32px;
+        box-sizing: border-box;
         display: flex;
         justify-content: space-between;
         border-bottom: 2px #eff1f3 solid;
+
         .doc-detail-title {
           display: inline-block;
           text-overflow: ellipsis;
           white-space: nowrap;
           overflow: hidden;
-          font-size: 18px;
-          font-weight: 600;
+          font-size: 20px;
+          font-weight: 400;
+          color: #040B29;
         }
 
         .doc-detail-right {
           min-width: 500px;
-          line-height: 30px;
+          line-height: 68px;
 
           .doc-detail-btn {
             margin-left: 10px;
@@ -242,10 +245,16 @@
         }
       }
 
+      .content-box {
+        padding: 0 32px;
+        box-sizing: border-box;
+      }
+
       .header-text {
         font-size: 16px;
-        font-weight: 600;
+        font-weight: 400;
         height: 80px;
+        color: #000F16;
         line-height: 80px;
       }
 
@@ -259,24 +268,26 @@
           margin-bottom: 8px;
 
           .text-field-left {
-            width: 160px;
+            width: 124px;
             display: inline-block;
             font-size: 14px;
+            font-weight: 400;
+            color: #6F7385;
             text-overflow: ellipsis;
             white-space: nowrap;
             overflow: hidden;
-            color: #6f7385;
+            margin-right: 24px;
           }
 
           .text-field-right {
             width: calc(100% - 200px);
             display: inline-block;
-            font-size: 17px;
+            font-size: 16px;
             text-overflow: ellipsis;
             white-space: nowrap;
             overflow: hidden;
-            color: #040b29;
-            font-weight: 500;
+            color: #040B29;
+            font-weight: 400;
           }
         }
       }
@@ -285,53 +296,76 @@
         height: auto;
 
         .TextInformationContent {
-          height: 50px;
-          border-top: 1.6px #eff1f3 solid;
-          border-right: 1.6px #eff1f3 solid;
+          height: 56px;
 
           .TextInformationContentLeft {
-            width: 310px;
-            height: 50px;
-            border: 1.6px #eff1f3 solid;
+            width: 268px;
+            height: 56px;
+            float: left;
+            border-top: 1px #eff1f3 solid;
+            border-left: 1px #eff1f3 solid;
             display: inline-block;
             background: #f7f7f8;
             text-align: center;
-            color: #040b29;
-            line-height: 50px;
-            font-weight: 500;
-            font-size: 16px;
+            color: #040B29;
+            line-height: 56px;
+            font-weight: bold;
+            font-size: 14px;
             text-overflow: ellipsis;
             white-space: nowrap;
             overflow: hidden;
           }
 
           .TextInformationContentcontent {
-            width: calc(100% - 410px);
-            line-height: 50px;
+            width: calc(100% - 356px);
+            float: left;
+            height: 56px;
+            border-top: 1px #eff1f3 solid;
+            border-left: 1px #eff1f3 solid;
+            line-height: 56px;
             display: inline-block;
             text-align: center;
-            color: #67bbc3;
-            font-size: 15px;
-            font-weight: 500;
+            color: #01A0AC;
+            font-size: 14px;
+            font-weight: 400;
             text-overflow: ellipsis;
             white-space: nowrap;
             overflow: hidden;
           }
 
           .TextInformationContentright {
-            width: 100px;
-            display: inline-block;
-            line-height: 50px;
-            color: #67bbc3;
-            font-size: 15px;
-            font-weight: 500;
-            text-align: center;
+            width: 88px;
+            height: 56px;
+            float: left;
             position: absolute;
+            display: inline-block;
+            border-right: 1px #eff1f3 solid;
+            border-top: 1px #eff1f3 solid;
+            line-height: 56px;
+            color: #00B3BE;
+            font-size: 14px;
+            font-weight: 400;
+            text-align: center;
+          }
+          .TextInformationContentcontentButton{
+            width: calc(100% - 268px);
+            border-top: 1px #eff1f3 solid;
+            border-left: 1px #eff1f3 solid;
+            border-right: 1px #eff1f3 solid;
+            line-height: 56px;
+            display: inline-block;
+            text-align: center;
+            color: #00B3BE;
+            font-size: 14px;
+            font-weight: 400;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            overflow: hidden;
           }
         }
 
         .TextInformationContent:last-child {
-          border-bottom: 1.6px #eff1f3 solid;
+          border-bottom: 1px #eff1f3 solid;
         }
       }
     }