成交记录

src/api/business/category.js

@@ -61,3 +61,28 @@ export function getCategory(query) {
     params: query
   })
 }
+// 获取成交记录
+export function getDealRecord(query) {
+  return request({
+    url: '/bidrecord/list',
+    method: 'get',
+    params: query
+  })
+}
+// 添加成交记录
+export function addDealRecord(data) {
+  return request({
+    url: '/bidrecord/add',
+    method: 'post',
+    data
+  })
+}
+// 删除成交记录
+export function deleteDealRecord(data) {
+  return request({
+    url: '/bidrecord/delete',
+    method: 'post',
+    data
+  })
+}
+

src/router/index.js

@@ -162,7 +162,7 @@ export const asyncRouterMap = [
         component: () => import('@/views/mall/category'),
         name: 'category',
         meta: {
-          perms: ['GET /admin/category/list', 'POST /admin/category/create', 'GET /admin/category/read', 'POST /admin/category/update', 'POST /admin/category/delete'],
+          perms: ['GET /admin/category/list', 'POST /admin/category/create', 'GET /admin/category/read', 'POST /admin/category/update', 'POST /admin/category/delete', 'POST /admin/category/getSubCategory', 'POST /admin/bidrecord/list'],
           title: '钱币分类',
           icon: 'list',
           noCache: true
@@ -201,6 +201,18 @@ export const asyncRouterMap = [
           noCache: true
         },
         hidden: true
+      },
+      {
+        path: 'dealRecord',
+        component: () => import('@/views/mall/dealRecord'),
+        name: 'goodsDealRecord',
+        meta: {
+          perms: [],
+          title: '钱币成交记录',
+          icon: 'form',
+          noCache: true
+        },
+        hidden: true
       }
     ]
   },

src/styles/index.scss

