feat: #三个页面暂时对接接口

README.md

@@ -91,3 +91,7 @@ Copyright (c) 2017-present PanJiaChen
 1. 后台前端需要重置标准表格宽度
 2. 后台前端富文本需要 px 转换 rem
 3. 后台后端列表需要 sort 排序
+4. 活动管理需要场景组件
+5. 数据字典组件
+6. 上传位置 幼儿园活动组件
+7. 暂时停止批量编辑

src/api/photoWarehouse/index.js

@@ -0,0 +1,18 @@
+import api from '@/utils/request';
+
+export const getList = params =>
+	api.post(`/yxl-back-end/admin/photo-warehouse/page`, params);
+export const getItem = ({ id, ...params }) =>
+	api.get(`/yxl-back-end/admin/photo-warehouse/${id}`, params);
+export const saveItem = ({ id, ...params }) => {
+	if (id) {
+		// return api.put(`/yxl-back-end/admin/activity/${id}`, params);
+	} else {
+		return api.post(`/yxl-back-end/admin/photo-warehouse/save`, params);
+	}
+};
+export const delItem = ({ id, ...params }) =>
+	api.del(`/yxl-back-end/admin/photo-warehouse/${id}`, params);
+export const auditItem = params =>
+	api.post(`/yxl-back-end/admin/photo-warehouse/audit`, params);
+auditItem;

src/router/index.js

