feats

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

           <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-select v-model="formData.CaseId" placeholder="请选择案场" @change="filterTypes">
             <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>
     if (id) {
       this.active = 1
 
-      this.getInfo({
-        BookId: id
+      this.getInfo({ id }).then((x) => {
+        this.filterTypes(x.CaseId)
       }).catch(err => {
         this.$message({
           showClose: true,
   watch: {
     detail: {
       handler (nv, ov) {
+        console.log(nv)
         if (nv.BookId === this.formData.BookId) {
           return
         }
       },
       immediate: true,
     },
-    formData: {
-      handler (nv) {
-        this.mergeDetail(nv)
-      },
-      deep: true,
-    },
+    // formData: {
+    //   handler (nv) {
+    //     console.log('----------', nv)
+    //     this.bookImg = nv.BookImg
+    //   },
+    //   deep: true,
+    // },
   },
   methods: {
     ...mapMutations({
     },
 
     uploadSuccess(res) {
-      this.formData.BookImg = res.result.url
+      this.$set(this.formData, 'BookImg', res.result.url)
+      // this.formData.BookImg = res.result.url
     },
 
     filterTypes(val) {
-      const CaseId = val
-      this.getTypeList({ page: 0, CaseId, pagesize: 10000 })
+      this.getTypeList({ page: 0, caseid: val, pagesize: 10000 })
     },
 
     submit() {
       this.$refs.ruleForm.validate(valid => {
         if (valid) {
-          this.updateDetail()
+          if (!this.formData.Price) {
+            this.formData.Price = 0
+          }
+
+          this.updateDetail(this.formData)
             .then(() => {
               this.$message({
                 showClose: true,

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

     </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>
+      <el-button plain @click="showDialog = true" size="medium">批量导入</el-button>
       <div :style="{ margin: '10px 0' }">
         <el-table :data="list" border style="width: 100%">
           <el-table-column label="图片" width="128">
         ></el-pagination>
       </div>
     </div>
+    <el-dialog
+      title="批量导入"
+      :visible.sync="showDialog"
+      width="50%">
+      <div :style="{ margin: 'auto', width: '80%' }">
+        <div><el-button @click="showBatchInput" :style="{ width: '100%' }">上传文件</el-button></div>
+        <div><el-button type="text" size="medium" :style="{ float: 'right' }">下载导入模板</el-button></div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="showDialog = false">确 定</el-button>
+        <el-button @click="showDialog = false">取 消</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
       caseId: '',
       bookBarcode: '',
       bookName: '',
-      inputRef: window.document.createElement('input')
+      inputRef: window.document.createElement('input'),
+      showDialog: false,
     }
   },
   computed: {
       getList: 'getBookList',
       getTypeList: 'getTypeList',
       deleteBook: 'deleteBook',
-      setBookRecommend: 'setBookRecommend'
+      setBookRecommend: 'updateBookDetail',
+      batchImport: 'batchImport',
     }),
 
     // 查询过滤
     // 设为/取消推荐
     setRecommend(book) {
       const tipMsg = book.IsRecommend === 1 ? '确定取消推荐?' : '确认设置为推荐?'
+      book.IsRecommend = Math.abs(book.IsRecommend - 1)
 
       this.$confirm(tipMsg, '提示', {
         confirmButtonText: '是',
     importBatch(e) {
       // 需要指定案场
       const caseName = this.getCaseName(this.caseId)
+      const file = e.target.files[0]
+      if (!file) {
+        this.$message({
+          showClose: true,
+          message: '请选择导入文件',
+          type: 'error'
+        })
+      }
 
       this.$confirm(`数据将被导入至【${caseName}】案场, 是否继续?`, '提示', {
         confirmButtonText: '确定',
         type: 'warning'
       })
         .then(() => {
-          // TODO
-          // const file = e.target.files[0];
+          const data = {
+            caseId: this.caseId,
+            excel: file,
+          }
+
+          this.batchImport(data).then(() => {
+            this.$confirm(`数据导入完成, 点击【确定】刷新页面`, '提示', {
+              confirmButtonText: '确定',
+              cancelButtonText: '取消',
+              type: 'warning'
+            }).then(() => {
+              window.location.reload()
+            })
+          }).catch((err) => {
+            this.$message({
+              showClose: true,
+              message: err,
+              type: 'error'
+            })
+          })
+
+          // const loading = this.$loading({
+          //   lock: true,
+          //   text: '数据导入中, 可能耗时较长, 请稍后 ...',
+          // })
+
+          // window.setTimeout(() => loading.close(), 2000)
         })
         .catch(x => x)
     },

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

       },
       immediate: true,
     },
-    formData: {
-      handler (nv) {
-        this.mergeDetail(nv)
-      },
-      deep: true,
-    },
+    // formData: {
+    //   handler (nv) {
+    //     this.mergeDetail(nv)
+    //   },
+    //   deep: true,
+    // },
   },
   methods: {
     ...mapMutations({
     }),
 
     uploadSuccess(res) {
-      this.formData.BookTypeImg = res.result.url
+      this.$set(this.formData, 'BookTypeImg', res.result.url)
+      // this.formData.BookTypeImg = res.result.url
     },
 
     submit() {

src/store/library/index.js

       }
     },
     deleteTypeList (state, payload = {}) {
-      state.type.list = state.type.list.filter(x => x.BookTypeId === payload.BookTypeId)
+      state.type.list = state.type.list.filter(x => x.BookTypeId !== payload.BookTypeId)
     },
     setBookList (state, payload) {
       const { list, pagenum } = payload || {}
         state.pagenum = 0
       }
     },
+    deleteBookList (state, payload = {}) {
+      state.list = state.list.filter(x => x.BookId !== payload.BookId)
+    },
   },
   actions: {
     getBorrowList ({ commit }, payload) { // 获取借阅记录
     updateTypeDetail ({ commit }, payload = {}) {
       return new Promise((resolve, reject) => {
         const id = payload.BookTypeId
-
         payload.CreateDate = ''
 
-        if (!id) {
-          ajax({
-            ...api.bookType.save,
-            data: payload,
-          }).then((x) => {
-            commit('mergeTypeDetail', x)
-            resolve(x)
-          })
-            .catch(({ message }) => reject(message))
-        } else {
-          ajax({
-            ...api.bookType.update,
-            data: payload,
-          }).then((x) => {
-            commit('mergeTypeDetail', x)
-            resolve(x)
-          })
-            .catch(({ message }) => reject(message))
-        }
+        const apiConf = !id ? api.bookType.save : api.bookType.update
+        ajax({
+          ...apiConf,
+          data: payload,
+        }).then((x) => {
+          commit('mergeTypeDetail', x)
+          resolve(x)
+        })
+          .catch(({ message }) => reject(message))
       })
     },
     deleteType ({ commit }, payload) {
           .catch((err) => console.log(err) && reject(err.message))
       })
     },
-    getBookDetail ({ commit }, payload) {
+    getBookDetail ({ commit }, payload = {}) {
       return new Promise((resolve, reject) => {
-
+        ajax({
+          ...api.book.detail,
+          urlData: { ...payload },
+        }).then((x) => {
+          commit('mergeBookDetail', x)
+          resolve(x)
+        })
+          .catch(({ message }) => reject(message))
       })
     },
-    updateBookDetail ({ commit }, payload) {
+    updateBookDetail ({ commit }, payload = {}) {
       return new Promise((resolve, reject) => {
+        const id = payload.BookId
 
+        const apiConf = !id ? api.book.save : api.book.update
+        ajax({
+          ...apiConf,
+          data: payload,
+        }).then((x) => {
+          commit('mergeBookDetail', x)
+          resolve(x)
+        })
+          .catch(({ message }) => reject(message))
       })
     },
-    deleteBook ({ commit }, payload) {
+    deleteBook ({ commit }, payload = {}) {
       return new Promise((resolve, reject) => {
-
+        ajax({
+          ...api.book.delete,
+          urlData: { id: payload.BookId },
+        }).then((x) => {
+          commit('deleteBookList', payload)
+          resolve(x)
+        })
+          .catch(({ message }) => reject(message))
       })
     },
-    setBookRecommend ({ commit }, payload) {
+    getStockList ({ commit }, payload) {
       return new Promise((resolve, reject) => {
 
       })
     },
-    getStockList ({ commit }, payload) {
+    batchImport(_, payload) {
       return new Promise((resolve, reject) => {
-
+        ajax({
+          ...api.book.import,
+          data: payload,
+        }).then(() => {
+          resolve()
+        })
+          .catch(({ message }) => reject(message))
       })
-    },
+    }
   },
 }

src/util/api.js

       url: `${baseUrl}${common}/book`
     },
     update: {
-      method: 'post',
+      method: 'put',
       url: `${baseUrl}${common}/book`
     },
     delete: {
       method: 'delete',
       url: `${baseUrl}${common}/book/:id`
     },
+    import: {
+      method: 'post',
+      url: `${baseUrl}${common}/book/excel`
+    },
   },
 }
 export default $api