Browse Source

✨ feat:
移除一些默认值;
展示型推广SD: 推广商品表格显示调整;

WanGxC 1 year ago
parent
commit
913bfda139

+ 1 - 1
src/views/adManage/sb/campaigns/CreateCampaigns/component/ProductSetCreativity1.vue

@@ -298,7 +298,7 @@ interface RuleForm {
   title: string
 }
 const ruleForm = reactive<RuleForm>({
-  name: '视频 广告 - 1/15/2024 17:51:10.236',
+  name: '',
   brandName: '',
   title: '',
 })

+ 1 - 1
src/views/adManage/sb/campaigns/CreateCampaigns/component/ProductSetCreativity2.vue

@@ -162,7 +162,7 @@ interface RuleForm {
 
 const ruleFormRef = ref<FormInstance>()
 const ruleForm = reactive<RuleForm>({
-  name: '视频 广告 - 1/15/2024 17:51:10.236',
+  name: '',
   brandName: '',
   title: '',
 })

+ 1 - 1
src/views/adManage/sb/campaigns/CreateCampaigns/component/VideoCreativity1.vue

@@ -305,7 +305,7 @@ interface RuleForm {
   title: string
 }
 const ruleForm = reactive<RuleForm>({
-  name: '视频 广告 - 1/15/2024 17:51:10.236',
+  name: '',
   brandName: '',
   title: '',
 })

+ 1 - 1
src/views/adManage/sb/campaigns/CreateCampaigns/component/VideoCreativity2.vue

@@ -176,7 +176,7 @@ interface RuleForm {
 }
 const ruleFormRef = ref<FormInstance>()
 const ruleForm = reactive<RuleForm>({
-  name: '视频 广告 - 1/15/2024 17:51:10.236',
+  name: '',
 })
 const rules = reactive<FormRules<RuleForm>>({
   name: [{ required: true, message: '请输入名称', trigger: 'blur' }],

+ 2 - 2
src/views/adManage/sd/campaigns/CreateCampaigns/component/AdCampaign.vue

@@ -16,7 +16,7 @@
         status-icon>
         <div class="flex-between">
           <el-form-item label="广告活动名称" prop="campaignName" style="width: 48%">
-            <el-input v-model="campaignRuleForm.campaignName" />
+            <el-input v-model="campaignRuleForm.campaignName" placeholder="请输入广告活动名称" />
           </el-form-item>
           <el-form-item label="广告组合" prop="adMix" style="width: 48%">
             <el-select v-model="campaignRuleForm.adMix" placeholder="请选择" style="width: 100%">
@@ -92,7 +92,7 @@ interface campaignRuleForm {
   budget: string
 }
 const campaignRuleForm = reactive<campaignRuleForm>({
-  campaignName: 'AiTestX2024_2_26_brandLogo',
+  campaignName: '',
   adMix: '',
   startDate: '',
   endDate: '',

+ 2 - 2
src/views/adManage/sd/campaigns/CreateCampaigns/component/AdGroup.vue

@@ -8,7 +8,7 @@
       <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="top" label-width="120px" size="default" status-icon>
         <el-card shadow="never" body-style="padding-bottom: 0px" v-loading="adGroupLoading">
           <el-form-item label="广告组名称" prop="groupName">
-            <el-input v-model="ruleForm.groupName" style="width: 310px"></el-input>
+            <el-input v-model="ruleForm.groupName" placeholder="请输入广告组名称" style="width: 310px"></el-input>
           </el-form-item>
           <el-form-item label="竞价优化" prop="groupName">
             <div>
@@ -69,7 +69,7 @@ interface ruleForm {
   budget: string
 }
 const ruleForm = reactive<ruleForm>({
-  groupName: 'AiTestX2024',
+  groupName: '',
   adMix: '',
   startDate: '',
   endDate: '',

+ 4 - 4
src/views/adManage/sd/campaigns/CreateCampaigns/component/CustomTarget.vue

@@ -64,11 +64,11 @@
                     <div>
                       <div style="display: flex; justify-content: space-between">
                         <div>推广的商品</div>
-                        <el-button type="primary" size="small" link @click="addPromoteProduct">添加</el-button>
+                        <el-button type="primary" size="small" link @click="addPromoteProduct" style="color: #3569d6;">添加</el-button>
                       </div>
                       <div style="display: flex; justify-content: space-between">
                         <div>与推广商品类似的商品</div>
-                        <el-button type="primary" size="small" link @click="addPromoteSimilar">添加</el-button>
+                        <el-button type="primary" size="small" link @click="addPromoteSimilar" style="color: #3569d6;">添加</el-button>
                       </div>
                     </div>
                   </div>
@@ -94,11 +94,11 @@
                     <div>
                       <div style="display: flex; justify-content: space-between">
                         <div>推广的商品</div>
-                        <el-button type="primary" size="small" link @click="addPromoteProduct">添加</el-button>
+                        <el-button type="primary" size="small" link @click="addPromoteProduct" style="color: #3569d6;">添加</el-button>
                       </div>
                       <div style="display: flex; justify-content: space-between">
                         <div>与推广的商品相关</div>
-                        <el-button type="primary" size="small" link @click="addPromoteSimilar">添加</el-button>
+                        <el-button type="primary" size="small" link @click="addPromoteSimilar" style="color: #3569d6;">添加</el-button>
                       </div>
                     </div>
                   </div>

+ 3 - 2
src/views/adManage/sd/campaigns/CreateCampaigns/component/PromoteProduct.vue

@@ -83,10 +83,11 @@
               v-model="productTextarea"
               :rows="20"
               type="textarea"
-              placeholder="请输入ASIN,多个ASIN使用逗号、空格或换行符分隔。(未完成)"
+              placeholder="请输入ASIN,多个ASIN使用逗号、空格或换行符分隔。"
+              disabled="true"
               maxlength="11000" />
             <div style="display: flex; flex-direction: row-reverse; margin-top: 10px">
-              <el-button v-for="button in buttons" :key="button.text" :type="button.type" link @click="addGods">{{ button.text }}</el-button>
+              <el-button v-for="button in buttons" :key="button.text" :type="button.type" link @click="addGods" disabled="true">{{ button.text }}</el-button>
             </div>
           </el-tab-pane>
         </el-tabs>

+ 2 - 2
src/views/adManage/sd/targets/crud.tsx

@@ -104,11 +104,11 @@ export const createCrudOptions = function ({crudExpose, context}: CreateCrudOpti
             show: false
           }
         },
-        resolvedExpression_value:{
+        resolvedExpression_value: {
           title: '商品和分类',
           column: {
             fixed: 'left',
-            width: 180,
+            width: 230,
             sortable: true
           },
         },

+ 62 - 52
src/views/adManage/sd/targets/index.vue

@@ -5,47 +5,59 @@
         <el-tabs v-model="tabActiveName" class="chart-tabs" type="border-card" @tab-change="changeTab">
           <el-tab-pane label="数据趋势" name="dataTendency">
             <DataTendencyChart
-                :query="queryParams"
-                v-if="tabActiveName === 'dataTendency'"
-                :fetchCard="getCardData"
-                :fetch-line-month="getLineMonthData"
-                :fetch-line-week="getLineWeekData"
-                :fetchLine="getLineData">
+              :query="queryParams"
+              v-if="tabActiveName === 'dataTendency'"
+              :fetchCard="getCardData"
+              :fetch-line-month="getLineMonthData"
+              :fetch-line-week="getLineWeekData"
+              :fetchLine="getLineData">
             </DataTendencyChart>
           </el-tab-pane>
           <el-tab-pane label="广告结构" name="adStruct">
-            <AdStructChart v-if="tabActiveName === 'adStruct'"/>
+            <AdStructChart v-if="tabActiveName === 'adStruct'" />
           </el-tab-pane>
           <el-tab-pane label="散点视图" name="scatterView"></el-tab-pane>
         </el-tabs>
       </template>
       <template #cell_percentTimeInBudget="scope">
-        <el-progress :percentage="scope.row.percentTimeInBudget > 0 ? scope.row.percentTimeInBudget * 100 : 0"/>
+        <el-progress :percentage="scope.row.percentTimeInBudget > 0 ? scope.row.percentTimeInBudget * 100 : 0" />
       </template>
 
-      <template #cell_resolvedExpression_value="scope">
-        <el-tooltip effect="dark" placement="top">
-          <template #content>
+      <template #cell_resolvedExpression_value="{ row }">
+        <div style="display: flex">
+          <div style="min-width: 50px">
+            <!-- <img src="" alt=""> -->
+          </div>
+          <div>
+            <el-tooltip effect="dark" placement="top" :content="row.adGroupName">
+              <div class="ellipsis">
+                {{ row.adGroupName }}
+              </div>
+            </el-tooltip>
+            <div><span>ASIN: </span>{{ row.resolvedExpression[0].value }}</div>
+          </div>
+        </div>
+
+        <!-- <template #content>
             <p>{{ scope.row.resolvedExpression_value }}</p>
             {{ scope.row.ASIN }}
           </template>
           <div>
-            <el-link :underline="false" class="ellipsis-inline" style="color: rgb(30, 33, 40); display: inline-block; max-width: 100%;">
+            <el-link :underline="false" class="ellipsis-inline" style="color: rgb(30, 33, 40); display: inline-block; max-width: 100%">
               {{ scope.row.resolvedExpression_value }}
             </el-link>
-            <br>
+            <br />
             <span class="ellipsis">
               <span style="color: rgb(109, 119, 132)">ASIN: </span>
               <span style="color: rgb(30, 33, 40)">{{ scope.row.ASIN }}</span>
             </span>
-          </div>
-        </el-tooltip>
+          </div> -->
       </template>
-      
+
       <template #cell_campaignName="scope">
         <el-tooltip effect="dark" :content="scope.row.campaignName" placement="top">
           <el-link type="primary" :underline="false" @click="jumpGroup(scope.row)">
-            <div class="en-text">{{ scope.row.campaignName }}</div>
+            <div class="en-text">{{ scope.row.campaignName ? scope.row.campaignName : '--' }}</div>
           </el-link>
         </el-tooltip>
       </template>
@@ -59,29 +71,27 @@
       <template #cell_suggestedBid="scope">
         <div>{{ scope.row.suggestedBid ? `$${scope.row.suggestedBid}` : '--' }}</div>
         <div class="text-range">
-          {{ scope.row.suggestedBid_lower ? `$${scope.row.suggestedBid_lower}` : '--' }} ~ 
+          {{ scope.row.suggestedBid_lower ? `$${scope.row.suggestedBid_lower}` : '--' }} ~
           {{ scope.row.suggestedBid_upper ? `$${scope.row.suggestedBid_upper}` : '--' }}
         </div>
-      </template>      
-      <template #cell_MissedImpressions="scope">
-        {{ scope.row.MissedImpressionsLower ?? '0' }} ~ {{ scope.row.MissedImpressionsUpper ?? '0' }}
       </template>
+      <template #cell_MissedImpressions="scope"> {{ scope.row.MissedImpressionsLower ?? '0' }} ~ {{ scope.row.MissedImpressionsUpper ?? '0' }} </template>
       <template #cell_MissedClicks="scope"> {{ scope.row.MissedClicksLower ?? '0' }} ~ {{ scope.row.MissedClicksUpper ?? '0' }}</template>
       <template #cell_MissedSales="scope"> {{ scope.row.MissedSalesLower ?? '0' }} ~ {{ scope.row.MissedSalesUpper ?? '0' }}</template>
 
       <template v-for="field of Object.keys(SbBaseColumn)" #[`cell_${field}`]="scope">
         <DataCompare
-            :field="field"
-            :value="scope.row[field]"
-            :prev-val="scope.row[`prev${field}`]"
-            :gap-val="scope.row[`gap${field}`]"
-            :date-range="dateRange"
-            :show-compare="showCompare"/>
+          :field="field"
+          :value="scope.row[field]"
+          :prev-val="scope.row[`prev${field}`]"
+          :gap-val="scope.row[`gap${field}`]"
+          :date-range="dateRange"
+          :show-compare="showCompare" />
       </template>
       <template #toolbar-left>
         <div class="campare-switch">
           <span>数据对比 </span>
-          <el-switch v-model="showCompare" size="small"/>
+          <el-switch v-model="showCompare" size="small" />
         </div>
       </template>
     </fs-crud>
@@ -89,38 +99,36 @@
 </template>
 
 <script lang="ts" setup>
-import {nextTick, onMounted, ref, watch} from 'vue'
-import {FsPage, useFs} from '@fast-crud/fast-crud'
-import {createCrudOptions} from './crud'
-import {useRoute, useRouter} from 'vue-router'
+import { nextTick, onMounted, ref, watch } from 'vue'
+import { FsPage, useFs } from '@fast-crud/fast-crud'
+import { createCrudOptions } from './crud'
+import { useRoute, useRouter } from 'vue-router'
 import DataTendencyChart from '/@/views/adManage/sd/chartComponents/dataTendency.vue'
-import {useShopInfo} from '/@/stores/shopInfo'
-import {usePublicData} from '/@/stores/publicData'
+import { useShopInfo } from '/@/stores/shopInfo'
+import { usePublicData } from '/@/stores/publicData'
 import AdStructChart from './chartComponents/adStruct.vue'
-import {getCardData, getLineData, getLineMonthData, getLineWeekData} from './api'
-import {storeToRefs} from 'pinia'
-import {SbBaseColumn} from '/@/views/adManage/utils/commonTabColumn'
+import { getCardData, getLineData, getLineMonthData, getLineWeekData } from './api'
+import { storeToRefs } from 'pinia'
+import { SbBaseColumn } from '/@/views/adManage/utils/commonTabColumn'
 import DataCompare from '/@/components/dataCompare/index.vue'
 
-
 const tabActiveName = ref('dataTendency')
 const shopInfo = useShopInfo()
 const publicData = usePublicData()
-const {dateRange} = storeToRefs(publicData)
-const {profile} = storeToRefs(shopInfo)
+const { dateRange } = storeToRefs(publicData)
+const { profile } = storeToRefs(shopInfo)
 const queryParams = ref({
   profileId: profile.value.profile_id,
-  dateRange
+  dateRange,
 })
 
-const {crudBinding, crudRef, crudExpose} = useFs({createCrudOptions, context: queryParams})
+const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: queryParams })
 const route = useRoute()
 const router = useRouter()
 const adStructChartRef = ref()
 const dataTendencyRef = ref()
 const showCompare = ref(false)
 
-
 onMounted(() => {
   crudExpose.doRefresh()
 })
@@ -128,7 +136,7 @@ onMounted(() => {
 const jumpGroup = (row: any) => {
   router.push({
     name: 'CampaignDetail',
-    query: {campaignId: row.campaignId, tagsViewName: row.campaignName},
+    query: { campaignId: row.campaignId, tagsViewName: row.campaignName },
   })
 }
 
@@ -144,12 +152,15 @@ const changeTab = () => {
     resizeTabChart()
   })
 }
-defineExpose({resizeTabChart})
-
-watch(queryParams, async () => {
-  crudExpose.doRefresh()
-}, {deep: true})
-
+defineExpose({ resizeTabChart })
+
+watch(
+  queryParams,
+  async () => {
+    crudExpose.doRefresh()
+  },
+  { deep: true }
+)
 </script>
 
 <style lang="scss" scoped>
@@ -157,7 +168,7 @@ watch(queryParams, async () => {
   flex: none;
 }
 
-::v-deep(.el-table__footer-wrapper td.el-table__cell:nth-child(n+3):nth-child(-n+6) .cell) {
+::v-deep(.el-table__footer-wrapper td.el-table__cell:nth-child(n + 3):nth-child(-n + 6) .cell) {
   display: none;
 }
 
@@ -217,5 +228,4 @@ watch(queryParams, async () => {
   text-overflow: ellipsis;
   display: inline;
 }
-
 </style>

+ 2 - 2
src/views/productCenter/productAnalysis/components/SalesOverview/index.vue

@@ -112,7 +112,7 @@ onMounted(() => {
 <template>
   <div class="outer-container" v-loading="tableLoading">
     <vxe-grid v-bind="gridOptions">
-      <template #toolbar_buttons>
+      <!-- <template #toolbar_buttons>
         <vxe-input
           v-model="searchInp"
           @search-click="handleSearch"
@@ -123,7 +123,7 @@ onMounted(() => {
         <vxe-select v-model="selectVal" @change="handleSelect" class="custom-vxe-select">
           <vxe-option v-for="num in 15" :key="num" :value="num" :label="`选项${num}`"></vxe-option>
         </vxe-select>
-      </template>
+      </template> -->
 
       <template v-for="col in salesColumns" #[`${col.field}_default`]="{ row }">
         <div>

+ 2 - 1
src/views/productCenter/productAnalysis/components/TopParentAsin/index.vue

@@ -11,6 +11,7 @@ const dataSet = <any>ref({})
 const parentAsin = ref('')
 const childAsin = ref('')
 const sku = ref('')
+const rating = ref('')
 
 // 根据不同的点击事件发送请求获取数据
 emitter.on('useSelectItem-clickParentAsinBtn', (value: any) => {
@@ -113,7 +114,7 @@ onMounted(() => {
         <!-- TODO: 星级评分未完成 -->
         <div class="product-stars">
           <div>星级评分:</div>
-          <div>1231341231223213(2131)</div>
+          <el-rate v-model="rating" disabled show-score text-color="#ff9900" score-template="{value} ()" />
         </div>
       </div>
     </el-card>

+ 10 - 3
src/views/productCenter/productAnalysis/index.vue

@@ -57,15 +57,15 @@ function handleUpdate(value: any) {
   <div class="outer-container">
     <TopParentAsin></TopParentAsin>
     <div class="filters">
-      <DateRangePicker v-model="dateRange"></DateRangePicker>
-      <div v-show="activeName == 'trendOverview'">
+      <DateRangePicker v-model="dateRange" style="position: absolute; right: 25px; top: 173px; z-index: 9; border-radius: 20px"></DateRangePicker>
+      <!-- <div v-show="activeName == 'trendOverview'">
         <el-select v-model="filter1" placeholder="Select" style="width: 240px; margin-right: 8px">
           <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
         <el-select v-model="filter2" placeholder="Select" style="width: 240px">
           <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
-      </div>
+      </div> -->
     </div>
     <div>
       <el-tabs v-model="activeName" type="border-card" class="chart-tabs">
@@ -91,7 +91,14 @@ function handleUpdate(value: any) {
 }
 .filters {
   display: flex;
+  flex-direction: row-reverse;
   gap: 8px;
   margin-top: 5px;
 }
+/* :deep(.el-tabs--border-card > .el-tabs__header) {
+  background-color: transparent;
+} */
+:deep(.el-tabs.el-tabs--top.el-tabs--border-card.chart-tabs) {
+  border-radius: 8px;
+}
 </style>