添加注释

src/views/components/auto/auto-campaigns/target-rule.vue

@@ -5,13 +5,12 @@
  * @Author: Cheney
  */
 
-import { ref, computed } from 'vue';
+import { ref } from 'vue';
 import TargetSelect from '../target-select.vue';
 import SelectTmpl from './select-tmpl.vue';
 import FreqSetting from '../freq-setting.vue';
 import { userFormData } from './common';
 import TargetRuleSetting from '../target-rule-setting.vue';
-import XEUtils from 'xe-utils';
 
 interface Props {
   data: {
@@ -40,9 +39,10 @@ const submitForm = async () => {
     }
   });
 };
-const cancel = () => {
+
+function cancel() {
   emits('refresh');
-};
+}
 </script>
 
 <template>
@@ -52,10 +52,10 @@ const cancel = () => {
     <el-card class="mt-3">
       <el-form class="custom-card" :model="formData" label-position="top" ref="formRef">
         <el-form-item>
-          <!--<template #label>-->
-          <!--  <span class="custom-title-icon"></span>-->
-          <!--  <span class="asj-h3">生效对象</span>-->
-          <!--</template>-->
+          <!--<template #label>
+            <span class="custom-title-icon"></span>
+            <span class="asj-h3">生效对象</span>
+          </template>-->
           <FreqSetting :rule="formData.rule" :disabled="formData.useTmpl" />
           <el-divider />
           <TargetSelect

src/views/components/auto/auto-campaigns/timer-bid.vue

@@ -119,7 +119,7 @@ function handleClose() {
               <strong>自动化分时规则：</strong>
               <p>
                 1.
-                应用分时调价后，如需手动修改竞价，只能在Xmars操作。在亚马逊后台或其他第三方系统进行的调价操作，竞价将会被Xmars当前时段的自动化执行结果覆盖。
+                应用分时调价后，如需手动修改竞价，只能在此操作。在亚马逊后台或其他第三方系统进行的调价操作，竞价将会被当前时段的自动化执行结果覆盖。
               </p>
               <p>2. 广告活动开启分时调价，规则的修改将在下一个整点生效。</p>
             </div>

src/views/components/auto/search-term-add.vue

@@ -1,3 +1,59 @@
+<script lang="ts" setup>
+/**
+ * @Name: search-term-add.vue
+ * @Description: 自动化-添加搜索词
+ * @Author: Cheney
+ */
+import { ref } from 'vue';
+import { Delete, Plus } from '@element-plus/icons-vue';
+import CampaignSelect from '/@/views/components/campaign-select/index.vue';
+import AdGroupSelect from '/@/views/components/ad-group-select/index.vue';
+
+interface Props {
+  rule: AutoRule;
+  disabled?: boolean;
+}
+
+const props = defineProps<Props>();
+const formRef = ref();
+
+function addCampaignAd() {
+  props.rule.campaignAd.push({
+    campaignType: 'sp',
+    campaignId: '',
+    adGroupId: '',
+  });
+}
+
+if (props.rule.campaignAd.length === 0) {
+  addCampaignAd();
+}
+
+if (!props.rule.activeModel) {
+  props.rule.activeModel = 'all';
+}
+
+function delCampaignAd(index: number) {
+  props.rule.campaignAd.splice(index, 1);
+}
+
+async function changeCampaignType(info: any) {
+  info.campaignId = '';
+  info.adGroupId = '';
+}
+
+async function validate() {
+  let ret = true;
+  if (!formRef.value) return ret;
+  await formRef.value.validate(async (valid: boolean) => {
+    ret = valid;
+  });
+  return ret;
+}
+
+defineExpose({ validate });
+</script>
+
 <template>
   <div>
     <div class="asj-h3">
@@ -49,53 +105,6 @@
   </div>
 </template>
 
-<script lang="ts" setup>
-import { ref, onMounted } from 'vue';
-import { Plus, Delete } from '@element-plus/icons-vue';
-import CampaignSelect from '/@/views/components/campaign-select/index.vue';
-import AdGroupSelect from '/@/views/components/ad-group-select/index.vue';
-
-interface Props {
-  rule: AutoRule;
-  disabled?: boolean;
-}
-
-const props = defineProps<Props>();
-const formRef = ref();
-
-const addCampaignAd = () => {
-  props.rule.campaignAd.push({
-    campaignType: 'sp',
-    campaignId: '',
-    adGroupId: '',
-  });
-};
-if (props.rule.campaignAd.length === 0) {
-  addCampaignAd();
-}
-if (!props.rule.activeModel) {
-  props.rule.activeModel = 'all';
-}
-const delCampaignAd = (index: number) => {
-  props.rule.campaignAd.splice(index, 1);
-};
-
-const changeCampaignType = async (info: any) => {
-  info.campaignId = '';
-  info.adGroupId = '';
-};
-
-const validate = async () => {
-  let ret = true;
-  if (!formRef.value) return ret;
-  await formRef.value.validate(async (valid: boolean) => {
-    ret = valid;
-  });
-  return ret;
-};
-defineExpose({ validate });
-</script>
-
 <style scoped>
 .custom-title-icon {
   padding-right: 10px;

src/views/components/auto/search-term-bid.vue

@@ -1,57 +1,73 @@
-<template>
-  <div>
-    <div class="asj-h3">
-      <span class="custom-title-icon"></span>
-      设置竞价
-    </div>
-    <div>关键词竞价：</div>
-    <div v-for="(info, index) in action.keywords" class="bid">
-      <el-checkbox v-model="info.use" :label="info.matchType">{{ MatchTypeMap[info.matchType] }}</el-checkbox>
-      <STBidInput :bid-data="info" :index="index" v-show="info.use"></STBidInput>
-    </div>
-    <div>商品定向竞价：</div>
-    <div class="bid target">
-      <el-checkbox label="target" v-model="action.target.use">竞价</el-checkbox>
-      <STBidInput :bid-data="action.target" v-show="action.target.use"></STBidInput>
-    </div>
-    <p v-show="!valid" style="font-size: small; color: #f56c6c">请至少设置一种竞价方式！</p>
-  </div>
-</template>
-
 <script lang="ts" setup>
-import { ref, onMounted, onBeforeMount, Ref, computed } from 'vue'
-import STBidInput from './st-bid-input.vue'
-import XEUtils from 'xe-utils'
+/**
+ * @Name: search-term-bid.vue
+ * @Description: 自动化-添加搜索词-设置竞价
+ * @Author: Cheney
+ */
+
+import { computed } from 'vue';
+import STBidInput from './st-bid-input.vue';
+import XEUtils from 'xe-utils';
 
 interface Props {
-  action: RuleSearchTermAction
+  action: RuleSearchTermAction;
 }
-const props = defineProps<Props>()
+
+const props = defineProps<Props>();
 const MatchTypeMap = {
   EXACT: '精准匹配',
   BROAD: '广泛匹配',
   PHRASE: '词组匹配',
-}
+};
 if (!props.action.keywords) {
   props.action.keywords = [
     { bidType: '1', type: 'increase', numType: '1', defaultBidding: '1.00', min: '', max: '', matchType: 'EXACT', use: false },
     { bidType: '1', type: 'increase', numType: '1', defaultBidding: '1.00', min: '', max: '', matchType: 'BROAD', use: false },
     { bidType: '1', type: 'increase', numType: '1', defaultBidding: '1.00', min: '', max: '', matchType: 'PHRASE', use: false },
-  ]
+  ];
 }
 if (!props.action.target) {
-  props.action.target = { bidType: '1', type: 'increase', numType: '1', defaultBidding: '1', min: '', max: '', matchType: 'EXACT', use: false }
+  props.action.target = {
+    bidType: '1',
+    type: 'increase',
+    numType: '1',
+    defaultBidding: '1',
+    min: '',
+    max: '',
+    matchType: 'EXACT',
+    use: false,
+  };
 }
 
 const valid = computed(() => {
-  const index = XEUtils.findIndexOf(props.action.keywords, (item) => item.use)
-  if (index !== -1) return true
-  return props.action.target.use
-})
+  const index = XEUtils.findIndexOf(props.action.keywords, (item) => item.use);
+  if (index !== -1) return true;
+  return props.action.target.use;
+});
 
