Browse Source

修改bug

Jing 2 months ago
parent
commit
a608e7bfbc

BIN
src/assets/advertise/ad01.png


BIN
src/assets/advertise/ad02.png


BIN
src/assets/advertise/guanggaowei1.png


BIN
src/assets/advertise/guanggaowei2.png


+ 62 - 30
src/views/advertise/advertiseList.vue

@@ -106,8 +106,8 @@
                     </el-form-item>
                     <el-form-item label="持续时间:" prop="">
                         <el-date-picker v-model="ruleForm.time" type="datetimerange" range-separator="至"
-                            start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy-MM-dd HH:00:00"
-                            value-format="yyyy-MM-dd HH:00:00" :picker-options="startTimeOptions"
+                            start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy-MM-dd HH:mm:ss"
+                            value-format="yyyy-MM-dd HH:mm:ss" :picker-options="startTimeOptions"
                             @change="changeStartTime">
                         </el-date-picker>
                         <!-- <el-col :span="11">
@@ -127,8 +127,7 @@
                         </el-col> -->
                     </el-form-item>
                     <el-form-item label="广告尺寸:" prop="">
-                        <el-radio v-model="ruleForm.radio" disabled label="1">1200x90px</el-radio>
-                        <el-radio v-model="ruleForm.radio" disabled label="2">420x560px</el-radio>
+                        <el-radio v-model="ruleForm.radio" v-for="(item,index) in adSizeList" :key="index" disabled :label=item.id>{{ item.width+'x'+item.height }}</el-radio>
                     </el-form-item>
 
                     <el-form-item label="价格:" prop="price">
@@ -170,20 +169,16 @@
         <!-- 弹出框 编辑 end----------------------------------------------------------->
 
         <!-- 弹出框 广告位示例图 start----------------------------------------------------------->
-        <el-dialog title="广告位示例图" :visible.sync="dialogVisible" width="50%" top="25vh">
-            <ul class="graph">
-                <li>
-                    <h3>首页:</h3>
-                    <img src="../../assets/advertise/guanggaowei2.png" alt="">
-                </li>
-                <li>
-                    <h3>列表页:</h3>
-                    <img src="../../assets/advertise/guanggaowei1.png" alt="">
-                </li>
-            </ul>
-            <div slot="footer" class="dialog-footer">
-                <el-button @click="dialogVisible = false">取 消</el-button>
-                <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+        <el-dialog title="广告位示例图" :visible.sync="dialogVisible" width="50%" top="15vh">
+            <div class="graph">
+                <el-carousel indicator-position="outside" autoplay loop>
+                    <el-carousel-item>
+                        <img src="../../assets/advertise/ad01.png" alt="" class="shilitu">
+                    </el-carousel-item>
+                    <el-carousel-item>
+                        <img src="../../assets/advertise/ad02.png" alt="" class="shilitu">
+                    </el-carousel-item>
+                </el-carousel>
             </div>
         </el-dialog>
         <!-- 弹出框 广告位示例图 end----------------------------------------------------------->
@@ -225,7 +220,7 @@ import tableTitle from './components/tableTitle.vue';
 
 //引入公用样式
 import '@/styles/global.less';
-import { getStatus, getOrderList, getOrderListAdmin, getOrderDetail, getOrderDetailAdmin, applyOrderStatusAdmin, editOrderAdmin, rejectOrderAdmin, endOrderAdmin, delOrderAdmin } from '@/api/advertise'
+import { getStatus, getOrderList, getOrderListAdmin, getOrderDetail, getOrderDetailAdmin, applyOrderStatusAdmin, editOrderAdmin, rejectOrderAdmin, endOrderAdmin, delOrderAdmin,getSize } from '@/api/advertise'
 export default {
     components: {
         tableTitle,//表格标题-
@@ -280,6 +275,7 @@ export default {
             status_radio: "",   //审核状态
             textarea: '',    //驳回原因
             formLabelWidth: '',
+            adSizeList: '', //广告尺寸
             ruleForm: {
                 name: '', //广告名称
                 ad_url: '', //广告网址
@@ -477,10 +473,12 @@ export default {
             this.activeid = id
             this.dialogTableVisible = true
             this.ruleForm.name = val.name
-            if (val.width == 1200) {
-                this.ruleForm.radio = '1'
-            } else {
-                this.ruleForm.radio = '2'
+            if (val.width == 1200 && val.height == 90) {
+                this.ruleForm.radio = 1
+            } else if(val.width == 600 && val.height == 120) {
+                this.ruleForm.radio = 2
+            } else if(val.width == 450 && val.height == 290) {
+                this.ruleForm.radio = 3
             }
             this.ruleForm.startTime = val.sttime
             this.ruleForm.endTime = val.edtime
@@ -498,6 +496,9 @@ export default {
                 this.ruleForm.adImg = data.data.ad[0]?.image_src //广告图
                 this.ruleForm.num = data.data.ad.length //广告个数
                 this.ruleForm.price = val.price / val.days / this.ruleForm.num //广告价格
+                this.ruleForm.startTime = val.sttime//持续时间开始
+                this.ruleForm.endTime = val.edtime//持续时间结束
+                this.ruleForm.time = [val.sttime, val.edtime] //持续时间
 
                 let adPlace = data.data.ad
 
@@ -734,8 +735,18 @@ export default {
             //   console.log('shopCode', this.shopCode);
             // });
         },
+        getAdSize() {
+            getSize().then(res => {
+                console.log("广告尺寸", res.data);
+                this.adSizeList = res.data; 
+                for(let item of this.adSizeList){
+                    ad_size=item.width+'x'+item.height
+                }
+            })
+        }
     },
     mounted() {
+        this.getAdSize()
         this.getData()
     },
 }
@@ -999,17 +1010,38 @@ export default {
 }
 
 .graph {
-    background-color: #f5f7fb;
-    padding: 60px 100px;
+    width: 900px;
+    height: 530px;
+    margin: 0 auto;
     overflow: hidden;
 
-    li {
-        float: left;
+    .shilitu {
+        width: 900px;
+        height: 495px;
+        z-index: 100000;
     }
 
-    >li:first-child {
-        margin-right: 100px;
-    }
+}
+
+::v-deep .el-carousel__container {
+    position: relative;
+    height: 500px;
+}
+
+/* 自定义指示器样式 */
+::v-deep .el-carousel__indicators .el-carousel__indicator button {
+    width: 12px;
+    /* 宽度 */
+    height: 12px;
+    /* 高度 */
+    border-radius: 50%;
+    /* 圆形 */
+}
+
+/* 可选:更改当前项指示器的颜色 */
+::v-deep .el-carousel__indicators .el-carousel__indicator.is-active button {
+    background-color: #33b023;
+    /* 当前项颜色 */
 }
 
 .dialog-footer {