@@ -213,10 +213,10 @@ export const constantRoutes = [
         }
       },
       {
-        path: 'UploadManagement',
+        path: 'PhotoVerifyManagement',
         name: '上传照片管理',
         component: () =>
-          import('@/views/photoManagement/uploadManagement/index'),
+          import('@/views/photoManagement/photoVerifyManagement/index'),
         meta: {
           title: '上传照片管理'
           // icon: 'tree'

src/utils/dialog-helper.js

@@ -12,6 +12,7 @@ import SceneItem from 'views/sceneManagement/sceneList/modal/ItemModal.vue';
 import WithdrawalRecordVerifyItem from 'views/statistics/withdrawalRecord/modal/ItemModal.vue';
 import PhotoerVerifyItem from 'views/photographerManagement/photographerVerify/modal/ItemModal.vue';
 import ActivityItem from 'views/photoManagement/eventsList/modal/ItemModal.vue';
+import PhotoVerifyItem from 'views/photoManagement/photoVerifyManagement/modal/ItemModal.vue';
 
 const modal = (Component, props) => {
   let _component = null;
@@ -117,3 +118,10 @@ let ActivityItemModal = data => {
 Vue.prototype.$ActivityItemModal = params => {
   ActivityItemModal(params);
 };
+
+let PhotoVerifyItemModal = data => {
+  modal(PhotoVerifyItem, data);
+};
+Vue.prototype.$PhotoVerifyItemModal = params => {
+  PhotoVerifyItemModal(params);
+};

src/views/photoManagement/imageGoodsManagement/index.vue

@@ -15,6 +15,7 @@
 <script>
 import toolbar from './toolbar';
 import mxFilterList from '@/mixins/filterList';
+import { getList, delItem } from '@/api/photoWarehouse';
 
 export default {
   name: 'ImageGoodsManagement',
@@ -23,7 +24,7 @@ export default {
 
   mixins: [
     mxFilterList({
-      // fetchList: iGetList // 在下方data再声明一个 fetchList: iGetList 同等效果
+      fetchList: getList // 在下方data再声明一个 fetchList: iGetList 同等效果
     })
   ],
 
@@ -31,24 +32,94 @@ export default {
     return {
       columns: [
         {
-          key: 'photo',
-          name: '用户名称',
-          width: '160'
+          key: 'listPreview',
+          name: '图片',
+          width: '160',
+          render: (h, { row }) =>
+            h('img', {
+              style: {
+                width: '160px',
+                height: '90px'
+              },
+              attrs: {
+                src: row.listPreview
+              },
+              on: {
+                click: () =>
+                  this.$AdvanceViewImageModal({
+                    items: [{ src: row.listPreview }]
+                  })
+              }
+            })
         },
         {
-          key: 'region',
-          name: '手机号',
-          width: '180'
+          key: 'location',
+          name: '上传位置',
+          minWidth: '180',
+          render: (h, { row }) =>
+            h('span', `${row.kindergartenName}/${row.activityName}`)
         },
         {
-          key: 'region',
-          name: '反馈内容',
-          minWidth: '120'
+          key: 'createAt',
+          name: '上传时间',
+          width: '140'
+        },
+        {
+          key: 'likes',
+          name: '点赞数',
+          width: '140'
         },
         {
-          key: 'region',
-          name: '反馈时间',
+          key: 'collections',
+          name: '收藏数',
           width: '140'
+        },
+        {
+          key: 'hdLogoPhotoPrice',
+          name: '高清价',
+          width: '140',
+          render: (h, { row }) => h('span', `${row.hdLogoPhotoPrice}`)
+        },
+        {
+          key: 'originPhotoPrice',
+          name: '原图价',
+          width: '140',
+          render: (h, { row }) => h('span', `${row.originPhotoPrice}`)
+        },
+        {
+          key: 'isShow',
+          name: '状态',
+          width: '80',
+          type: 'tag',
+          fetchTagType: val => (val ? 'success' : 'info'),
+          tagName: row => (row.isShow ? '显示' : '隐藏')
+        },
+        {
+          key: 'action',
+          name: '操作',
+          width: '120',
+          render: (h, { row }) => {
+            const action = [];
+            action.push(
+              h(
+                'BaseBtn',
+                {
+                  props: {
+                    popip: true,
+                    txt: '删除',
+                    type: 'text'
+                  },
+                  class: 'ml-10',
+                  on: {
+                    ok: () => this.handleDelItem(row)
+                  }
+                },
+                '删除'
+              )
+            );
+
+            return h('div', action);
+          }
         }
       ]
     };

src/views/photoManagement/imageGoodsManagement/toolbar.vue

@@ -9,22 +9,24 @@ export default {
   data() {
     return {
       fields: [
+        // TODO 上传者+
         {
-          type: 'text',
+          type: 'select',
           name: 'title',
-          label: '用户名称'
+          label: '上传位置'
         },
         {
-          type: 'text',
-          name: 'status',
-          label: '用户手机号',
-          labelWidth: '100px'
+          type: 'select',
+          name: 'auditStatus',
+          label: '状态',
+          options: AUDITTYPE,
+          format: val => (val !== null && val !== '' ? !!val : null)
         },
         {
           type: 'dateArray',
           name: 'date',
-          label: '反馈日期',
-          apiName: ['start', 'end']
+          label: '上传日期',
+          apiName: ['startTime', 'endTime']
         }
       ]
     };

src/views/photoManagement/photoVerifyManagement/index.vue

@@ -0,0 +1,140 @@
+<template>
+  <div class="">
+    <toolbar @on-filter="filterData" @on-reset="filterData" />
+
+    <base-table
+      class="m-10 bg-w p-20 br-10"
+      :columns="columns"
+      :items="items"
+      :pagination="pagination"
+      :page-change="pageChange"
+    />
+  </div>
+</template>
+
+<script>
+import toolbar from './toolbar';
+import mxFilterList from '@/mixins/filterList';
+import { getList } from '@/api/photoWarehouse';
+
+export default {
+  name: 'photoVerifyManagement',
+
+  components: { toolbar },
+
+  mixins: [
+    mxFilterList({
+      fetchList: getList // 在下方data再声明一个 fetchList: iGetList 同等效果
+    })
+  ],
+
+  data() {
+    return {
+      columns: [
+        {
+          key: 'listPreview',
+          name: '图片',
+          width: '160',
+          render: (h, { row }) =>
+            h('img', {
+              style: {
+                width: '160px',
+                height: '90px'
+              },
+              attrs: {
+                src: row.listPreview
+              },
+              on: {
+                click: () =>
+                  this.$AdvanceViewImageModal({
+                    items: [{ src: row.listPreview }]
+                  })
+              }
+            })
+        },
+        {
+          key: 'location',
+          name: '上传位置',
+          minWidth: '180',
+          render: (h, { row }) =>
+            h('span', `${row.kindergartenName}/${row.activityName}`)
+        },
+        {
+          key: 'createAt',
+          name: '上传时间',
+          width: '140'
+        },
+        {
+          key: 'auditStatus',
+          name: '状态',
+          width: '80',
+          type: 'tag',
+          fetchTagType: val => {
+            switch (val) {
+              case 1:
+                return 'success';
+              case 0:
+                return 'info';
+              case -1:
+                return 'error';
+              default:
+                return 'info';
+            }
+          },
+          tagName: row => {
+            switch (row.auditStatus) {
+              case 1:
+                return '通过';
+              case 0:
+                return '待审核';
+              case -1:
+                return '拒绝';
+              default:
+                return '-';
+            }
+          }
+        },
+        {
+          key: 'action',
+          name: '操作',
+          width: '120',
+          render: (h, { row }) => {
+            const action = [];
+            row.auditStatus !== 1 &&
+              action.push(
+                h(
+                  'el-button',
+                  {
+                    props: {
+                      type: 'text'
+                    },
+                    on: {
+                      click: () =>
+                        this.$PhotoVerifyItemModal({
+                          id: row.id,
+                          auditStatus: row.auditStatus
+                        })
+                    }
+                  },
+                  '审核'
+                )
+              );
+
+            return h('div', action);
+          }
+        }
+      ]
+    };
+  },
+
+  created() {
+    this.$g_on('photot_reload', this.reload);
+  },
+
+  beforeDestroy() {
+    this.$g_off('photot_reload', this.reload);
+  }
+};
+</script>
+
+<style type="scss" scoped></style>

src/views/photoManagement/photoVerifyManagement/modal/ItemModal.vue

@@ -0,0 +1,150 @@
+<template>
+  <el-dialog
+    :title="title"
+    :visible.sync="modal"
+    width="80%"
+    :close-on-click-modal="false"
+    @close="
+      res => {
+        $emit('cancel');
+      }
+    "
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-form-item label="上传位置">
+        {{ form.kindergartenName }}/ {{ form.activityName }}
+      </el-form-item>
+
+      <el-form-item label="图片"
+        ><img
+          :src="form.listPreview"
+          class="pre-img"
+          @click="
+            () =>
+              this.$AdvanceViewImageModal({
+                items: [{ src: form.listPreview }]
+              })
+          "
+        />
+      </el-form-item>
+      <el-form-item label="审核状态" prop="auditStatus">
+        <el-radio-group v-if="auditStatus !== 1" v-model="form.auditStatus">
+          <el-radio :label="1">通过</el-radio>
+          <el-radio :label="-1">不通过</el-radio>
+        </el-radio-group>
+        <span v-else>{{ form.auditStatus | auditStatusName }}</span>
+      </el-form-item>
+      <el-form-item label="审核备注">
+        <el-input
+          v-if="auditStatus !== 1"
+          v-model="form.auditMsg"
+          type="textarea"
+          :rows="2"
+          placeholder="请输入内容"
+        >
+        </el-input>
+        <span v-else>{{ form.auditMsg }}</span>
+      </el-form-item>
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="modal = false">取消</el-button>
+      <el-button type="primary" @click="handleConfirm">确定</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { getItem, auditItem } from '@/api/photoWarehouse';
+
+export default {
+  name: 'photoVerifyItemModal',
+
+  filters: {
+    auditStatusName: function(num) {
+      switch (num) {
+        case 1:
+          return '通过';
+        case 0:
+          return '待审核';
+        case -1:
+          return '拒绝';
+        default:
+          return '-';
+      }
+    }
+  },
+
+  props: {
+    id: {
+      type: String,
+      default: ''
+    },
+    auditStatus: {
+      type: Number,
+      default: 0
+    }
+  },
+
+  data() {
+    return {
+      title: '照片审核详情',
+      modal: true,
+      form: {
+        auditStatus: null,
+        auditMsg: ''
+      },
+      rules: {
+        auditStatus: [
+          { required: true, message: '请选择是否通过', trigger: 'blur' }
+        ]
+      }
+    };
+  },
+
+  watch: {
+    id: {
+      handler(id) {
+        id && this.loadData();
+      },
+      immediate: true
+    }
+  },
+
+  mounted() {},
+
+  methods: {
+    async loadData() {
+      const { success, data, msg } = await getItem({
+        id: this.id
+      });
+      if (success) {
+        this.form = data;
+      }
+    },
+
+    handleConfirm() {
+      this.$refs.form.validate(async valid => {
+        if (valid) {
+          const params = {
+            auditStatus: this.form.auditStatus,
+            auditMsg: this.form.auditMsg
+          };
+          if (this.id) params.id = this.form.infoId;
+          const { success, msg } = await auditItem(params);
+          if (success) {
+            this.$success('保存成功！');
+            this.modal = false;
+            this.$g_emit('photot_reload');
+          }
+        }
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.pre-img {
+  height: 80px;
+}
+</style>

src/views/photoManagement/uploadManagement/toolbar.vue → src/views/photoManagement/photoVerifyManagement/toolbar.vue

@@ -9,22 +9,24 @@ export default {
   data() {
     return {
       fields: [
+        // TODO 上传者+
         {
-          type: 'text',
+          type: 'select',
           name: 'title',
-          label: '用户名称'
+          label: '上传位置'
         },
         {
-          type: 'text',
-          name: 'status',
-          label: '用户手机号',
-          labelWidth: '100px'
+          type: 'select',
+          name: 'auditStatus',
+          label: '状态',
+          options: AUDITTYPE,
+          format: val => (val !== null && val !== '' ? !!val : null)
         },
         {
           type: 'dateArray',
           name: 'date',
-          label: '反馈日期',
-          apiName: ['start', 'end']
+          label: '上传日期',
+          apiName: ['startTime', 'endTime']
         }
       ]
     };

src/views/photoManagement/uploadManagement/index.vue

@@ -1,59 +0,0 @@
-<template>
-  <div class="">
-    <toolbar @on-filter="filterData" @on-reset="filterData" />
-
-    <base-table
-      class="m-10 bg-w p-20 br-10"
-      :columns="columns"
-      :items="items"
-      :pagination="pagination"
-      :page-change="pageChange"
-    />
-  </div>
-</template>
-
-<script>
-import toolbar from './toolbar';
-import mxFilterList from '@/mixins/filterList';
-
-export default {
-  name: 'UploadManagement',
-
-  components: { toolbar },
-
-  mixins: [
-    mxFilterList({
-      // fetchList: iGetList // 在下方data再声明一个 fetchList: iGetList 同等效果
-    })
-  ],
-
-  data() {
-    return {
-      columns: [
-        {
-          key: 'photo',
-          name: '用户名称',
-          width: '160'
-        },
-        {
-          key: 'region',
-          name: '手机号',
-          width: '180'
-        },
-        {
-          key: 'region',
-          name: '反馈内容',
-          minWidth: '120'
-        },
-        {
-          key: 'region',
-          name: '反馈时间',
-          width: '140'
-        }
-      ]
-    };
-  }
-};
-</script>
-
-<style type="scss" scoped></style>

src/views/photographerManagement/photoVerify/index.vue

@@ -15,6 +15,7 @@
 <script>
 import toolbar from './toolbar';
 import mxFilterList from '@/mixins/filterList';
+import { getList, delItem } from '@/api/photoWarehouse';
 
 export default {
   name: 'PhotoVerify',
@@ -23,7 +24,7 @@ export default {
 
   mixins: [
     mxFilterList({
-      // fetchList: iGetList // 在下方data再声明一个 fetchList: iGetList 同等效果
+      fetchList: getList // 在下方data再声明一个 fetchList: iGetList 同等效果
     })
   ],
 
@@ -31,42 +32,118 @@ export default {
     return {
       columns: [
         {
-          key: 'photo',
-          name: '照片ID',
-          width: '160'
-        },
-        {
-          key: 'region',
+          key: 'listPreview',
           name: '图片',
-          width: '180'
-        },
-        {
-          key: 'region',
-          name: '上传者',
-          width: '120'
+          width: '160',
+          render: (h, { row }) =>
+            h('img', {
+              style: {
+                width: '160px',
+                height: '90px'
+              },
+              attrs: {
+                src: row.listPreview
+              },
+              on: {
+                click: () =>
+                  this.$AdvanceViewImageModal({
+                    items: [{ src: row.listPreview }]
+                  })
+              }
+            })
         },
         {
-          key: 'region',
+          key: 'location',
           name: '上传位置',
-          minWidth: '180'
+          minWidth: '180',
+          render: (h, { row }) =>
+            h('span', `${row.kindergartenName}/${row.activityName}`)
         },
         {
-          key: 'region',
+          key: 'createAt',
           name: '上传时间',
           width: '140'
         },
         {
-          key: 'region',
+          key: 'auditStatus',
           name: '状态',
-          width: '80'
+          width: '80',
+          type: 'tag',
+          fetchTagType: val => {
+            switch (val) {
+              case 1:
+                return 'success';
+              case 0:
+                return 'info';
+              case -1:
+                return 'error';
+              default:
+                return 'info';
+            }
+          },
+          tagName: row => {
+            switch (row.auditStatus) {
+              case 1:
+                return '通过';
+              case 0:
+                return '待审核';
+              case -1:
+                return '拒绝';
+              default:
+                return '-';
+            }
+          }
         },
         {
           key: 'action',
           name: '操作',
-          minWidth: '180'
+          width: '120',
+          render: (h, { row }) => {
+            const action = [];
+            row.auditStatus !== 1 &&
+              action.push(
+                h(
+                  'BaseBtn',
+                  {
+                    props: {
+                      popip: true,
+                      txt: '删除',
+                      type: 'text'
+                    },
+                    class: 'ml-10',
+                    on: {
+                      ok: () => this.handleDelItem(row)
+                    }
+                  },
+                  '删除'
+                )
+              );
+
+            return h('div', action);
+          }
         }
       ]
     };
+  },
+
+  created() {
+    this.$g_on('photot_reload', this.reload);
+  },
+
+  beforeDestroy() {
+    this.$g_off('photot_reload', this.reload);
+  },
+
+  methods: {
+    async handleDelItem(item) {
+      const { success, msg } = await delItem({
+        id: item.id
+      });
+      if (success) {
+        this.$success('删除成功！');
+        this.$g_emit('photot_reload');
+      }
+    }
   }
 };
 </script>

src/views/photographerManagement/photoVerify/toolbar.vue

@@ -3,12 +3,15 @@
 </template>
 
 <script>
+import AUDITTYPE from '@/const/auditType';
+
 export default {
   name: 'PhotoVerifyToolbar',
 
   data() {
     return {
       fields: [
+        // TODO
         {
           type: 'select',
           name: 'title',
@@ -16,14 +19,16 @@ export default {
         },
         {
           type: 'select',
-          name: 'date',
-          label: '状态'
+          name: 'auditStatus',
+          label: '状态',
+          options: AUDITTYPE,
+          format: val => (val !== null && val !== '' ? !!val : null)
         },
         {
           type: 'dateArray',
           name: 'date',
           label: '上传日期',
-          apiName: ['start', 'end']
+          apiName: ['startTime', 'endTime']
         }
       ]
     };