-defineExpose({ valid })
+defineExpose({ valid });
 </script>
 
+<template>
+  <div>
+    <div class="asj-h3">
+      <span class="custom-title-icon"></span>
+      设置竞价
+    </div>
+    <div>关键词竞价：</div>
+    <div v-for="(info, index) in action.keywords" class="bid">
+      <el-checkbox v-model="info.use" :label="info.matchType">{{ MatchTypeMap[info.matchType] }}</el-checkbox>
+      <STBidInput :bid-data="info" :index="index" v-show="info.use"></STBidInput>
+    </div>
+    <div>商品定向竞价：</div>
+    <div class="bid target">
+      <el-checkbox label="target" v-model="action.target.use">竞价</el-checkbox>
+      <STBidInput :bid-data="action.target" v-show="action.target.use"></STBidInput>
+    </div>
+    <p v-show="!valid" style="font-size: small; color: #f56c6c">请至少设置一种竞价方式！</p>
+  </div>
+</template>
+
 <style scoped>
 .bid {
   display: flex;
@@ -63,6 +79,7 @@ defineExpose({ valid })
   margin-left: 23px;
   height: 50px;
 }
+
 .target {
   gap: 49px;
 }

src/views/components/auto/target-select.vue

@@ -1,14 +1,18 @@
 <script lang="ts" setup>
