数据报表

src/router/modules/user.js

@@ -40,7 +40,8 @@ const userRouter = {
           path: 'market-list',
           name: 'MarketList',
           component: () => import('@/views/user/customer/market-list'),
-          meta: { title: '营销数据报表' }
+          meta: { title: '营销数据报表' },
+          hidden: true
         },
         {
           path: 'market-report-list',

src/views/user/customer/list.vue

@@ -45,6 +45,20 @@
           <el-tag v-if="row.status === 1" type="danger" size="small">暂停统计</el-tag>
         </template>
       </el-table-column>
+      <el-table-column prop="status" label="logo" align="center" width="180">
+        <template slot-scope="{ row }">
+          <el-popover v-if="row.logo" placement="top-start" title="" width="180" trigger="hover">
+            <img :src="row.logo" alt="" style="width: 94px; height: 50px" />
+            <img slot="reference" :src="row.logo" alt="" style="width: 94px; height: 50px" />
+          </el-popover>
+          <span v-else>---</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="recentlyTime" label="最近报表时间" align="center">
+        <template slot-scope="{ row }">
+          {{ row.recentlyTime ? row.recentlyTime : '---' }}
+        </template>
+      </el-table-column>
       <el-table-column prop="addTime" label="添加时间" align="center">
         <template slot-scope="{ row }">
           {{ row.addTime ? row.addTime : '---' }}
@@ -52,9 +66,9 @@
       </el-table-column>
       <el-table-column fixed="right" label="操作" align="center" width="400">
         <template slot-scope="{ row }">
-          <!-- <el-button type="primary" size="mini" style="margin: 4px" @click="handleRecordDetail(7, row)">
-            意向客户数据
-          </el-button> -->
+          <el-button type="primary" size="mini" style="margin: 4px" @click="handleRecordDetail(7, row)">
+            营销数据报表
+          </el-button>
           <el-button type="primary" size="mini" style="margin: 4px" @click="handleRecordDetail(1, row)">
             潜客统计列表
           </el-button>
@@ -64,6 +78,9 @@
           <el-button type="primary" size="mini" style="margin: 4px" @click="handleRecordDetail(3, row)">
             相关搜索词
           </el-button>
+          <el-button type="success" size="mini" style="margin: 4px" @click="handleRecordDetail(8, row)">
+            上传LOGO
+          </el-button>
           <el-button type="success" size="mini" style="margin: 4px" @click="handleRecordDetail(4, row)">
             页面访问统计
           </el-button>
@@ -100,11 +117,48 @@
         <el-button type="primary" @click="handleConfirm">确定</el-button>
       </div>
     </el-dialog>
+    <!-- 上传LOGO -->
+    <el-dialog title="上传LOGO" :visible.sync="logoFormVisible" width="500px">
+      <el-form ref="logoForm" :model="logoForm" :rules="rules" label-position="right">
+        <el-form-item prop="logo" label="logo">
+          <div class="form-el-upload" style="width: 148px; height: 148px">
+            <el-upload
+              class="avatar-uploader"
+              :action="actionUrl"
+              :headers="getToken"
+              :show-file-list="false"
+              :on-success="handleSuccess"
+              :before-upload="beforeUpload"
+            >
+              <div v-loading="loadImgLoading" class="avatar" style="width: 148px; height: 148px; display: block">
+                <img
+                  v-if="logoForm.logo"
+                  :src="logoForm.logo"
+                  style="width: 148px; height: 148px; display: block"
+                  @error="reloadImage"
+                  @load="loadSucess"
+                />
+                <i
+                  v-else
+                  class="el-icon-plus avatar-uploader-icon"
+                  style="width: 148px; height: 148px; line-height: 148px"
+                ></i>
+              </div>
+            </el-upload>
+            <p class="uploader-tips">注：请尽量上传126*50(px)尺寸的图片。</p>
+          </div>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="logoFormVisible = false">取消</el-button>
+        <el-button type="primary" @click="handleConfirmLogo">确定</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { getCustomerShopList, saveCustomerShop, renewCustomerShop } from '@/api/user/customer/customer'
+import { getCustomerShopList, saveCustomerShop, renewCustomerShop, uploadShopLogo } from '@/api/user/customer/customer'
 import ShopDialog from './components/shop-dialog'
 export default {
   name: 'RecordList',
@@ -123,16 +177,32 @@ export default {
       total: 0,
       shopDialogVisible: false,
       dialogFormVisible: false,
+      logoFormVisible: false,
+      loadImgLoading: false,
       renewCustome: {
         id: '',
         status: ''
       },
+      logoForm: {
+        id: '',
+        logo: ''
+      },
       rules: {
-        status: [{ required: true, message: '请设置统计状态', trigger: 'blur' }]
+        status: [{ required: true, message: '请设置统计状态', trigger: 'blur' }],
+        logo: [{ required: true, message: '请上传弹窗图片', trigger: 'blur' }]
       }
     }
   },
-  computed: {},
+  computed: {
+    getToken() {
+      return {
+        token: this.$store.getters.token
+      }
+    },
+    actionUrl() {
+      return process.env.VUE_APP_BASE_API + '/formData/MultiPictareaddData'
+    }
+  },
   created() {
     this.getList()
   },
@@ -202,6 +272,27 @@ export default {
         console.log(error)
       }
     },
