first

pageDevice/adManager/view.vue

@@ -0,0 +1,125 @@
+<template>
+  <JeepayBackground :bgColorStyle="{ height: '706rpx' }">
+    <JeepayCustomNavbar textColor="#fff"
+      bgDefaultColor="linear-gradient(270deg, rgba(72, 192, 255, 1) 0%, rgba(51, 157, 255, 1) 100%)" title="广告详情"
+      backCtrl="back" />
+    <JeepayTableListItem viewClass="list-item-by-detail" logo="/pageDevice/static/icon/ad-white.svg"
+      :title="vdata.title" :subtitle="vdata.advertId" :moreBtnList="list" />
+    <view class="create-time">
+      <view class="time-title">创建时间</view>
+      <view class="time-info">{{ vdata.createdAt }}</view>
+    </view>
+    <JeepayCard editText="编辑广告" @editTap="toEditAd">
+      <JeepayDescview>
+        <block v-for="(v, i) in vdata.appContent">
+          <JeepayDescviewItem :title="`广告图片（${i + 1}）`">
+            <template #desc>
+              <image class="ad-img" :src="v.imgUrl" mode="aspectFill">
+              </image>
+            </template>
+          </JeepayDescviewItem>
+        </block>
+      </JeepayDescview>
+    </JeepayCard>
+    <JeepayCard title='其他设置' viewStyle="margin-top:30rpx">
+      <JSwitchCard title="是否发布" :tipsWidth='410' tips="发布后，刷脸设备上仅展示当前广告中包含的图片">
+        <template #right>
+          <JeepayStateSwitch v-model:state="vdata.releaseState" :showSwitchType="true"
+            :updateStateFunc="updateStateFunc" />
+        </template>
+      </JSwitchCard>
+    </JeepayCard>
+    <JeepayPopupConfirm ref="refTips" />
+    <JSinglePopup ref="refMore" :list="list" activeColor="#FF5B4C" />
+  </JeepayBackground>
+</template>
+
+<script setup>
+import { reqLoad, API_URI_PAY_AD_LIST } from "@/http/apiManager.js"
+import http from "@/http/http"
+import emit from '@/commons/utils/emit.js'
+import infoBox from '@/commons/utils/infoBox.js'
+import { reactive, ref } from "vue"
+import go from '@/commons/utils/go.js'
+import { onLoad,onUnload } from '@dcloudio/uni-app'
+onLoad((options) => {
+  vdata.advertId = options.id
+  getDetails()
+})
+uni.$on(emit.ENAME_REF_AD_DETAILS, (data) => {
+  getDetails()
+})
+const list = reactive([{
+  label: '编辑广告',
+  value: 'editAd',
+  fun: toEditAd,
+},
+{
+  label: '删除广告',
+  value: 'deleteAd',
+  color: '#FF5B4C',
+  fun: function () {
+    refTips.value.open('是否确认删除该条广告?').then(() => {
+      http.req(API_URI_PAY_AD_LIST, { delAdvertIds: vdata.advertId }, "DELETE").then(res => {
+        infoBox.showSuccessToast('删除成功').then(res => {
+          go.back(1,emit.ENAME_REF_AD_LIST)
+        })
+
+      })
+    }).catch(() => {
+      refMore.value.open()
+    })
+  }
+},
+])
+const refTips = ref(null)
+const refMore = ref(null)
+const vdata = reactive({})
+function toEditAd () {
+  go.to('PAGES_AD_EDIT', { id: vdata.advertId })
+}
+// 获取详情
+const getDetails = () => {
+  reqLoad.getById(API_URI_PAY_AD_LIST, vdata.advertId).then(({ bizData }) => {
+    bizData.appContent = JSON.parse(bizData.appContent)
+    Object.assign(vdata, bizData)
+  })
+}
+// 修改发布状态
+const updateStateFunc = (state) => {
+  reqLoad.addOrUpdate(vdata.advertId, API_URI_PAY_AD_LIST, { releaseState: state }).then(res=>{
+    emit.refPageAndSearchEmit( emit.ENAME_REF_AD_LIST)
+  })
+}
+onUnload(() => uni.$off(emit.ENAME_REF_AD_DETAILS))
+</script>
+
+<style lang="scss" scoped>
+.create-time {
+  display: flex;
+  justify-content: space-between;
+  margin: 0 75rpx;
+  padding: 50rpx 0;
+  font-size: 30rpx;
+  border-top: 1rpx solid rgba(255, 255, 255, 0.2);
+
+  .time-title {
+    color: rgba(255, 255, 255, 0.7);
+  }
+
+  .time-info {
+    color: #fff;
+  }
+
+}
+
+.ad-img {
+  width: 150rpx;
+  height: 150rpx;
+  border-radius: 20rpx;
+}
+
+.c-desc-view-item ::v-deep .title {
+  justify-content: flex-start !important;
+}
+</style>