From e697c9e82fd1dd39dd5b14e2726a4239d84299b0 Mon Sep 17 00:00:00 2001
From: xiongxiaoyang <773861846@qq.com>
Date: Sun, 29 May 2022 16:33:46 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E4=BD=9C=E5=AE=B6?=
 =?UTF-8?q?=E5=B0=8F=E8=AF=B4=E5=8F=91=E5=B8=83=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development                 |    3 +-
 .env.production                  |    3 +-
 src/api/author.js                |    4 +
 src/components/author/Header.vue |   17 +
 src/views/Book.vue               |    3 +-
 src/views/UserSetup.vue          |    8 +-
 src/views/author/BookList.vue    | 1005 +++++++++++++++++++++---------
 7 files changed, 722 insertions(+), 321 deletions(-)
 create mode 100644 src/components/author/Header.vue

diff --git a/.env.development b/.env.development
index 1fea89a..b395ead 100644
--- a/.env.development
+++ b/.env.development
@@ -2,7 +2,6 @@
 
 ENV = 'development'
 VUE_APP_BASE_API_URL = 'http://127.0.0.1:8888/api'
-VUE_APP_BASE_IMG_URL = 'http://47.106.243.172:8888'
-VUE_APP_BASE_UPLOAD_IMG_URL = 'http://127.0.0.1:8888'
+VUE_APP_BASE_IMG_URL = 'http://127.0.0.1:8888'
 
 
diff --git a/.env.production b/.env.production
index 6eaf4c3..6c9ea06 100644
--- a/.env.production
+++ b/.env.production
@@ -2,5 +2,4 @@
 
 ENV = 'production'
 VUE_APP_BASE_API_URL = 'http://47.106.243.172:8888/api/front'