+    // 上传logo
+    handleConfirmLogo() {
+      this.$refs['logoForm'].validate((valid) => {
+        if (valid) {
+          this.uploadShopLogo(this.logoForm)
+        } else {
+          return false
+        }
+      })
+    },
+    // 上传logo
+    async uploadShopLogo(params) {
+      try {
+        await uploadShopLogo(params)
+        this.logoFormVisible = false
+        this.$message.success('操作成功')
+        this.getList()
+      } catch (error) {
+        console.log(error)
+      }
+    },
     // 查看详情
     handleRecordDetail(type, row) {
       switch (type) {
@@ -241,16 +332,69 @@ export default {
           console.log('renewCustome', this.renewCustome)
           this.dialogFormVisible = true
           break
-        case 7: // 意向客户数据
+        case 7: // 跳转数据报表
           this.$router.push({
-            path: '/user/customer/customer-ambition-list',
-            query: { shopId: row.shopId }
+            path: '/user/customer/market-report-list',
+            query: { marketId: row.id, shopName: row.shopName }
           })
           break
+        case 8: // 上传LOGO
+          this.logoForm.id = row.id
+          this.logoFormVisible = true
+          break
+      }
+    },
+    // 上传图标事件
+    handleSuccess(res, file) {
+      this.loadImgLoading = true
+      this.$nextTick(() => {
+        setTimeout(() => {
+          this.logoForm.logo = res.data
+        }, 1000 * 2)
+      })
+    },
+    // 对上传图片的大小、格式进行限制
+    beforeUpload(file) {
+      const isJPG = file.type === 'image/jpeg'
+      const isJPG2 = file.type === 'image/jpg'
+      const isPNG = file.type === 'image/png'
+      const isLt5M = file.size / 1024 / 1024 < 5
+      if (!isJPG && !isJPG2 && !isPNG) {
+        this.$message.error('只支持jpg或png格式图片')
       }
+      if (!isLt5M) {
+        this.$message.error('请上传5MB以内的图片!')
+      }
+      return (isJPG || isJPG2 || isPNG) && isLt5M
+    },
+    reloadImage() {
+      this.loadImgLoading = true
+      setTimeout(() => {
+        this.logoForm.logo = this.logoForm.logo.split('?')[0] + '?r=' + Math.floor(Math.random() * 1000)
+      }, 1000 * 2)
+    },
+    loadSucess() {
+      this.loadImgLoading = false
     }
   }
 }
 </script>
 
-<style></style>
+<style>
+.avatar-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+  float: left;
+}
+.uploader-tips {
+  position: absolute;
+  bottom: 0;
+  left: 160px;
+  line-height: 28px;
+  color: red;
+  margin: 0;
+}
+</style>

src/views/user/customer/market-list.vue

@@ -72,8 +72,8 @@
     />
     <!--  选择供应商弹窗 -->
     <shop-dialog v-if="shopDialogVisible" ref="shopDialog" @confirm="handleAddShopConfirm" @cancel="handleCancel" />
-    <!-- 设置统计状态 -->
-    <el-dialog title="设置统计状态" :visible.sync="dialogFormVisible" width="500px">
+    <!-- 上传LOGO -->
+    <el-dialog title="上传LOGO" :visible.sync="dialogFormVisible" width="500px">
       <el-form ref="dataForm" :model="renewCustome" :rules="rules" label-position="right">
         <el-form-item prop="logo" label="logo">
           <div class="form-el-upload" style="width: 148px; height: 148px">