@@ -211,6 +211,9 @@ aside {
 .f-jc-s{
   justify-content: start;
 }
+.f-fw-w{
+  flex-wrap: wrap;
+}
 .ml10 {
   margin-left: 10px;
 }

src/views/mall/category.vue

@@ -26,7 +26,7 @@
             <el-button v-if="!scope.row.leaf" type="" size="medium" @click="handleChild(scope.row)">查看子类目</el-button>
           </i>
           <i v-permission="['POST /admin/category/getSubCategory']">
-            <el-button v-if="scope.row.leaf" type="" size="medium" @click="handleCreate(scope.row)">成交记录</el-button>
+            <el-button v-if="scope.row.leaf" type="" size="medium" @click="handleDealRecord(scope.row)">成交记录</el-button>
           </i>
         </template>
       </el-table-column>
@@ -238,6 +238,10 @@ export default {
     this.getAllCategories(0)
   },
   methods: {
+    // 成交记录
+    handleDealRecord(row) {
+      this.$router.push({ path: '/goods/dealRecord', query: { id: row.id }})
+    },
     onBack() {
       this.activeLevel--
       this.categoryList.length = this.categoryList.length - 1

src/views/mall/dealRecord.vue

+<template>
+  <div class="app-container">
+    <div class="page__header flex f-ai-c f-jc-sb">
+      <el-button type="primary" size="mini" class="mr10" @click="onBack">返回</el-button>
+      <el-button type="danger" size="mini" class="mr10" @click="onAdd">添加记录</el-button>
+    </div>
+    <el-table v-loading="listLoading" :data="dataList" size="small" element-loading-text="正在查询中。。。" border fit highlight-current-row>
+      <el-table-column align="center" label="ID" prop="id"/>
+      <el-table-column align="center" label="购买平台" prop="platform"/>
+      <el-table-column align="center" label="图片" width="120px">
+        <template slot-scope="scope">
+          <img v-if="scope.row.icon" :src="scope.row.icon" class="row-img">
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="成交价格" prop="price"/>
+      <el-table-column align="center" label="成交时间" prop="bidtime"/>
+      <el-table-column align="left" label="操作" width="450" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button v-permission="['POST /admin/category/delete']" type="danger" size="medium" @click="handleDelete(scope.row)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 添加或修改对话框 -->
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="600px">
+      <el-form ref="dataForm" :rules="rules" :model="dataForm" status-icon label-position="left" label-width="100px" style="width: 400px; margin-left:50px;">
+        <el-form-item label="购买平台" prop="platform">
+          <el-input v-model="dataForm.platform"/>
+        </el-form-item>
+        <el-form-item label="成交价格" prop="price">
+          <el-input v-model="dataForm.price"/>
+        </el-form-item>
+        <el-form-item label="成交记录id" prop="id">
+          <el-input v-model="dataForm.id"/>
+        </el-form-item>
+        <el-form-item label="成交时间" prop="bidtime">
+          <!-- <el-input v-model="dataForm.bidtime"/> -->
+          <el-date-picker
+            v-model="dataForm.bidtime"
+            :picker-options="pickerOptions"
+            style="width:300px"
+            type="datetime"
+            value-format="timestamp"
+            placeholder="选择日期时间"/>
+        </el-form-item>
+        <el-form-item label="购买人" prop="buyer">
+          <el-input v-model="dataForm.buyer"/>
+        </el-form-item>
+        <el-form-item label="图片" prop="icon">
+          <el-upload
+            :headers="headers"
+            :action="uploadPath"
+            :show-file-list="false"
+            :on-success="uploadIconUrl"
+            :on-remove="handleRemove"
+            :on-exceed="uploadOverrun"
+            :multiple="true"
+            :limit="5"
+            class="avatar-uploader"
+            accept=".jpg,.jpeg,.png,.gif">
+            <div v-if="dataForm.images && dataForm.images.length" class="flex f-ai-c f-fw-w" style="width:420px">
+              <img v-for="(item,index) in dataForm.images" :src="item" :key="index" class="avatar">
+            </div>
+            <i v-else class="el-icon-plus avatar-uploader-icon"/>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogFormVisible = false">取消</el-button>
+        <el-button v-if="dialogStatus=='create'" type="primary" @click="createData">确定</el-button>
+      </div>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+import { getDealRecord, addDealRecord, deleteDealRecord } from '@/api/business/category'
+import { getToken } from '@/utils/auth'
+import { uploadPath } from '@/api/business/storage'
+
+export default {
+  name: 'Category',
+  components: { },
+  data() {
+    return {
+      uploadPath,
+      dataForm: {
+        images: []
+      },
+      dialogFormVisible: false,
+      dialogStatus: '',
+      textMap: {
+        create: '创建'
+      },
+      rules: {
+        price: [
+          { required: true, message: '请输入成交价格', trigger: 'blur' },
+          {
+            pattern: /^[1-9]\d*$/,
+            message:
+              '格式不正确，请输入正整数！'
+          }],
+        bidtime: [{ required: true, message: '请输入成交时间', trigger: 'blur' }]
+      },
+      dataList: [],
+      rowId: '',
+      pickerOptions: {
+        disabledDate(v) {
+          const time = v.getTime()
+          return time > Date.now()
+        }
+      }
+    }
+  },
+  computed: {
+    headers() {
+      return {
+        'X-Dts-Admin-Token': getToken()
+      }
+    }
+  },
+  created() {
+    if (this.$route.query && this.$route.query.id) {
+      this.rowId = this.$route.query.id
+      this.getList()
+    } else {
+      return this.$message.error('获取ID有误，请重试！')
+    }
+  },
+  methods: {
+    uploadOverrun() {
+      this.$message({
+        type: 'error',
+        message: '上传文件个数超出限制!最多上传5张图片!'
+      })
+    },
+    onBack() {
+      this.$router.back()
+    },
+    getList() {
+      this.listLoading = true
+      const data = {
+        cid: this.rowId
+      }
+      getDealRecord(data).then(res => {
+        if (res && res.data && res.data.data) {
+          this.dataList = res.data.data
+        }
+        this.listLoading = false
+      }).catch(() => {
+        this.dataList = []
+        this.listLoading = false
+      })
+    },
+    resetForm() {
+      this.dataForm = {
+        images: []
+      }
+    },
+    onAdd() {
+      this.resetForm()
+      this.dialogStatus = 'create'
+      this.dialogFormVisible = true
+      this.$nextTick(() => {
+        this.$refs['dataForm'].clearValidate()
+      })
+    },
+    createData() {
+      this.$refs['dataForm'].validate(valid => {
+        if (valid) {
+          const data = Object.assign({
+            cid: this.rowId - 0
+          }, this.dataForm)
+          data.bidtime = data.bidtime / 1000
+          data.price = data.price - 0
+          data.id = data.id - 0
+          addDealRecord(data).then((res) => {
+            this.dialogStatus = ''
+            this.dialogFormVisible = false
+            this.getList()
+          }).catch((err) => {
+            console.log('err: ', err)
+          })
+        }
+      })
+    },
+    uploadIconUrl: function(response) {
+      if (!this.dataForm.images) {
+        this.dataForm.images = []
+      }
+      this.dataForm.images.push(response.data.url)
+      this.$forceUpdate()
+    },
+    handleRemove: function(file, fileList) {
+      for (var i = 0; i < this.dataForm.images.length; i++) {
+        var url
+        if (file.response === undefined) {
+          url = file.url
+        } else {
+          url = file.response.data.url
+        }
+        if (this.dataForm.images[i] === url) {
+          this.dataForm.images.splice(i, 1)
+        }
+      }
+    },
+    handleDelete(row) {
+      const data = {
+        id: row.id
+      }
+      deleteDealRecord(data).then(() => {
+        this.$notify.success({
+          title: '成功',
+          message: '删除成功'
+        })
+        location.reload()
+      }).catch(response => {
+        this.$notify.error({
+          title: '失败',
+          message: response.data.errmsg
+        })
+      })
+    }
+  }
+}
+</script>
+<style scoped>
+.avatar-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+  margin-right: 5px;
+}
+.avatar-uploader .el-upload:hover {
+  border-color: #20a0ff;
+}
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 120px;
+  height: 120px;
+  line-height: 120px;
+  text-align: center;
+}
+.avatar {
+  width: 145px;
+  height: 145px;
+  display: block;
+  margin: 0 10px 10px 0;
+}
+
+.row-img {
+  width: 100px;
+  height: 100px;
+  display: block;
+}
+.page__header {
+  padding: 0 0 10px;
+}
+.page__header--text {
+  font-weight: 500;
+  font-size: 16px;
+}
+</style>