-import { ref, watch } from 'vue'
-import AdGroupSelect from '/@/views/components/ad-group-select/index.vue'
+/**
+ * @Name: target-select.vue
+ * @Description: 自动化-定向规则-生效对象
+ * @Author: Cheney
+ */
+import AdGroupSelect from '/@/views/components/ad-group-select/index.vue';
 
 interface Props {
-  mode: string,
-  data: AutoRule,
-  useTmpl?: boolean,
-  campaignId: string
+  mode: string;
+  data: AutoRule;
+  useTmpl?: boolean;
+  campaignId: string;
 }
-const props = defineProps<Props>()
+const props = defineProps<Props>();
 </script>
 
 <template>
@@ -18,28 +22,30 @@ const props = defineProps<Props>()
     <div style="display: flex; flex-direction: column; align-items: flex-start">
       <div style="margin: 5px 0">
         <span>广告类型：</span>
-        <el-select v-model="data.campaignType" :disabled="mode==='edit' || useTmpl">
+        <el-select v-model="data.campaignType" :disabled="mode === 'edit' || useTmpl">
           <el-option label="SP" value="sp"></el-option>
           <el-option label="SB" value="sb"></el-option>
           <el-option label="SD" value="sd"></el-option>
         </el-select>
       </div>
-      <el-radio-group v-model="data.activeModel" :disabled="mode==='edit' || useTmpl">
+      <el-radio-group v-model="data.activeModel" :disabled="mode === 'edit' || useTmpl">
         <div class="target-radio-group">
           <el-radio label="campaign">当前广告活动（所有定向）</el-radio>
           <div class="target-radio-group-item">
             <el-radio label="adGroup">当前广告活动的指定广告组（所有定向）</el-radio>
             <AdGroupSelect
-                v-show="mode === 'auto' && data.activeModel === 'adGroup'"
-                v-model="data.campaignAd"
-                style="padding-left: 23px;width: 450px;"
-                :multiple="true"
-                :query="{ profileId: '3006125408623189', campaignType: data.campaignType, campaignId: campaignId }">
+              v-show="mode === 'auto' && data.activeModel === 'adGroup'"
+              v-model="data.campaignAd"
+              style="padding-left: 23px; width: 450px"
+              :multiple="true"
+              :query="{ profileId: '3006125408623189', campaignType: data.campaignType, campaignId: campaignId }">
             </AdGroupSelect>
           </div>
           <div class="target-radio-group-item">
             <el-radio label="specified">指定定向</el-radio>
-            <el-button v-show="mode === 'auto' && data.activeModel === 'specified'" style="margin-left: 20px; color: blue" link>选择定向</el-button>
+            <el-button v-show="mode === 'auto' && data.activeModel === 'specified'" style="margin-left: 20px; color: blue" link
+              >选择定向</el-button
+            >
           </div>
         </div>
       </el-radio-group>