feats

.editorconfig

@@ -7,3 +7,4 @@ indent_size = 2
 end_of_line = lf
 insert_final_newline = true
 trim_trailing_whitespace = true
+semi = false

.eslintrc.js

@@ -25,6 +25,9 @@ module.exports = {
     'generator-star-spacing': 'off',
     // allow debugger during development
     'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-    'comma-dangle': 0
+    'comma-dangle': 0,
+
+    // 这个规则让人蛋疼
+    'space-before-function-paren': 0
   }
 }

package-lock.json

@@ -12173,10 +12173,9 @@
       "dev": true
     },
     "prettier": {
-      "version": "1.14.3",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-1.14.3.tgz",
-      "integrity": "sha512-qZDVnCrnpsRJJq5nSsiHCE3BYMED2OtsI+cmzIzF1QIfqm5ALf8tEJcO27zV1gKNKRPdhjO0dNWnrzssDQ1tFg==",
-      "dev": true
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-1.15.3.tgz",
+      "integrity": "sha512-gAU9AGAPMaKb3NNSUUuhhFAS7SCO4ALTN4nRIn6PJ075Qd28Yn2Ig2ahEJWdJwJmlEBTUfC7mMUSFy8MwsOCfg=="
     },
     "pretty": {
       "version": "2.0.0",

src/pages/system/library/books/detail.vue

@@ -0,0 +1,238 @@
+<template>
+  <div class="subPage edit-book" :style="{ padding: '20px' }">
+    <el-form :model="formData" :rules="rules" ref="ruleForm" label-width="100px" :style="{ width: '600px' }">
+      <div v-if="!active">
+        <el-form-item label="条形码" prop="BookBarcode">
+          <el-input v-model="formData.BookBarcode" :style="{ width: '200px' }"></el-input>
+        </el-form-item>
+        <el-form-item :style="{ paddingTop: '20px' }">
+          <el-button type="primary" @click="nextStep()">下一步</el-button>
+        </el-form-item>
+      </div>
+      <div v-else>
+        <el-form-item label="条形码">
+          <el-input v-model="formData.BookBarcode" :style="{ width: '200px' }" :disabled="true"></el-input>
+        </el-form-item>
+        <el-form-item label="案场" prop="CaseId">
+          <el-select v-model="formData.CaseId" placeholder="请选择案场">
+            <el-option
+              v-for="item in cases"
+              :key="item.CaseId"
+              :label="item.CaseName"
+              :value="item.CaseId"
+              @change="filterTypes"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="图片" prop="BookImg">
+          <el-upload
+            class="avatar-uploader"
+            action=""
+            :show-file-list="false"
+            :on-success="uploadSuccess"
+            :before-upload="toolClass.beforeUpload"
+            :http-request="toolClass.upload"
+          >
+            <img v-if="formData.BookImg" :src="formData.BookImg + '?x-oss-process=style/compress-rotate'" class="avatar">
+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+          </el-upload>
+        </el-form-item>
+        <el-form-item label="书名" prop="BookName">
+          <el-input v-model="formData.BookName" :style="{ width: '200px' }"></el-input>
+        </el-form-item>
+        <el-form-item label="分类" prop="BookTypeId">
+          <el-select v-model="formData.BookTypeId" placeholder="请选择分类">
+            <el-option
+              v-for="item in types"
+              :key="item.BookTypeId"
+              :label="item.BookTypeName"
+              :value="item.BookTypeId"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="作者" prop="Author">
+          <el-input v-model="formData.Author" :style="{ width: '200px' }"></el-input>
+        </el-form-item>
+        <el-form-item label="出版社" prop="Publisher">
+          <el-input v-model="formData.Publisher" :style="{ width: '200px' }"></el-input>
+        </el-form-item>
+        <el-form-item label="价格" prop="Price">
+          <el-input-number v-model="formData.Price" :precision="2" controls-position="right" :style="{ width: '200px' }"></el-input-number>
+        </el-form-item>
+        <el-form-item label="总数量" prop="InStock">
+          <el-input-number v-model="formData.InStock" controls-position="right" :style="{ width: '200px' }"></el-input-number>
+        </el-form-item>
+        <el-form-item label="借阅时间" prop="BorrowDays">
+          <el-input-number v-model="formData.BorrowDays" controls-position="right" :style="{ width: '200px' }"></el-input-number>
+          <span> /天</span>
+        </el-form-item>
+        <el-form-item label="图书描述" prop="BookDescription">
+          <el-input type="textarea" rows="4" v-model="formData.BookDescription" :style="{ width: '400px' }"></el-input>
+        </el-form-item>
+        <el-form-item :style="{ paddingTop: '40px' }">
+          <el-button type="primary" @click="submit()">保存</el-button>
+          <el-button @click="$router.back()">取消</el-button>
+        </el-form-item>
+      </div>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers, mapState } from 'vuex'
+
+const {
+  mapState: mapLibSate,
+  mapActions,
+  mapMutations
+} = createNamespacedHelpers('library')
+
+export default {
+  name: 'bookDetail',
+  data() {
+    return {
+      active: 0,
+      rules: {
+        BookBarcode: [{ required: true, message: '请录入条形码', trigger: 'blur' }],
+        BookName: [{ required: true, message: '请输入图书名称', trigger: 'blur' }],
+        // BookImg: [{ required: true, message: '请上传图片', trigger: 'change' }],
+        CaseId: [{ required: true, message: '请选择一个案场', trigger: 'change' }],
+        BookTypeId: [{ required: true, message: '请选择一个分类', trigger: 'change' }],
+        InStock: [{ required: true, message: '请设置总数量', trigger: 'change' }],
+        BorrowDays: [{ required: true, message: '请设置借阅时间', trigger: 'change' }],
+      },
+      formData: {},
+    }
+  },
+  created() {
+    const id = this.$route.params.id
+    if (id) {
+      this.active = 1
+
+      this.getInfo({
+        BookId: id
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    } else {
+      this.active = 0
+    }
+  },
+  computed: {
+    ...mapState({
+      cases: x => x.app.cases.list,
+      defaultCase: x => x.app.cases.default,
+      orgid: x => x.app.user.OrgId
+    }),
+    ...mapLibSate({
+      detail: s => s.detail,
+      types: s => s.type.list,
+    }),
+  },
+  watch: {
+    detail: {
+      handler (nv, ov) {
+        if (nv.BookId === this.formData.BookId) {
+          return
+        }
+
+        let CaseId = nv.CaseId
+        if (!CaseId) {
+          CaseId = this.defaultCase
+        }
+
+        this.formData = { ...nv, CaseId }
+        // this.mergeDetail(nv)
+      },
+      immediate: true,
+    },
+    formData: {
+      handler (nv) {
+        this.mergeDetail(nv)
+      },
+      deep: true,
+    },
+  },
+  methods: {
+    ...mapMutations({
+      mergeDetail: 'mergeBookDetail'
+    }),
+    ...mapActions({
+      getInfo: 'getBookDetail',
+      getTypeList: 'getTypeList',
+      updateDetail: 'updateBookDetail'
+    }),
+
+    nextStep() {
+      if (!this.formData.BookBarcode) {
+        this.$message({
+          showClose: true,
+          message: '请录入条形码',
+          type: 'error'
+        })
+        return
+      }
+
+      this.$confirm('条形码一旦输入将不能改变!', '请确认条形码正确', {
+        confirmButtonText: '已确认',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.active = 1
+        })
+        .catch(x => x)
+    },
+
+    uploadSuccess(res) {
+      this.formData.BookImg = res.result.url
+    },
+
+    filterTypes(val) {
+      const CaseId = val
+      this.getTypeList({ page: 0, CaseId, pagesize: 10000 })
+    },
+
+    submit() {
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          this.updateDetail()
+            .then(() => {
+              this.$message({
+                showClose: true,
+                message: '更新或编辑成功',
+                type: 'success'
+              })
+            })
+            .catch(err => {
+              this.$message({
+                showClose: true,
+                message: err,
+                type: 'error'
+              })
+            })
+        } else {
+          this.$message({
+            showClose: true,
+            message: '表单填写错误',
+            type: 'error'
+          })
+          return false
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.edit-book  {
+  .el-input__inner {
+    text-align: left;
+  }
+}
+</style>

src/pages/system/library/books/index.vue

@@ -0,0 +1,19 @@
+<template>
+  <div class="mainPage">
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: '',
+  data () {
+    return {}
+  },
+  components: {}
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" scoped>
+</style>

src/pages/system/library/books/list.vue

@@ -0,0 +1,278 @@
+<template>
+  <div class="subPage" :style="{ padding: '20px' }">
+    <div>
+      <el-form inline>
+        <el-form-item label="案场">
+          <el-select v-model="caseId" size="medium" placeholder="请选择案场" @change="filterList">
+            <el-option
+              v-for="item in cases"
+              :key="item.CaseId"
+              :label="item.CaseName"
+              :value="item.CaseId"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="条码">
+          <el-input v-model="bookBarcode"></el-input>
+        </el-form-item>
+        <el-form-item label="书名">
+          <el-input v-model="bookName"></el-input>
+        </el-form-item>
+        <el-form-item :style="{ float: 'right' }">
+          <el-button type="primary" size="medium">搜索</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div>
+      <el-button plain @click="editBook()" size="medium">图书录入</el-button>
+      <el-button plain @click="showBatchInput()" size="medium">批量导入</el-button>
+      <el-button type="text" size="medium">点击下载导入模板</el-button>
+      <div :style="{ margin: '10px 0' }">
+        <el-table :data="list" border style="width: 100%">
+          <el-table-column label="图片" width="250">
+            <template slot-scope="scope">
+              <img width="150" :src="scope.row.BookImg" alt>
+            </template>
+          </el-table-column>
+          <el-table-column prop="BookBarcode" label="条码"></el-table-column>
+          <el-table-column prop="BookName" label="书名"></el-table-column>
+          <el-table-column label="案场">
+            <template slot-scope="scope">
+              <span>{{ getCaseName(scope.row.CaseId) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="分类">
+            <template slot-scope="scope">
+              <span>{{ getTypeName(scope.row.BookTypeId) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="价格">
+            <template slot-scope="scope">
+              <span>{{ formatPrice(scope.row.Price) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="BorrowDays" label="借阅(天)"></el-table-column>
+          <el-table-column prop="InStock" label="总数量"></el-table-column>
+          <el-table-column prop="LeftNum" label="借出"></el-table-column>
+          <el-table-column label="预约">
+            <template slot-scope="scope">
+              <span>{{ getReserveNum(scope.row) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="录入时间">
+            <template slot-scope="scope">
+              <span>{{ toolClass.dateFormat(scope.row.CreateDate) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column fixed="right" label="操作" width="150">
+            <template slot-scope="scope">
+              <div>
+                <el-button type="text" @click="changeStock(scope.row)" size="small">盘点</el-button>
+                <el-button @click="setRecommend(scope.row)" type="text" size="small">{{ scope.row.IsRecommend === 1 ? '取消推荐' : '设为推荐' }}</el-button>
+              </div>
+              <div>
+                <el-button @click="editBook(scope.row)" type="text" size="small">编辑</el-button>
+                <el-button @click="removeBook(scope.row)" type="text" size="small">删除</el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-pagination
+          layout="prev, pager, next"
+          :current-page="page"
+          :total="1000"
+          @current-change="pageChange"
+        ></el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers, mapState } from 'vuex'
+
+const { mapState: mapLibSate, mapActions } = createNamespacedHelpers('library')
+
+export default {
+  name: 'bookList',
+  data() {
+    return {
+      caseId: '',
+      bookBarcode: '',
+      bookName: '',
+      inputRef: window.document.createElement('input')
+    }
+  },
+  computed: {
+    ...mapState({
+      cases: x => x.app.cases.list,
+      defaultCase: x => x.app.cases.default,
+      orgid: x => x.app.user.OrgId
+    }),
+    ...mapLibSate({
+      list: s => s.list,
+      page: s => s.page,
+      types: s => s.type.list
+    })
+  },
+  created() {
+    this.inputRef.type = 'file'
+    // https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types
+    this.inputRef.accept = 'application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+    this.inputRef.addEventListener('change', this.importBatch.bind(this))
+
+    this.filterList()
+  },
+  methods: {
+    ...mapActions({
+      getList: 'getBookList',
+      getTypeList: 'getTypeList',
+      deleteBook: 'deleteBook',
+      setBookRecommend: 'setBookRecommend'
+    }),
+
+    // 查询过滤
+    filterList({ page = 0 } = {}) {
+      const caseId = this.caseId || this.defaultCase
+      this.getTypeList({ page: 0, pagesize: 1000, CaseId: caseId })
+
+      this.getList({
+        page,
+        CaseId: caseId,
+        BookBarcode: this.bookBarcode,
+        BookName: this.bookName
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    },
+
+    // 分页过滤
+    pageChange(page) {
+      this.filterList({ page })
+    },
+
+    // 删除图书
+    removeBook({ BookId: id }) {
+      this.$confirm('确认删除此数据?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.deleteBook({
+            BookId: id
+          })
+            .then(() => {
+              this.$message({
+                showClose: true,
+                message: '删除成功',
+                type: 'success'
+              })
+            })
+            .catch(err => {
+              this.$message({
+                showClose: true,
+                message: err,
+                type: 'error'
+              })
+            })
+        })
+        .catch(x => x)
+    },
+
+    // 跳转到编辑
+    editBook({ BookId: id } = {}) {
+      this.$router.push({ name: 'libraryEdit', params: { id } })
+    },
+
+    // 设为/取消推荐
+    setRecommend(book) {
+      const tipMsg = book.IsRecommend === 1 ? '确定取消推荐?' : '确认设置为推荐?'
+
+      this.$confirm(tipMsg, '提示', {
+        confirmButtonText: '是',
+        cancelButtonText: '否',
+        type: 'warning'
+      })
+        .then(() => {
+          this.setBookRecommend(book)
+            .then(() => {
+              this.$message({
+                showClose: true,
+                message: '设置成功',
+                type: 'success'
+              })
+            })
+            .catch(err => {
+              this.$message({
+                showClose: true,
+                message: err,
+                type: 'error'
+              })
+            })
+        })
+        .catch(x => x)
+    },
+
+    // 批量导入
+    showBatchInput() {
+      if (!this.caseId) {
+        this.$message({
+          showClose: true,
+          message: '请选择案场',
+          type: 'error'
+        })
+
+        return
+      }
+
+      this.$confirm('批量导入将可能有较长的耗时, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => this.inputRef.click())
+        .catch(x => x)
+    },
+    importBatch(e) {
+      // 需要指定案场
+      const caseName = this.getCaseName(this.caseId)
+
+      this.$confirm(`数据将被导入至【${caseName}】案场, 是否继续?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          // TODO
+          // const file = e.target.files[0];
+        })
+        .catch(x => x)
+    },
+
+    getCaseName(id) {
+      return (this.cases.filter(x => x.CaseId === id)[0] || {}).CaseName
+    },
+
+    getTypeName(id) {
+      return (this.types.filter(x => x.BookTypeId === id)[0] || {}).BookTypeName
+    },
+
+    formatPrice(price) {
+      return window.Number(price).toFixed(2)
+    },
+
+    getReserveNum({ InStock, LeftNum, BorrowNum } = {}) {
+      return InStock - LeftNum - BorrowNum
+    },
+
+    changeStock({ BookId: id }) {
+      this.$router.push({ name: 'stockChange', params: { id } })
+    },
+  }
+}
+</script>

src/pages/system/library/books/stockchange.vue

@@ -0,0 +1,137 @@
+<template>
+  <div class="subPage" :style="{ padding: '20px' }">
+    <div>
+      <el-form label-width="100px" >
+        <el-form-item label="名称" prop="BookName">
+          <el-input v-model="book.BookName" :style="{ width: '200px' }" :disabled="true"></el-input>
+        </el-form-item>
+        <el-form-item label="总库存" prop="InStockTotal">
+          <el-input v-model="book.InStockTotal" :style="{ width: '200px' }" :disabled="true"></el-input>
+        </el-form-item>
+        <el-form-item label="剩余库存" prop="InStockAfter">
+          <el-input-number v-model="formData.InStockAfter" :min="0" :style="{ width: '200px' }" ></el-input-number>
+        </el-form-item>
+        <el-form-item label="盘点备注" prop="ChangeReason">
+          <el-input type="textarea" rows="4" v-model="formData.ChangeReason" :style="{ width: '500px' }" ></el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div>
+      <div :style="{ margin: '10px 0' }">
+        <el-table :data="list" border style="width: 100%">
+          <el-table-column prop="InStockTotal" label="总库存"></el-table-column>
+          <el-table-column prop="InStockBefore" label="盘点前剩余库存"></el-table-column>
+          <el-table-column prop="InStockAfter" label="盘点后剩余库存"></el-table-column>
+          <el-table-column label="盘点时间">
+            <template slot-scope="scope">
+              <span>{{ toolClass.dateFormat(scope.row.ChangeDate) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="ChangeReason" label="盘点备注"></el-table-column>
+          <el-table-column prop="ChangeUserName" label="操作人"></el-table-column>
+        </el-table>
+        <el-pagination
+          layout="prev, pager, next"
+          :current-page="page"
+          :total="1000"
+          @current-change="pageChange">
+        </el-pagination>
+      </div>
+      <div>
+          <el-button type="primary" @click="submit()">保存</el-button>
+          <el-button @click="$router.back()">取消</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers, mapState } from 'vuex'
+
+const {
+  mapState: mapLibSate,
+  mapActions
+} = createNamespacedHelpers('library')
+
+export default {
+  name: 'stockChange',
+  data() {
+    return {
+      bookId: '',
+      formData: {},
+    }
+  },
+  computed: {
+    ...mapState({
+      cases: x => x.app.cases.list,
+      defaultCase: x => x.app.cases.default,
+      orgid: x => x.app.user.OrgId,
+    }),
+    ...mapLibSate({
+      book: s => s.detail,
+      list: s => s.stock.list,
+      page: s => s.stock.page,
+    })
+  },
+  created() {
+    this.bookId = this.$route.params.id
+    this.filterList()
+    this.getBook({ BookId: this.bookId }).then(() => {
+      this.formData = {
+        BookId: this.book.BookId,
+        InStockAfter: this.book.LeftNum,
+        CaseId: this.book.CaseId,
+        OrgId: this.book.OrgId,
+        ChangeReason: '',
+        InStockTotal: this.book.InStock,
+      }
+    }).catch((err) => {
+      this.$message({
+        showClose: true,
+        message: err,
+        type: 'error'
+      })
+    })
+  },
+  methods: {
+    ...mapActions({
+      getList: 'getStockList',
+      getBook: 'getBookDetail',
+      setChange: 'setStockChange',
+    }),
+
+    filterList({ page = 0 } = {}) {
+      this.getList({
+        page,
+        BookId: this.bookId
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    },
+
+    submit() {
+      this.setChange(this.formData).then(() => {
+        this.$message({
+          showClose: true,
+          message: '库存盘点成功',
+          type: 'success'
+        })
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    },
+
+    pageChange(page) {
+      this.filterList({ page })
+    },
+  }
+}
+</script>

src/pages/system/library/books/types/detail.vue

@@ -0,0 +1,177 @@
+<template>
+  <div class="subPage" :style="{ padding: '20px' }">
+    <el-form :model="formData" :rules="rules" ref="ruleForm" label-width="100px" :style="{ width: '600px' }">
+      <el-form-item label="案场" prop="CaseId">
+        <el-select v-model="formData.CaseId" placeholder="请选择案场">
+          <el-option
+            v-for="item in cases"
+            :key="item.CaseId"
+            :label="item.CaseName"
+            :value="item.CaseId"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="图片" prop="BookTypeImg">
+        <el-upload
+          class="avatar-uploader"
+          action=""
+          :show-file-list="false"
+          :on-success="uploadSuccess"
+          :before-upload="toolClass.beforeUpload"
+          :http-request="toolClass.upload"
+        >
+          <img v-if="formData.BookTypeImg" :src="formData.BookTypeImg + '?x-oss-process=style/compress-rotate'" class="avatar">
+          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+        </el-upload>
+      </el-form-item>
+      <el-form-item label="名称" prop="BookTypeName">
+        <el-input v-model="formData.BookTypeName" :style="{ width: '200px' }"></el-input>
+      </el-form-item>
+      <el-form-item :style="{ paddingTop: '40px' }">
+        <el-button type="primary" @click="submit()">立即创建</el-button>
+        <el-button @click="$router.back()">取消</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers, mapState } from 'vuex'
+
+const {
+  mapState: mapLibSate,
+  mapActions,
+  mapMutations
+} = createNamespacedHelpers('library')
+
+export default {
+  name: 'bookType',
+  data() {
+    return {
+      rules: {
+        BookTypeName: [
+          { required: true, message: '请输入分类名称', trigger: 'blur' },
+          { min: 1, max: 5, message: '长度在 1 到 5 个字符', trigger: 'blur' }
+        ],
+        BookTypeImg: [{ required: true, message: '请上传图片', trigger: 'change' }],
+        CaseId: [{ required: true, message: '请选择一个案场', trigger: 'change' }]
+      },
+      formData: {},
+    }
+  },
+  created() {
+    const id = this.$route.params.id
+    if (id) {
+      this.getInfo({
+        BookTypeId: id
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    }
+  },
+  computed: {
+    ...mapState({
+      cases: x => x.app.cases.list,
+      defaultCase: x => x.app.cases.default,
+      orgid: x => x.app.user.OrgId
+    }),
+    ...mapLibSate({
+      detail: s => s.type.detail,
+    }),
+    // formData: {
+    //   get: function() {
+    //     if (this.detail && this.detail.BookTypeId) {
+    //       return this.detail
+    //     }
+
+    //     return {
+    //       BookTypeId: '',
+    //       BookTypeName: '',
+    //       BookTypeImg: '',
+    //       CaseId: this.defaultCase,
+    //       OrgId: this.orgid,
+    //       Status: 1,
+    //       CreateDate: new Date()
+    //     }
+    //   },
+    //   set: function(val) {
+    //     console.log(val)
+    //     this.mergeDetail(val)
+    //   }
+    // }
+  },
+  watch: {
+    detail: {
+      handler (nv, ov) {
+        if (nv.BookTypeId === this.formData.BookTypeId) {
+          return
+        }
+
+        let CaseId = nv.CaseId
+        if (!CaseId) {
+          CaseId = this.defaultCase
+        }
+
+        this.formData = { ...nv, CaseId }
+        // this.mergeDetail(nv)
+      },
+      immediate: true,
+    },
+    formData: {
+      handler (nv) {
+        this.mergeDetail(nv)
+      },
+      deep: true,
+    },
+  },
+  methods: {
+    ...mapMutations({
+      mergeDetail: 'mergeTypeDetail'
+    }),
+    ...mapActions({
+      getInfo: 'getTypeDetail',
+      updateDetail: 'updateTypeDetail'
+    }),
+
+    uploadSuccess(res) {
+      this.formData.BookTypeImg = res.result.url
+    },
+
+    submit() {
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          this.updateDetail()
+            .then(() => {
+              this.$message({
+                showClose: true,
+                message: '更新或编辑分类成功',
+                type: 'success'
+              })
+            })
+            .catch(err => {
+              this.$message({
+                showClose: true,
+                message: err,
+                type: 'error'
+              })
+            })
+        } else {
+          this.$message({
+            showClose: true,
+            message: '表单填写错误',
+            type: 'error'
+          })
+          return false
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>

src/pages/system/library/books/types/list.vue

@@ -0,0 +1,139 @@
+<template>
+  <div class="subPage" :style="{ padding: '20px' }">
+    <div>
+      <el-form inline>
+        <el-form-item label="案场">
+          <el-select v-model="caseId" size="medium" placeholder="请选择案场" @change="filterList">
+            <el-option
+              v-for="item in cases"
+              :key="item.CaseId"
+              :label="item.CaseName"
+              :value="item.CaseId"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :style="{ float: 'right' }">
+          <el-button type="primary" size="medium">搜索</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div>
+      <el-button plain @click="editType()" size="medium">新增分类</el-button>
+      <div :style="{ margin: '10px 0' }">
+        <el-table :data="list" border style="width: 100%">
+          <el-table-column label="图片" width="250">
+            <template slot-scope="scope">
+              <img width="150" :src="scope.row.BookTypeImg" alt>
+            </template>
+          </el-table-column>
+          <el-table-column prop="BookTypeName" label="名称"></el-table-column>
+          <el-table-column label="案场" width="200">
+            <template slot-scope="scope">
+              <span>{{ getCaseName(scope.row.CaseId) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="Nums" label="图书数量"></el-table-column>
+          <el-table-column fixed="right" label="操作" width="150">
+            <template slot-scope="scope">
+              <el-button @click="editType(scope.row)" type="text" size="small">编辑</el-button>
+              <el-button @click="removeType(scope.row)" type="text" size="small">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-pagination
+          layout="prev, pager, next"
+          :current-page="page"
+          :total="1000"
+          @current-change="pageChange">
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers, mapState } from 'vuex'
+
+const {
+  mapState: mapLibSate,
+  mapActions
+} = createNamespacedHelpers('library')
+
+export default {
+  name: 'bookTypeList',
+  data() {
+    return {
+      caseId: ''
+    }
+  },
+  computed: {
+    ...mapState({
+      cases: x => x.app.cases.list,
+      defaultCase: x => x.app.cases.default,
+      orgid: x => x.app.user.OrgId,
+    }),
+    ...mapLibSate({
+      list: s => s.type.list,
+      page: s => s.type.page,
+    })
+  },
+  created() {
+    this.filterList()
+  },
+  methods: {
+    ...mapActions({
+      getList: 'getTypeList',
+      deleteType: 'deleteType'
+    }),
+
+    filterList({ page = 0 } = {}) {
+      this.getList({
+        page,
+        CaseId: this.caseId || this.defaultCase
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    },
+
+    pageChange(page) {
+      this.filterList({ page })
+    },
+
+    removeType({ BookTypeId: id }) {
+      this.$confirm('确认删除此数据?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.deleteType({
+          BookTypeId: id
+        }).then(() => {
+          this.$message({
+            showClose: true,
+            message: '删除成功',
+            type: 'success'
+          })
+        }).catch((err) => {
+          this.$message({
+            showClose: true,
+            message: err,
+            type: 'error'
+          })
+        })
+      }).catch(x => x)
+    },
+
+    editType({ BookTypeId: id } = {}) {
+      this.$router.push({ name: 'libraryTypeEdit', params: { id } })
+    },
+
+    getCaseName(id) {
+      return (this.cases.filter(x => x.CaseId === id)[0] || {}).CaseName
+    }
+  }
+}
+</script>

src/pages/system/library/borrow/bookreturn.vue

@@ -0,0 +1,178 @@
+<template>
+  <div class="subPage edit-book" :style="{ padding: '20px' }">
+    <div v-if="active">
+      <el-form>
+        <el-form-item>
+          <el-input v-model="customerInfo" placeholder="会员手机号或条形码" :style="{ width: '200px' }"></el-input>
+        </el-form-item>
+        <el-form-item :style="{ paddingTop: '20px' }">
+          <el-button type="primary" @click="nextStep()">下一步</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div v-else>
+
+      <!-- 用户信息区 -->
+      <el-form label-width="100px">
+        <el-form-item label="姓名">
+          <span>{{ borrowHistory.CustomerName }}</span>
+        </el-form-item>
+        <el-form-item label="手机号">
+          <span>{{ borrowHistory.CustomerPhone }}</span>
+        </el-form-item>
+        <el-form-item label="在借数量">
+          <span>{{ borrowHistory.CustomerPhone }}</span>
+        </el-form-item>
+        <el-form-item label="逾期数量">
+          <span>{{ borrowHistory.CustomerPhone }}</span>
+        </el-form-item>
+        <el-form-item label="历史是否有逾期">
+          <span>{{ borrowHistory.CustomerPhone === 1 ? '是' : '否' }}</span>
+        </el-form-item>
+      </el-form>
+
+      <!-- 过滤条件 -->
+      <el-form inline>
+        <el-form-item label="条形码">
+          <el-input v-model="formData.BookBarcode" :style="{ width: '200px' }" :disabled="true"></el-input>
+        </el-form-item>
+        <el-form-item label="书名" prop="BookName">
+          <el-input v-model="formData.BookName" :style="{ width: '200px' }"></el-input>
+        </el-form-item>
+        <el-form-item :style="{ float: 'right' }">
+          <el-button type="primary" @click="search()">搜索</el-button>
+        </el-form-item>
+      </el-form>
+
+      <!-- 可借阅列表 -->
+      <el-table :data="list" border style="width: 100%">
+        <el-table-column prop="BookBarcode" label="条形码"></el-table-column>
+        <el-table-column prop="BookName" label="书名"></el-table-column>
+        <el-table-column prop="BookTypeName" label="分类"></el-table-column>
+        <el-table-column prop="ReturnDate" label="规定归还日期"></el-table-column>
+        <el-table-column prop="LeftNum" label="逾期天数"></el-table-column>
+      </el-table>
+
+      <div :style="{ paddingTop: '40px' }">
+        <el-button type="primary" @click="submit()">立即借阅</el-button>
+        <el-button @click="$router.back()">取消</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers, mapState } from 'vuex'
+
+const {
+  mapState: mapLibSate,
+  mapActions,
+} = createNamespacedHelpers('library')
+
+export default {
+  name: 'bookReturn',
+  data() {
+    return {
+      active: 0,
+      customerInfo: '',
+      borrowHistory: {},
+      formData: {},
+      selectList: [],
+    }
+  },
+  created() {
+    const id = this.$route.params.id
+    if (id) {
+      this.active = 1
+
+      this.getInfo({
+        BookId: id
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    } else {
+      this.active = 0
+    }
+  },
+  computed: {
+    ...mapState({
+      cases: x => x.app.cases.list,
+      defaultCase: x => x.app.cases.default,
+      orgid: x => x.app.user.OrgId
+    }),
+    ...mapLibSate({
+      list: s => s.borrow.list,
+      borrowHistory: s => s.borrow.history,
+    }),
+  },
+  methods: {
+    ...mapActions({
+      getBorrowHistory: 'getBorrowHistory',
+      getList: 'getBorrowList',
+      borrowBooks: 'borrowBooks'
+    }),
+
+    nextStep() {
+      if (!this.customerInfo) {
+        this.$message({
+          showClose: true,
+          message: '请录入会员手机号或条形码',
+          type: 'error'
+        })
+        return
+      }
+
+      this.getBorrowHistory({ customerInfo: this.customerInfo }).then(() => {
+        this.active = 1
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    },
+
+    search() {
+      this.getBorrowList(this.formData).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    },
+
+    submit() {
+      this.$confirm('确定借阅此书?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.borrowBooks(this.selectList).then(() => {
+            this.$message({
+              showClose: true,
+              message: '借阅成功',
+              type: 'success'
+            })
+          }).catch(err => {
+            this.$message({
+              showClose: true,
+              message: err,
+              type: 'error'
+            })
+          })
+        })
+        .catch(x => x)
+    },
+  }
+}
+</script>
+
+<style lang="scss">
+</style>

src/pages/system/library/borrow/borrow.vue

@@ -0,0 +1,182 @@
+<template>
+  <div class="subPage edit-book" :style="{ padding: '20px' }">
+    <div v-if="active">
+      <el-form>
+        <el-form-item>
+          <el-input v-model="customerInfo" placeholder="会员手机号或条形码" :style="{ width: '200px' }"></el-input>
+        </el-form-item>
+        <el-form-item :style="{ paddingTop: '20px' }">
+          <el-button type="primary" @click="nextStep()">下一步</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div v-else>
+
+      <!-- 用户信息区 -->
+      <el-form label-width="100px">
+        <el-form-item label="姓名">
+          <span>{{ borrowHistory.CustomerName }}</span>
+        </el-form-item>
+        <el-form-item label="手机号">
+          <span>{{ borrowHistory.CustomerPhone }}</span>
+        </el-form-item>
+        <el-form-item label="在借数量">
+          <span>{{ borrowHistory.CustomerPhone }}</span>
+        </el-form-item>
+        <el-form-item label="逾期数量">
+          <span>{{ borrowHistory.CustomerPhone }}</span>
+        </el-form-item>
+        <el-form-item label="历史是否有逾期">
+          <span>{{ borrowHistory.CustomerPhone === 1 ? '是' : '否' }}</span>
+        </el-form-item>
+      </el-form>
+
+      <!-- 过滤条件 -->
+      <el-form inline>
+        <el-form-item label="条形码">
+          <el-input v-model="formData.BookBarcode" :style="{ width: '200px' }" :disabled="true"></el-input>
+        </el-form-item>
+        <el-form-item label="书名" prop="BookName">
+          <el-input v-model="formData.BookName" :style="{ width: '200px' }"></el-input>
+        </el-form-item>
+        <el-form-item :style="{ float: 'right' }">
+          <el-button type="primary" @click="search()">搜索</el-button>
+        </el-form-item>
+      </el-form>
+
+      <!-- 可借阅列表 -->
+      <el-table :data="list" border style="width: 100%" @selection-change="x => selectList = x">
+        <el-table-column
+          type="selection"
+          width="55">
+        </el-table-column>
+        <el-table-column prop="BookBarcode" label="条形码"></el-table-column>
+        <el-table-column prop="BookName" label="书名"></el-table-column>
+        <el-table-column prop="BookTypeName" label="分类"></el-table-column>
+        <el-table-column prop="LeftNum" label="可借数量"></el-table-column>
+        <el-table-column prop="BorrowDays" label="规定借阅天数"></el-table-column>
+      </el-table>
+
+      <div :style="{ paddingTop: '40px' }">
+        <el-button type="primary" @click="submit()">立即借阅</el-button>
+        <el-button @click="$router.back()">取消</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers, mapState } from 'vuex'
+
+const {
+  mapState: mapLibSate,
+  mapActions,
+} = createNamespacedHelpers('library')
+
+export default {
+  name: 'bookBorrow',
+  data() {
+    return {
+      active: 0,
+      customerInfo: '',
+      borrowHistory: {},
+      formData: {},
+      selectList: [],
+    }
+  },
+  created() {
+    const id = this.$route.params.id
+    if (id) {
+      this.active = 1
+
+      this.getInfo({
+        BookId: id
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    } else {
+      this.active = 0
+    }
+  },
+  computed: {
+    ...mapState({
+      cases: x => x.app.cases.list,
+      defaultCase: x => x.app.cases.default,
+      orgid: x => x.app.user.OrgId
+    }),
+    ...mapLibSate({
+      list: s => s.borrow.list,
+      borrowHistory: s => s.borrow.history,
+    }),
+  },
+  methods: {
+    ...mapActions({
+      getBorrowHistory: 'getBorrowHistory',
+      getList: 'getBorrowList',
+      borrowBooks: 'borrowBooks'
+    }),
+
+    nextStep() {
+      if (!this.customerInfo) {
+        this.$message({
+          showClose: true,
+          message: '请录入会员手机号或条形码',
+          type: 'error'
+        })
+        return
+      }
+
+      this.getBorrowHistory({ customerInfo: this.customerInfo }).then(() => {
+        this.active = 1
+      }).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    },
+
+    search() {
+      this.getBorrowList(this.formData).catch(err => {
+        this.$message({
+          showClose: true,
+          message: err,
+          type: 'error'
+        })
+      })
+    },
+
+    submit() {
+      this.$confirm('确定借阅此书?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.borrowBooks(this.selectList).then(() => {
+            this.$message({
+              showClose: true,
+              message: '借阅成功',
+              type: 'success'
+            })
+          }).catch(err => {
+            this.$message({
+              showClose: true,
+              message: err,
+              type: 'error'
+            })
+          })
+        })
+        .catch(x => x)
+    },
+  }
+}
+</script>
+
+<style lang="scss">
+</style>

src/pages/system/library/borrow/index.vue

@@ -0,0 +1,19 @@
+<template>
+  <div class="mainPage">
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: '',
+  data () {
+    return {}
+  },
+  components: {}
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" scoped>
+</style>

src/pages/system/library/index.vue

@@ -0,0 +1,19 @@
+<template>
+  <div class="mainPage">
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: '',
+  data () {
+    return {}
+  },
+  components: {}
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" scoped>
+</style>

src/pages/system/page.js

@@ -135,6 +135,16 @@ import luckyDrawManager from './luckyDrawManager/index' // 抽奖管理
 import luckyDrawList from './luckyDrawManager/luckyDrawList/index' // 抽奖记录列表
 import luckyDrawShareList from './luckyDrawManager/luckyDrawShareList/index' // 抽奖分享记录列表
 
+import LibraryManager from './library/books' // 图书管理
+import LibraryTypeList from './library/books/types/list' // 图书分类
+import LibraryTypeEdit from './library/books/types/detail' // 分类编辑
+import LibraryList from './library/books/list' // 图书列表
+import LibraryEdit from './library/books/detail' // 图书编辑
+import StockChange from './library/books/stockchange' // 图书编辑
+
+import BorrowManager from './library/borrow' // 借阅管理
+import BorrowBooks from './library/borrow/borrow' // 借阅管理
+
 export default {
   router: [
     {
@@ -726,6 +736,46 @@ export default {
           component: luckyDrawShareList,
           children: []
         }],
+      }, { // 图书管理
+        path: 'library',
+        name: 'library',
+        component: LibraryManager,
+        children: [{ // 分类
+          path: 'type-manager',
+          name: 'libraryType',
+          component: LibraryTypeList,
+          children: []
+        }, { // 分类管理
+          path: 'type/:id?',
+          name: 'libraryTypeEdit',
+          component: LibraryTypeEdit,
+          children: []
+        }, { // 图书列表
+          path: 'book-manage',
+          name: 'libraryList',
+          component: LibraryList,
+          children: []
+        },{ // 图书编辑
+          path: 'book/:id?',
+          name: 'libraryEdit',
+          component: LibraryEdit,
+          children: []
+        },{ // 库存盘点
+          path: 'stock/:id',
+          name: 'stockChange',
+          component: StockChange,
+          children: []
+        }],
+      },{ // 借阅管理
+        path: 'borrow',
+        name: 'borrow',
+        component: BorrowManager,
+        children: [{ // 图书借阅
+          path: 'books',
+          name: 'borrowBooks',
+          component: BorrowBooks,
+          children: []
+        }]
       }]
     },
   ],

src/store/index.js

@@ -41,6 +41,7 @@ export const modules = {
   activityLuckDraw: () => require('./activityManager/luckDraw').default,
   activityFlashbuy: () => require('./activityManager/flashbuy').default,
   calendar: () => require('./activityManager/calendar').default,
+  library: () => require('./library').default,
 }
 
 Object.keys(modules).forEach((modKey) => {

src/store/library/index.js

@@ -0,0 +1,149 @@
+// import ajax from '../../util/ajax'
+// import api from '../../util/api'
+
+export default {
+  namespaced: true,
+
+  state: {
+    page: 0,
+    list: [
+      {
+        BookId: '1',
+        BookTypeId: '1',
+        BookName: '遮天',
+        BookBarcode: '123456',
+        BookImg: 'http://jingcheng-resourceplat.oss-cn-shanghai.aliyuncs.com/upload/135230460466.png',
+        Author: '辰东',
+        Publisher: '南京出版社',
+        Price: 90.00,
+        InStock: 10,
+        LeftNum: 2,
+        BorrowNum: 5,
+        BorrowDays: 7,
+        BookDescription: '《遮天》是一部古典仙侠类型的网络小说',
+        CaseId: '1',
+        OrgId: '1',
+        CreateDate: new Date(),
+        IsRecommend: 1,
+        Status: 1,
+      },
+    ],
+    detail: {},
+    type: {
+      page: 0,
+      list: [
+        {
+          BookTypeId: '1',
+          BookTypeName: '测试',
+          BookTypeImg: 'http://jingcheng-resourceplat.oss-cn-shanghai.aliyuncs.com/upload/135230460466.png',
+          CaseId: '1',
+          OrgId: '1',
+          Nums: 100,
+          Status: 1,
+          CreateDate: new Date()
+        }
+      ],
+      detail: {
+        BookTypeId: '',
+        BookTypeName: '',
+        BookTypeImg: '',
+        CaseId: '',
+        OrgId: '1',
+        Status: 1,
+        CreateDate: new Date()},
+    },
+    stock: {
+      list: [
+        {
+          RecordId: '1',
+          BookId: '1',
+          InStockTotal: 20,
+          InStockBefore: 8,
+          InStockAfter: 10,
+          ChangeReason: '补库存',
+          ChangeDate: new Date(),
+          ChangeUser: '1',
+          ChangeUserName: 'admin',
+          CaseId: '1',
+          OrgId: '1',
+        }
+      ],
+      detail: {},
+    },
+    borrow: {
+      list: [],
+      history: {},
+    },
+    bookReturn: {
+      list: [],
+    },
+  },
+  mutations: {
+    mergeTypeDetail(state, payload) {
+      state.type.detail = payload || {}
+
+      if (payload && payload.BookTypeId) {
+        state.type.list = (state.type.list || []).map(x => x.BookTypeId === payload.BookTypeId ? payload : x)
+      }
+    },
+    mergeBookDetail(state, payload) {
+      state.detail = payload || {}
+
+      if (payload && payload.BookId) {
+        state.list = (state.list || []).map(x => x.BookId === payload.BookId ? payload : x)
+      }
+    },
+  },
+  actions: {
+    getTypeList({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+    getTypeDetail({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+    updateTypeDetail({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+    deleteType({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+    getBookList({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+    getBookDetail({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+    updateBookDetail({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+    deleteBook({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+    setBookRecommend({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+    getStockList({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+
+      })
+    },
+  },
+}