-VUE_APP_BASE_IMG_URL = 'http://47.106.243.172:8888'
-VUE_APP_BASE_UPLOAD_IMG_URL = 'http://127.0.0.1:8888'
+VUE_APP_BASE_IMG_URL = 'http://127.0.0.1:8888'
diff --git a/src/api/author.js b/src/api/author.js
index 784f1ac..6759e56 100644
--- a/src/api/author.js
+++ b/src/api/author.js
@@ -6,4 +6,8 @@ export function getAuthorStatus() {
 
 export function register(params) {
     return request.post('/author/register', params);
+}
+
+export function listBooks() {
+    return request.get('/author/books');
 }
\ No newline at end of file
diff --git a/src/components/author/Header.vue b/src/components/author/Header.vue
new file mode 100644
index 0000000..4bb2c8c
--- /dev/null
+++ b/src/components/author/Header.vue
@@ -0,0 +1,17 @@
+ <template>
+  <div class="header">
+    <div class="mainNav" id="mainNav">
+        <div class="box_center cf" style="text-align: center;height: 44px;line-height: 48px;color: #fff;font-size: 16px;">
+
+            小说精品屋作家管理
+
+        </div>
+    </div>
+</div>
+</template>
+
+<script>
+export default {
+  name: "AuthorHeader"
+};
+</script>
\ No newline at end of file
diff --git a/src/views/Book.vue b/src/views/Book.vue
index c9083de..97f797d 100644
--- a/src/views/Book.vue
+++ b/src/views/Book.vue
@@ -158,7 +158,7 @@
                     <img
                       :src="
                         item.commentUserPhoto
-                          ? uploadImgBaseUrl + item.commentUserPhoto
+                          ? imgBaseUrl + item.commentUserPhoto
                           : man
                       "
                       class="user_head"
@@ -365,7 +365,6 @@ export default {
       commentContent: "",
       newestComments: {},
       imgBaseUrl: process.env.VUE_APP_BASE_IMG_URL,
-      uploadImgBaseUrl: process.env.VUE_APP_BASE_UPLOAD_IMG_URL,
       dialogUpdateCommentFormVisible: false,
       commentId: "",
       updateComment: "",
diff --git a/src/views/UserSetup.vue b/src/views/UserSetup.vue
index f7ca61e..bf46f9e 100644
--- a/src/views/UserSetup.vue
+++ b/src/views/UserSetup.vue
@@ -16,13 +16,13 @@
                 <i class="tit">我的头像</i>
                 <el-upload
                   class="avatar-uploader"
-                  :action="baseUrl + '/resource/image'"
+                  :action="baseUrl + '/front/resource/image'"
                   :show-file-list="false"
                   :on-success="handleAvatarSuccess"
                   :before-upload="beforeAvatarUpload"
                 >
                   <img
-                    :src="userPhoto ? uploadImgBaseUrl + userPhoto : man"
+                    :src="userPhoto ? imgBaseUrl + userPhoto : man"
                     class="avatar"
                   />
                 </el-upload>
@@ -32,7 +32,7 @@
                     id="imgLogo"
                     class="user_img"
                     alt="我的头像"
-                    :src="userPhoto ? (uploadImgBaseUrl + userPhoto) : man"
+                    :src="userPhoto ? (imgBaseUrl + userPhoto) : man"
                   />
                   <input
                     class="opacity"
@@ -103,7 +103,7 @@ export default {
       userPhoto: "",
       nickName: "",
       baseUrl: process.env.VUE_APP_BASE_API_URL,
-      uploadImgBaseUrl: process.env.VUE_APP_BASE_UPLOAD_IMG_URL,
+      imgBaseUrl: process.env.VUE_APP_BASE_IMG_URL,
     });
 
     onMounted(async () => {
diff --git a/src/views/author/BookList.vue b/src/views/author/BookList.vue
index b0ea502..02bc8db 100644
--- a/src/views/author/BookList.vue
+++ b/src/views/author/BookList.vue
@@ -1,360 +1,161 @@
 <template>
-  <div class="header">
-    <Top @eventSerch="searchByK" />
-    <Navbar />
-  </div>
-
+  <AuthorHeader />
   <div class="main box_center cf">
-    <div class="channelWrap classTable cf">
-      <div class="so_tag">
-        <ul class="list">
-          <li class="so_pd" id="workDirection">
-            <span class="tit">作品频道：</span>
-            <a
-              filter-value="0"
-              href="javascript:void(0)"
-              @click="loadCategoryList(0)"
-              :class="`${workDirectionOn == 0 ? 'on' : ''}`"
-              >男频</a
-            >
-            <a
-              filter-value="1"
-              href="javascript:void(0)"
-              @click="loadCategoryList(1)"
-              :class="`${workDirectionOn == 1 ? 'on' : ''}`"
-              >女频</a
-            >
-          </li>
-          <li id="idGirl" class="so_class">
-            <span class="tit">作品分类：</span>
-
-            <span class="so_boy" id="boyCategoryList">
-              <a
-                href="javascript:void(0)"
-                :class="`${categoryOn == 0 ? 'on' : ''}`"
-                @click="changeCategory(0)"
-                >不限</a
-              >
-              <a
-                v-for="(item, index) in bookCategorys"
-                :key="index"
-                href="javascript:void(0)"
-                :class="`${categoryOn == item.id ? 'on' : ''}`"
-                @click="changeCategory(item.id)"
-                >{{ item.name }}</a
-              >
-            </span>
-          </li>
-          <li class="so_progress">
-            <span class="tit">是否完结：</span>
-            <a
-              href="javascript:void(0)"
-              :class="`${bookStatusOn == null ? 'on' : ''}`"
-              @click="changeBookStatus(null)"
-              >不限</a
-            >
-            <a
-              filter-value="0"
-              href="javascript:void(0)"
-              :class="`${bookStatusOn == 0 ? 'on' : ''}`"
-              @click="changeBookStatus(0)"
-              >连载中</a
-            >
-            <a
-              filter-value="1"
-              href="javascript:void(0)"
-              :class="`${bookStatusOn == 1 ? 'on' : ''}`"
-              @click="changeBookStatus(1)"
-              >已完结</a
-            >
-          </li>
-          <li class="so_words">
-            <span class="tit">作品字数：</span>
-            <a
-              href="javascript:void(0)"
-              :class="`${wordCountOn == null ? 'on' : ''}`"
-              @click="changeWordCount(null, null)"
-              >不限</a
-            >
-            <a
-              filter-value-max="300000"
-              href="javascript:void(0)"
-              :class="`${wordCountOn == 0 ? 'on' : ''}`"
-              @click="changeWordCount(0, 300000)"
-              >30万字以下</a
-            >
-            <a
-              filter-value-min="300000"
-              filter-value-max="500000"
-              href="javascript:void(0)"
-              :class="`${wordCountOn == 300000 ? 'on' : ''}`"
-              @click="changeWordCount(300000, 500000)"
-              >30-50万字</a
-            >
-            <a
-              filter-value-min="500000"
-              filter-value-max="1000000"
-              href="javascript:void(0)"
-              :class="`${wordCountOn == 500000 ? 'on' : ''}`"
-              @click="changeWordCount(500000, 1000000)"
-              >50-100万字</a
-            >
-            <a
-              filter-value-min="1000000"
-              href="javascript:void(0)"
-              :class="`${wordCountOn == 1000000 ? 'on' : ''}`"
-              @click="changeWordCount(1000000, null)"
-              >100万字以上</a
-            >
-          </li>
-          <li class="so_update">
-            <span class="tit">更新时间：</span>
-            <a
-              href="javascript:void(0)"
-              :class="`${updateTimeOn == null ? 'on' : ''}`"
-              @click="changeUpdateTime(null)"
-              >不限</a
-            >
-            <a
-              filter-value="3"
-              href="javascript:void(0)"
-              :class="`${updateTimeOn == 3 ? 'on' : ''}`"
-              @click="changeUpdateTime(3)"
-              >三日内</a
-            >
-            <a
-              filter-value="7"
-              href="javascript:void(0)"
-              :class="`${updateTimeOn == 7 ? 'on' : ''}`"
-              @click="changeUpdateTime(7)"
-              >七日内</a
-            >
-            <a
-              filter-value="15"
-              href="javascript:void(0)"
-              :class="`${updateTimeOn == 15 ? 'on' : ''}`"
-              @click="changeUpdateTime(15)"
-              >半月内</a
-            >
-            <a
-              filter-value="30"
-              href="javascript:void(0)"
-              :class="`${updateTimeOn == 30 ? 'on' : ''}`"
-              @click="changeUpdateTime(30)"
-              >一月内</a
-            >
-          </li>
-          <li class="so_sort">
-            <span class="tit">排序方式：</span>
-            <a href="javascript:void(0)"
-              :class="`${sortOn == null ? 'on' : ''}`"
-              @click="changeSort(null)">不限</a>
-            <a
-              filter-value="last_index_update_time"
-              href="javascript:void(0)"
-              :class="`${sortOn == 'last_chapter_update_time desc' ? 'on' : ''}`"
-              @click="changeSort('last_chapter_update_time desc')"
-              >更新时间</a
-            >
-            <a filter-value="word_count" href="javascript:void(0)"
-              :class="`${sortOn == 'word_count desc' ? 'on' : ''}`"
-              @click="changeSort('word_count desc')"
-              >总字数</a
-            >
-            <a
-              filter-value="visit_count"
-              href="javascript:void(0)"
-              :class="`${sortOn == 'visit_count desc' ? 'on' : ''}`"
-              @click="changeSort('visit_count desc')"
-              >点击量</a
-            >
-          </li>
+    <div class="userBox cf">
+      <div class="my_l">
+        <ul class="log_list">
+          <li><a class="link_4 on">小说管理</a></li>
         </ul>
       </div>
-    </div>
+      <div class="my_r">
+        <div id="noContentDiv" v-if="total == 0">
+          <div class="tc" style="margin-top: 200px">
+            <a href="/author/book_add.html" class="btn_red">创建作品</a>
+          </div>
+        </div>
+        <div class="my_bookshelf" id="hasContentDiv" v-if="total > 0">
+          <div class="title cf">
+            <h2 class="fl">小说列表</h2>
+            <div class="fr">
+              <a href="/author/book_add.html" class="btn_red">发布小说</a>
+            </div>
+          </div>
 
-    <div class="channelWrap channelClassContent cf">
-      <div class="updateTable rankTable">
-        <table cellpadding="0" cellspacing="0">
-          <thead>
-            <tr>
-              <th class="rank">序号</th>
-              <th class="style">类别</th>
-              <th class="name">书名</th>
-              <th class="chapter">最新章节</th>
-              <th class="author">作者</th>
-              <th class="word">字数</th>
-            </tr>
-          </thead>
-          <tbody id="bookList">
-            <tr v-for="(item, index) in books" :key="index">
-              <td class="rank">
-                <i>{{ index + 1 }}</i>
-              </td>
-              <td class="style">
-                <a href="javascript:void(0)" @click="bookDetail(item.id)" cls="13"
-                  >[{{ item.categoryName }}]</a
-                >
-              </td>
-              <td class="name">
-                <a href="javascript:void(0)" @click="bookDetail(item.id)" v-html="item.bookName"></a>
-              </td>
-              <td class="chapter">
-                <a href="javascript:void(0)" @click="bookDetail(item.id)">{{
-                  item.lastChapterName
-                }}</a>
-              </td>
-              <td class="author">
-                <a href="javascript:void(0)" v-html="item.authorName"></a>
-              </td>
-              <td class="word">{{ wordCountFormat(item.wordCount) }}</td>
-            </tr>
-          </tbody>
-        </table>
+          <div id="divData" class="updateTable">
+            <table cellpadding="0" cellspacing="0">
+              <thead>
+                <tr>
+                  <th class="goread">书名</th>
+                  <th class="goread">分类</th>
+                  <th class="goread">点击量</th>
+                  <th class="goread">昨日订阅数</th>
+                  <th class="goread">更新时间</th>
+                  <th class="goread">总字数</th>
+                  <th class="goread">操作</th>
+                </tr>
+              </thead>
+              <tbody id="bookList">
+                <tr class="book_list" vals="291" v-for="(item, index) in books"
+                    :key="index">
+                  <td
+                    style="position: relative"
+                    class="goread"
+                    
+                  >
+                    <img
+                      width="50"
+                      height="70"
+                      :src="`${imgBaseUrl}` + `${item.picUrl}`"
+                      :alt="item.bookName"
+                    /><br />
+                    {{item.bookName}}
+                  </td>
+                  <td class="goread">{{item.categoryName}}</td>
+                  <td class="goread" valsc="291|2037554|1">{{item.visitCount}}</td>
+                  <td class="goread" valsc="291|2037554|1">0</td>
+                  <td class="goread">{{item.lastChapterUpdateTime}} 更新</td>
+                  <td class="goread" valsc="291|2037554|1">0</td>
+                  <td class="goread" id="opt1431636515973345292">
+                    <a
+                      target="_blank"
+                      class="redBtn"
+                      href="/author/index_list.html?bookId=1431636515973345292"
+                      >章节管理
+                    </a>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+            <el-pagination
+              small
+              layout="prev, pager, next"
+              :background="backgroud"
+              :page-size="pageSize"
+              :total="total"
+              class="mt-4"
+              @current-change="handleCurrentChange"
+            />
+          </div>
+          <!--<div id="divData" class="updateTable">
+                    <table cellpadding="0" cellspacing="0">
+                        <thead>
+                        <tr>
 
-        <el-pagination
-          small
-          layout="prev, pager, next"
-          :background="backgroud"
-          :page-size="pageSize"
-          :total="total"
-          class="mt-4"
-          @current-change="handleCurrentChange"
-        />
+                            <th class="name">
+                                爬虫源（已开启的爬虫源）
+                            </th>
+                            <th class="chapter">
+                                成功爬取数量（websocket实现）
+                            </th>
+                            <th class="time">
+                            目标爬取数量
+                            </th>
+                            <th class="goread">
+                                状态（正在运行，已停止）（一次只能运行一个爬虫源）
+                            </th>
+                            <th class="goread">
+                                操作（启动，停止）
+                            </th>
+                        </tr>
+                        </thead>
+                        <tbody id="bookShelfList">
+
+
+
+                        </tbody>
+                    </table>
+                    <div class="pageBox cf" id="shellPage">
+                    </div>
+                </div>-->
+        </div>
       </div>
     </div>
   </div>
-  <Footer />
 </template>
 
 <script>
 import "@/assets/styles/book.css";
 import { reactive, toRefs, onMounted, ref } from "vue";
 import { useRouter, useRoute } from "vue-router";
-import { searchBooks, listCategorys } from "@/api/book";
-import { addDay, dateFormat } from "@/utils";
-import Top from "@/components/common/Top";
-import Navbar from "@/components/common/Navbar";
-import Footer from "@/components/common/Footer";
+import { listBooks } from "@/api/author";
+import AuthorHeader from "@/components/author/Header.vue";
 export default {
   name: "authorBookList",
   components: {
-    Top,
-    Navbar,
-    Footer,
+    AuthorHeader,
   },
   setup() {
     const route = useRoute();
     const router = useRouter();
 
     const state = reactive({
-      bookCategorys: [],
       books: [],
       searchCondition: {},
       backgroud: true,
       total: 0,
       pageSize: 10,
       imgBaseUrl: process.env.VUE_APP_BASE_IMG_URL,
-      workDirectionOn: 0,
-      categoryOn: 0,
-      bookStatusOn: null,
-      wordCountOn: null,
-      updateTimeOn: null,
-      sortOn:null
     });
     onMounted(() => {
-      const key = route.query.key;
-      state.searchCondition.keyword = key;
-      state.searchCondition.pageSize = 10;
-      loadCategoryList(0);
+      load();
     });
 
-    const search = async () => {
-      const { data } = await searchBooks(state.searchCondition);
+    const load = async () => {
+      const { data } = await listBooks(state.searchCondition);
       state.books = data.list;
       state.searchCondition.pageNum = data.pageNum;
       state.searchCondition.pageSize = data.pageSize;
       state.total = Number(data.total);
     };
 
-    const searchByK = (key) => {
-      state.searchCondition = { keyword: key };
-      search();
-    };
-    const bookDetail = (bookId) => {
-      router.push({ path: `/book/${bookId}` });
-    };
-
     const handleCurrentChange = (pageNum) => {
       state.searchCondition.pageNum = pageNum;
-      search();
-    };
-
-    const loadCategoryList = async (workDirection) => {
-      const { data } = await listCategorys({ workDirection: workDirection });
-      state.bookCategorys = data;
-      state.workDirectionOn = workDirection;
-      state.searchCondition.workDirection = workDirection;
-      state.categoryOn = 0;
-      state.searchCondition.categoryId = null;
-      search();
-    };
-
-    const changeCategory = async (categoryId) => {
-      state.categoryOn = categoryId;
-      if (categoryId > 0) {
-        state.searchCondition.categoryId = categoryId;
-      } else {
-        state.searchCondition.categoryId = null;
-      }
-      search();
-    };
-
-    const changeBookStatus = async (bookStatus) => {
-      state.bookStatusOn = bookStatus;
-      state.searchCondition.bookStatus = bookStatus;
-      search();
-    };
-
-    const changeWordCount = async (wordCountMin, wordCountMax) => {
-      state.wordCountOn = wordCountMin;
-      state.searchCondition.wordCountMin = wordCountMin;
-      state.searchCondition.wordCountMax = wordCountMax;
-
-      search();
-    };
-
-    const changeUpdateTime = async (days) => {
-      state.updateTimeOn = days;
-      if (days) {
-        state.searchCondition.updateTimeMin = dateFormat(
-          "YYYY-mm-dd",
-          addDay(-days)
-        );
-      } else {
-        state.searchCondition.updateTimeMin = null;
-      }
-      search();
-    };
-
-    const changeSort = async (sort) => {
-      state.sortOn = sort;
-      state.searchCondition.sort = sort;
-      search();
+      load();
     };
 
     return {
       ...toRefs(state),
-      bookDetail,
-      searchByK,
-      search,
-      handleCurrentChange,
-      loadCategoryList,
-      changeCategory,
-      changeBookStatus,
-      changeWordCount,
-      changeUpdateTime,
-      changeSort
+      load,
     };
   },
   computed: {
@@ -384,3 +185,585 @@ export default {
   --el-pagination-hover-color: #f80 !important;
 }
 </style>
+
+<style scoped>
+.redBtn {
+  padding: 5px;
+  border-radius: 20px;
+  border: 1px solid #f80;
+  background: #f80;
+  color: #fff;
+}
+a.redBtn:hover {
+  color: #fff;
+}
+
+.avatar-uploader .avatar {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
+
+.avatar-uploader .el-upload {
+  border: 1px dashed var(--el-border-color);
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+  transition: var(--el-transition-duration-fast);
+}
+
+.avatar-uploader .el-upload:hover {
+  border-color: var(--el-color-primary);
+}
+
+.el-icon.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 178px;
+  height: 178px;
+  text-align: center;
+}
+
+.updateTable .style a {
+  color: #999;
+}
+.updateTable .author a {
+  color: #999;
+  cursor: text;
+}
+.bind,
+.updateTable .style a:hover {
+  color: #f65167;
+}
+.userBox {
+  /*width: 998px; border: 1px solid #eaeaea;*/
+  margin: 0 auto 50px;
+  background: #fff;
+  border-radius: 6px;
+}
+.channelViewhistory .userBox {
+  margin: 0 auto;
+}
+.user_l {
+  width: 350px;
+  float: left;
+  padding: 100px 124px;
+}
+.user_l h3 {
+  font-size: 23px;
+  font-weight: normal;
+  line-height: 1;
+  text-align: center;
+}
+.user_l #LabErr {
+  color: #ff4040;
+  display: block;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  font-size: 14px;
+}
+.user_l .log_list {
+  width: 350px;
+}
+.user_l .s_input {
+  margin-bottom: 25px;
+  font-size: 14px;
+}
+.s_input {
+  width: 348px;
+  height: 38px;
+  line-height: 38px\9;
+  vertical-align: middle;
+  border: 1px solid #ddd;
+  border-radius: 2px;
+}
+.icon_name,
+.icon_key,
+.icon_code {
+  width: 312px;
+  padding-left: 36px;
+}
+.icon_key {
+  background-position: 13px -51px;
+}
+.icon_code {
+  background-position: 13px -117px;
+  width: 200px;
+  float: left;
+}
+.code_pic {
+  height: 38px;
+  float: right;
+}
+.btn_phone {
+  height: 40px;
+  width: 100px;
+  float: right;
+  cursor: pointer;
+  padding: 0;
+  text-align: center;
+  border-radius: 2px;
+  background: #dfdfdf;
+}
+.log_code {
+  *padding-bottom: 25px;
+}
+.user_l .btn_red {
+  width: 100%;
+  font-size: 19px;
+  padding: 12px;
+}
+.autologin {
+  color: #999;
+  line-height: 1;
+  margin-bottom: 18px;
+}
+.autologin em {
+  vertical-align: 2px;
+  margin-left: 4px;
+}
+.user_r {
+  width: 259px;
+  margin: 80px 0;
+  padding: 20px 70px;
+  border-left: 1px dotted #e3e3e3;
+  float: right;
+  text-align: center;
+}
+.user_r .tit {
+  font-size: 16px;
+  line-height: 1;
+  padding: 6px 0 25px;
+}
+.user_r .btn_ora {
+  padding: 10px 34px;
+}
+.fast_login {
+  padding: 60px 0 0;
+}
+.fast_list {
+  text-align: center;
+  padding: 0.5rem;
+}
+.fast_list li {
+  display: inline-block;
+  *display: inline;
+  zoom: 1;
+}
+.fast_list li .img {
+  width: 48px;
+  height: 48px;
+  margin: 20px 0 5px;
+}
+.fast_list li a:hover {
+  opacity: 0.8;
+  filter: alpha(opacity=80);
+  -moz-opacity: 0.8;
+}
+.fast_list li span {
+  display: block;
+}
+.fast_list .login_qq {
+  margin: 0 42px;
+}
+.fast_list .login_wb a {
+  color: #f55c5b;
+}
+.fast_list .login_qq a {
+  color: #51b7ff;
+}
+.fast_list .login_wx a {
+  color: #66d65e;
+}
+.fast_tit {
+  position: relative;
+  overflow: hidden;
+}
+.fast_tit .lines {
+  position: absolute;
+  top: 50%;
+  left: 0;
+  width: 100%;
+  height: 1px;
+  line-height: 1;
+  background: #eaeaea;
+}
+.fast_tit .title {
+  background: #fff;
+  font-size: 16px;
+  padding: 3px 14px;
+  position: relative;
+  display: inline-block;
+  z-index: 999;
+}
+/*userinfo*/
+.my_l {
+  width: 198px;
+  float: left;
+  font-size: 13px;
+  padding-top: 20px;
+}
+.my_l li a {
+  display: block;
+  height: 42px;
+  line-height: 42px;
+  padding-left: 62px;
+  border-left: 4px solid #fff;
+  margin-bottom: 5px;
+  color: #666;
+}
+.my_l li .on {
+  background-color: #fafafa;
+  border-left: 2px solid #f80;
+  color: #000;
+  border-radius: 0 2px 2px 0;
+}
+.my_l .link_1 {
+  background-position: 32px -188px;
+}
+.my_l .link_2 {
+  background-position: 32px -230px;
+}
+.my_l .link_3 {
+  background-position: 32px -272px;
+}
+.my_l .link_4 {
+  background-position: 32px -314px;
+}
+.my_l .link_5 {
+  background-position: 32px -356px;
+}
+.my_l .link_6 {
+  background-position: 32px -397px;
+}
+.my_l .link_7 {
+  background-position: 32px -440px;
+}
+.my_l .link_8 {
+  background-position: 32px -481px;
+}
+.my_r {
+  width: 739px;
+  padding: 0 30px 30px;
+  float: right;
+  border-left: 1px solid #efefef;
+  min-height: 470px;
+}
+.my_info {
+  padding: 30px 0 5px;
+}
+.user_big_head {
+  /*width:110px; height:110px; padding:4px; border:1px solid #eaeaea;*/
+  margin-right: 30px;
+  float: left;
+  width: 80px;
+  height: 80px;
+  border-radius: 50%;
+}
+.my_r .my_name {
+  font-size: 18px;
+  line-height: 1;
+  padding: 5px 0 12px 0;
+}
+.my_r .s_input {
+  width: 318px;
+  padding: 0 10px;
+}
+.my_list li {
+  line-height: 28px;
+}
+.my_list li i,
+.my_list li em.red {
+  margin-right: 6px;
+}
+.my_list .binded {
+  color: #999;
+  margin-left: 6px;
+}
+.my_list .btn_link {
+  margin-left: 12px;
+}
+.mytab_list li {
+  line-height: 30px;
+  padding: 10px 0;
+  font-size: 14px;
+}
+.mytab_list li .tit {
+  width: 70px;
+  color: #aaa;
+  text-align: right;
+  display: inline-block;
+  margin-right: 18px;
+}
+.mytab_list .user_img {
+  width: 48px;
+  height: 48px;
+  vertical-align: middle;
+  border-radius: 50%;
+}
+.my_bookshelf .title {
+  padding: 20px 0 15px;
+  line-height: 30px;
+}
+.my_bookshelf h4 {
+  font-size: 14px;
+  color: #666;
+}
+.my_bookshelf h2 {
+  font-size: 18px;
+  font-weight: normal;
+}
+.updateTable {
+  width: 739px;
+  color: #999;
+}
+.updateTable table {
+  width: 100%;
+  margin-bottom: 14px;
+}
+.updateTable th,
+.updateTable td {
+  height: 40px;
+  line-height: 40px;
+  vertical-align: middle;
+  padding-left: 6px;
+  font-weight: normal;
+  text-align: left;
+}
+.updateTable th {
+  background: #f9f9f9;
+  color: #333;
+  border-top: 1px solid #eee;
+}
+.updateTable td {
+  height: 40px;
+  line-height: 40px;
+}
+.updateTable .style {
+  width: 80px;
+  padding-left: 10px;
+}
+.updateTable .name {
+  width: 178px;
+  padding-right: 10px;
+}
+.updateTable .name a,
+.updateTable .chapter a {
+  max-width: 168px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.updateTable .chapter {
+  padding-right: 5px;
+}
+.updateTable .chapter a {
+  max-width: 220px;
+  float: left;
+}
+.updateTable .author {
+  width: 72px;
+  text-align: left;
+}
+.updateTable .goread {
+  width: 80px;
+  text-align: center;
+}
+.updateTable .time {
+  width: 86px;
+}
+.updateTable .word {
+  width: 64px;
+  padding-right: 10px;
+  text-align: right;
+}
+.updateTable .rank {
+  width: 30px;
+  padding-right: 10px;
+  text-align: center;
+}
+.updateTable .name a,
+.updateTable .chapter a,
+.updateTable .author a {
+  height: 40px;
+  line-height: 40px;
+  display: inline-block;
+  overflow: hidden;
+}
+.updateTable tr:nth-child(2n) td {
+  background: #fafafa;
+}
+.dataTable {
+  width: 739px;
+}
+.dataTable table {
+  width: 100%;
+  margin-bottom: 14px;
+  border-collapse: collapse;
+}
+.dataTable th,
+.dataTable td {
+  height: 40px;
+  line-height: 40px;
+  vertical-align: middle;
+  padding: 0 10px;
+  font-weight: normal;
+  text-align: center;
+  border: 1px solid #eaeaea;
+}
+.dataTable th {
+  background: #f8f8f8;
+}
+.nodate {
+  border-top: 1px solid #eaeaea;
+  padding: 60px 0;
+}
+.viewhistoryBox {
+  /*padding: 0 30px 30px; */
+  padding: 0 20px 10px;
+}
+.viewhistoryBox .updateTable {
+  width: 100%;
+}
+/*.btn_gray, .btn_red, .btn_ora { font-size:14px; padding:8px 28px }*/
+.book_tit {
+  height: 48px;
+  line-height: 48px;
+  margin: 0 14px;
+  border-bottom: 1px solid #eaeaea;
+  overflow: hidden;
+}
+.book_tit .fl {
+  font-size: 14px;
+  color: #999;
+}
+.book_tit .fl h3 {
+  font-size: 18px;
+  color: #333;
+  font-weight: normal;
+  margin-right: 5px;
+  display: inline;
+}
+.book_tit .fr {
+  font-size: 14px;
+}
+
+.commentBar,
+.feedback_list {
+  border-top: 1px solid #eee;
+  margin-bottom: 15px;
+}
+/*.comment_list { padding: 16px 0; border-bottom: 1px solid #eee }
+.comment_list .user_head { width:54px; height:54px; border-radius:50%; float: left; margin-right: 14px }
+.comment_list .li_1 { overflow: hidden }
+.comment_list .user_name { color: #ed4259 }
+.comment_list .li_2 { padding:3px 0; color:#999 }
+.comment_list .li_3, .comment_list .li_4 { margin-left:68px }
+.comment_list .reply { padding-left: 12px }
+.comment_list .num { color: #ed4259; margin: 0 3px }
+.comment_list .li_4 { line-height:34px; padding-top:8px; margin-top:15px; border-top:1px solid #eaeaea }
+.comment_list .li_4 .more { background:#f7f7f7; border-radius:2px; color:#ed4259; text-align:center }*/
+.no_contet {
+  padding: 190px 0 40px;
+  text-align: center;
+  color: #999;
+  border-top: 1px solid #eee;
+}
+
+.comment_list {
+  padding: 20px 0;
+  border-bottom: 1px solid #eee;
+}
+.comment_list:last-child {
+  border: none;
+}
+.comment_list .user_heads {
+  /*width: 54px; height: 54px; float: left;*/
+  position: relative;
+  margin-right: 20px;
+}
+.comment_list .user_head {
+  width: 50px;
+  height: 50px;
+  border-radius: 50%;
+  background: #f6f6f6;
+}
+.comment_list .user_heads span {
+  display: block;
+  margin: 0;
+  position: absolute;
+  left: 12px;
+  bottom: 0;
+}
+.comment_list ul {
+  /*width: 640px;*/
+  width: 660px;
+}
+.comment_list .li_0 {
+  font-family: "宋体";
+}
+.comment_list .li_0 strong {
+  font-size: 14px;
+  color: #f00;
+}
+.comment_list .li_1 {
+  overflow: hidden;
+}
+.comment_list .user_name {
+  color: #ed4259;
+}
+.comment_list .li_2 {
+  padding: 6px 0;
+}
+.comment_list .li_3 {
+  color: #999;
+}
+.comment_list .reply {
+  padding-left: 12px;
+}
+.comment_list .num {
+  color: #ed4259;
+  margin: 0 3px;
+}
+.comment_list .li_4 {
+  line-height: 34px;
+  padding-top: 8px;
+  margin-top: 15px;
+  border-top: 1px solid #eaeaea;
+}
+.pl_bar li {
+  display: block;
+}
+.pl_bar .name {
+  color: #666;
+  padding-top: 2px;
+  font-size: 14px;
+}
+.pl_bar .dec {
+  font-size: 14px;
+  line-height: 1.8;
+  padding: 12px 0;
+}
+.pl_bar .other {
+  line-height: 24px;
+  color: #999;
+  font-size: 13px;
+}
+.pl_bar .other a {
+  display: inline-block;
+  color: #999;
+}
+.pl_bar .reply {
+  padding-left: 22px;
+}
+/*.no_comment { padding: 70px 14px 115px; color: #CCCCCC; text-align: center; font-size: 14px; }*/
+.reply_bar {
+  background: #f9f9f9;
+  border: 1px solid #eee;
+  border-radius: 6px;
+  padding: 10px;
+  line-height: 1.8;
+}
+</style>