From d30f91bc1b90dee2d829ae5523de90c95a091fcd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=8E=8B=E5=8D=9A=E5=86=89?= <mail_b_r@163.com>
Date: Tue, 1 Nov 2022 10:59:14 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E4=BC=81=E5=BE=AE=E6=8A=95?=
 =?UTF-8?q?=E6=94=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/img/business_wechat.png            | Bin 0 -> 1292 bytes
 src/router/index.js                           |   6 +
 .../components/enterpriseBasicInformation.vue | 472 ++++++++++++++++++
 .../enterpriseQuantityLimitTable.vue          |  95 ++++
 .../launch-center/launch-task/create.vue      |   1 +
 .../launch-task/enterpriseWeChat.vue          | 394 +++++++++++++++
 .../launch-center/launch-task/index.vue       | 133 ++++-
 7 files changed, 1093 insertions(+), 8 deletions(-)
 create mode 100644 src/assets/img/business_wechat.png
 create mode 100644 src/views/Publish/launch-center/components/enterpriseBasicInformation.vue
 create mode 100644 src/views/Publish/launch-center/components/enterpriseQuantityLimitTable.vue
 create mode 100644 src/views/Publish/launch-center/launch-task/enterpriseWeChat.vue

diff --git a/src/assets/img/business_wechat.png b/src/assets/img/business_wechat.png
new file mode 100644
index 0000000000000000000000000000000000000000..4f2d14b1024eebc935153e265be357db1ddbfb3c
GIT binary patch
literal 1292
zcmV+n1@roeP)<h;3K|Lk000e1NJLTq001Na0015c1^@s6MB%(s00001b5ch_0Itp)
z=>Px(#z{m$R9Hvtmuqa3RT#&A@B8+;b_~|+!etVMMKdnWEi*{a8Fd865Q8<DI>4cc
zqJanrA5_3ZO(X^)5fYF^K_CtWh7Z$lNn~mi<fhyN6$pZWuuIpq>ves5%vnK3()F?>
z#t*z{nkGGc&hPx6|MQ%uiV#BZKYEnAKq;~@Fogv4<Xe$1`AHdY@-qgKmU9QA{MOdZ
zsg?+ry*d#cvP~Le917zL%s6vRm^8ItcxeMkkUu)YtUl;v+pj8tm=OaCCN+jpgODC0
zEKCR#M%w}`nPlRbaW-;HhKy883n-$;s6Xc6?PiFfQC=A4`SB`M&TR6sjA)7=tiw5X
zh;7IHG@Und(QBY2C%_h0HskUwX{(hINWv`I<K~l7CQ5T7)IXiYgggt1qV}9T{(k2Z
z6@s-twe#Kqm2O?9sm8*iMRpV=wa1bI#f0FU=2li5vNN~D$GRE$7*uK9)PW`9nRY+Z
zw)*gfRer3?rX<grGJQ#bj$HFmxe=z^8)ApcfkBff>A~FE`NR!Bm77D9<m!C)q64F*
zC57q}NUAfVp@qX&jGTDQ#xT37Uu7+u!K#C9mNi>xe72hz&O!YHy5<XW{~AB@%2ZZQ
z9h_3?WD7juD5E}hGu>%q>&(GPz0{{dO&7YD)d;(0399eQ9uSbcEobfY@blFm=NA@W
zR1=j#e2auYQsxauJ6Q0I#<4mR<MS;80+K&oyyrUGPDVMmXc#tQhCnjFrsG~-*`si9
zwnEu(`+$LDV~wI?P_(3l(Pzq<FZr0-AgG@jWlrgkei{1KDLj!jUOG}mw+K;RzK;TH
zQJ)9w6UZBl;rz%$`G^=_)i_YoXli}!(s*G#?_XUY4Z{54%b8!iJaZr^@$36K`TV%X
z-sco1-(%~SO45&4{70!hTuq1S#%U^{apEB~#hef-X=A+Rk5IbaOO6Q+yqrUx)tG^o
z1VTiJwy!}%TF~>Cay@jJ56`|uMeaoEir-9F{z-uZg5Br5xOVCk503Kn3ptD&l=x)5
zNp-yy{jY^+;X?@3fmXa1G}+4(qOl0OFK*}P<;OVnH>{gkNTE$O-6Un-JGe~Um%n?d
z-KF7j`q<(cn)LFJDblYmLu>s2lo-*%6&M^#h+8mz?R<O5N7WY!x-c-mG|1ZNL;j7K
z^0t=&PTuIEVx!KxkASPh%;Mc{0>VgT5sV#b#AZ<F=+gQA&k%DTv{Po=g?9B-1Xg0B
z_oG=S+$?noBv`t?jTMJ;5Tcuvl_B1k<j4$Y`{_<<n+#MA@8p*j8(mR>L39%)e!nRq
zKEP@SYMpL2xC$Y78ljr-G_1z{<N_>3r9EpedV)OuX(u(MMykhHC?96U+-tf_OQEx^
zK_-3HMVD^oiIG88Rt=&s+dzvyMq40CL>JgiDg`!`0=ogL;db*2-#9~b)ifAYfnN3$
zYrT`HeqbnL^DI5BB(B-*X*?|;>7(=QLD~a4Wh1g~-bHagNNwcU8h_%Udk-k`+u)XY
zSbo@yP&LAJo3K{YfO320&KT$pli#X_3>rY-*bdC~vr&i<np02K!*l!mgOZj)8SI^K
zsn8>Yk2Ij`5v&i@q8R0jop{juPk=Hx&|RQZYW)LJEG5N3p14B*0000<MNUMnLSTZZ
C`)pVM

literal 0
HcmV?d00001

diff --git a/src/router/index.js b/src/router/index.js
index 518f8f89..383db63c 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -275,6 +275,12 @@ const constantRoutes = [
             meta: { showPreview: false, showPublish: false, keepAlive: true, showShare: true },
             component: () => import(/* webpackChunkName: "publish" */ '@/views/Publish/launch-center/launch-task/create')
           },
+          {
+            path: 'enterprise-weChat',
+            name: 'enterprise-weChat',
+            meta: { showPreview: false, showPublish: false, keepAlive: true, showShare: true },
+            component: () => import(/* webpackChunkName: "publish" */ '@/views/Publish/launch-center/launch-task/enterpriseWeChat')
+          },
           // {
           //   path: "link",
           //   name: "link",
diff --git a/src/views/Publish/launch-center/components/enterpriseBasicInformation.vue b/src/views/Publish/launch-center/components/enterpriseBasicInformation.vue
new file mode 100644
index 00000000..f46297fd
--- /dev/null
+++ b/src/views/Publish/launch-center/components/enterpriseBasicInformation.vue
@@ -0,0 +1,472 @@
+<template>
+  <div class="link-container">
+    <sub-title>基本信息</sub-title>
+    <!-- <div class="title">分享链接</div> -->
+    <div class="content">
+      <a-form
+        ref="formRef"
+        :model="formState"
+        :rules="rules"
+        :label-col="labelCol"
+        :wrapper-col="wrapperCol"
+      >
+        <a-form-item ref="deliveryName" label="投放名称" name="deliveryName">
+          <a-input
+            placeholder="请输入本次投放名称"
+            v-model:value="formState.deliveryName"
+            :disabled="!iscreate"
+            :show-count="true"
+            :maxlength="50"
+            class="input"
+          >
+            <template #suffix
+              ><span class="show-count"> {{ formState.deliveryName.length }}/50</span>
+            </template>
+          </a-input>
+        </a-form-item>
+        <!-- <a-form-item ref="attachment" label="附件" name="attachment">
+          <div class="attachment" v-if="iscreate">
+            <span class="input-upload-show" v-if="formState.attachmentName">
+              {{ formState.attachmentName }}
+              <i
+                class="icon iconfont curror"
+                @click="
+                  () => {
+                    if (iscreate) {
+                      deleteUpdate();
+                    }
+                  }
+                "
+                >&#xe694;</i
+              >
+            </span>
+            <a-upload
+              v-else
+              :customRequest="onCustomRequest"
+              :beforeUpload="onBeforeUpload"
+              v-model:file-list="fileList"
+              :accept="'.jpg,.jpeg,.png,.pdf,.rar,.zip'"
+              :showUploadList="false"
+              :directory="false"
+              @change="onUpload"
+              :disabled="!iscreate"
+            >
+              <a-button class="input-upload">
+                <upload-outlined @change="onUpload"></upload-outlined>
+                上传文件
+              </a-button>
+            </a-upload>
+            <span class="show-upload-accept"> 支持扩展名:.jpg .jpeg .png .pdf .rar .zip</span>
+          </div>
+          <div class="attachment" v-if="!iscreate">
+            <a @click="onOpen(formState)"> {{ formState.attachmentName }}</a>
+          </div>
+        </a-form-item> -->
+        <!-- <a-form-item ref="description" label="投放描述" name="description">
+          <a-textarea
+            placeholder="系统会将作答设置信息自动同步，如有额外的投放描述，请在此输入…"
+            v-model:value="formState.description"
+            :auto-size="{ minRows: 5, maxRows: 5 }"
+            type="text-area"
+            :disabled="!iscreate"
+            :maxlength="200"
+            :show-count="true"
+          >
+          </a-textarea>
+        </a-form-item> -->
+        <a-form-item label="样本数量限制" name="">
+          <a-switch class="custom-switch" v-model:checked="formState.checked" />
+          <span v-if="!formState.checked">（不开启样本数量限制）</span>
+          <div class="limitation" v-else>
+            <span>&nbsp; 样本数量达到&nbsp; </span>
+            <a-input-number :min="1" :max="100000" v-model:value="formState.number" />
+            <span>&nbsp; 时，停止收集数据</span>
+          </div>
+        </a-form-item>
+        <a-form-item label="问卷链接" name="">
+          <div class="copy">
+            <a-input v-model:value="formState.code" style="width: 580px"></a-input>
+            <div class="copy-btn" @click="handleCopy">
+              <img class="copy-icon" :src="require('@/assets/img/publish/copy_icon.png')" alt="" />
+              <span>复制</span>
+            </div>
+          </div>
+        </a-form-item>
+      </a-form>
+    </div>
+  </div>
+</template>
+
+<script>
+import { ref, reactive } from "@vue/reactivity";
+import SubTitle from "@/views/DataAnalyse/components/SubTitle.vue";
+import { UploadOutlined } from "@ant-design/icons-vue";
+import common from "@/api/common.js";
+import { Modal, message } from "ant-design-vue";
+import { useRoute } from "vue-router";
+import { deliveryPlan } from "../api/php";
+import { onMounted } from "@vue/runtime-core";
+
+export default {
+  name: "share-links",
+  components: {
+    SubTitle,
+    // UploadOutlined,
+  },
+  props: {
+    status: {
+      type: Number,
+      default: () => 0,
+    },
+    isCreate: {
+      type: Boolean,
+      default: () => true,
+    },
+  },
+  setup(props, context) {
+    const formRef = ref();
+
+    /*上传文件配置 */
+
+    const accept = "";
+    const route = useRoute();
+    const iscreate = ref(route.query.iscreate === "1");
+
+    const isUpload = ref(false);
+
+    const fileList = ref([]);
+
+    const rules = {
+      deliveryName: [
+        {
+          required: true,
+          message: "请输入本次投放名称",
+          trigger: "blur",
+        },
+        // { min: 3, max: 5, message: "Length should be 3 to 5", trigger: "blur" },
+      ],
+      attachmentName: [
+        {
+          required: true,
+          message: "请上传附件",
+          trigger: "change",
+          trigger: "blur",
+        },
+      ],
+      // description: [
+      //   {
+      //     required: true,
+      //     message: "请输入投放描述",
+      //     trigger: "change",
+      //     trigger: "blur",
+      //   },
+      // ],
+    };
+    const formState = ref({
+      deliveryName: "",
+      checked: false,
+      number: null,
+      code: "",
+
+      attachmentName: "",
+      description: "",
+      attachment: [],
+    });
+    const onSubmit = () => {
+      return formRef.value.validate();
+    };
+    const resetForm = () => {
+      formRef.value.resetFields();
+    };
+
+    /*上传文件配置 */
+    const onCustomRequest = (file) => {
+      console.log(file || file?.file || file?.file?.originFileObj);
+    };
+    /*上传文件配置 */
+    const onBeforeUpload = (file) => {
+      file = file?.file || file?.file?.originFileObj || file;
+      console.log(file);
+      const isLt50M = file.size / 1024 / 1024 < 50;
+      if (!isLt50M) {
+        Modal.error({
+          title: "提示",
+          content: "上传文件需小于50MB!",
+        });
+        return false;
+      }
+      return true;
+    };
+
+    /* 上传文件 */
+    const onUpload = async (file) => {
+      file = file?.file && file?.file?.originFileObj;
+      console.log(file);
+
+      const data = await common.cosUpload(file, file.name, "", () => {});
+      console.log(data);
+      fileList.value = [];
+      formState.value.attachmentName = data?.name || file?.name;
+      formState.value.attachment = [
+        {
+          url: data?.url || file?.name,
+          name: file?.name,
+          attachmentId: data?.attachmentId || file?.name,
+        },
+      ];
+      isUpload.value = false;
+    };
+
+    const deleteUpdate = () => {
+      console.log("deleteUpdate");
+      formState.value.attachment = "";
+      formState.value.attachmentName = "";
+      formState.value.attachment = [];
+      fileList.value = [];
+    };
+
+    const getData = async () => {
+      if (!iscreate.value) {
+        const data = await deliveryPlan({
+          sn: route.query.sn,
+          deliveryPlanId: route.query.id,
+        });
+        // console.log(data);
+        formState.value.deliveryName = data.data.title;
+        formState.value.description = data.data.memo;
+        if (data.data.attachment.length > 0) {
+          formState.value.attachmentName = data.data.attachment[0].name;
+          formState.value.attachment = data.data.attachment;
+        } else {
+          formState.value.attachmentName = "";
+          formState.value.attachment = [];
+        }
+      }
+    };
+
+    onMounted(() => {
+      getData();
+    });
+
+    const onOpen = (value) => {
+      window.open(value.attachment[0].url);
+    };
+
+    const handleCopy = (text) => {
+      let input = document.createElement("input");
+      input.value = formState.value.code;
+      document.body.appendChild(input);
+      input.select();
+      document.execCommand("Copy");
+      document.body.removeChild(input);
+      message.success("复制成功");
+    };
+
+    return {
+      formRef,
+      labelCol: {
+        span: 3,
+        style: {
+          "text-align": "left",
+        },
+      },
+      wrapperCol: { span: 14 },
+      other: "",
+      formState,
+      rules,
+      isUpload,
+      fileList,
+      iscreate,
+      onBeforeUpload,
+      deleteUpdate,
+      onCustomRequest,
+      onSubmit,
+      resetForm,
+      onUpload,
+      onOpen,
+      handleCopy,
+    };
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.link-container {
+  padding: 32px 24px;
+  background: #fff;
+  .title {
+    font-size: 16px;
+    font-weight: bold;
+  }
+  .content {
+    margin-top: 16px;
+    .limitation {
+      display: inline-block;
+    }
+  }
+  .left {
+    display: flex;
+  }
+  .isEditTable {
+    ::v-deep .ant-table-tbody > tr:hover:not(.ant-table-expanded-row) > td,
+    .ant-table-row-hover,
+    .ant-table-row-hover > td .rowClass {
+      background-color: #f6f7fa !important;
+      color: #e1e2e5;
+      a {
+        color: #e1e2e5;
+      }
+    }
+    .is_copy {
+      color: #2575fe;
+    }
+    .is_onmouse {
+      color: #e1e2e5;
+      padding-left: 15px;
+      position: relative;
+      &::before {
+        position: absolute;
+        top: 5px;
+        left: 0;
+        content: "";
+        width: 10px;
+        height: 10px;
+        background-color: #e1e2e5;
+        border-radius: 50%;
+      }
+    }
+  }
+  .tableBox {
+    margin-top: 16px;
+    .is_active {
+      color: #30c57c;
+      padding-left: 15px;
+      position: relative;
+      &::before {
+        position: absolute;
+        top: 5px;
+        left: 0;
+        content: "";
+        width: 10px;
+        height: 10px;
+        background-color: #30c57c;
+        border-radius: 50%;
+      }
+    }
+    .is_pause {
+      color: #8c8c8c;
+      padding-left: 15px;
+      position: relative;
+      &::before {
+        position: absolute;
+        top: 5px;
+        left: 0;
+        content: "";
+        width: 10px;
+        height: 10px;
+        background-color: #8c8c8c;
+        border-radius: 50%;
+      }
+    }
+  }
+  .customer {
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 25px;
+  }
+  .right {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    margin-left: 54px;
+  }
+  .copy {
+    display: flex;
+  }
+  .copy-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 76px;
+    height: 32px;
+    border-radius: 2px;
+    box-shadow: 0 2px 0 rgb(0 0 0 / 2%);
+    cursor: pointer;
+    background: #f5f5f5;
+    &:hover {
+      background: #d9d9d9;
+    }
+  }
+  .copy-icon {
+    width: 16px;
+    height: 16px;
+  }
+  .share-icon {
+    width: 16px;
+    height: 16px;
+  }
+  .qrcode {
+    width: 80px;
+    height: 80px;
+  }
+  .qrcode img {
+    display: block;
+    width: 100%;
+    height: 100%;
+  }
+  .download {
+    margin-top: 12px;
+    font-size: 14px;
+    color: #70b936;
+  }
+  .download-icon {
+    width: 16px;
+    height: 16px;
+  }
+}
+.input {
+  width: 328px;
+  height: 32px;
+  opacity: 1;
+  border-radius: 5px;
+}
+.input-upload {
+  width: 103px;
+  height: 32px;
+  border-radius: 5px;
+  font-size: 14px;
+}
+.input-upload-show {
+  min-width: 96px;
+  padding: 0 10px;
+  background: #fafafa;
+  opacity: 1;
+  height: 32px;
+  line-height: 32px;
+  border-radius: 5px;
+  font-size: 12px;
+  display: flex;
+  .iconfont {
+    color: #d9d9d9;
+    font-size: 14px;
+    flex: 1;
+    text-align: right;
+  }
+}
+.attachment {
+  display: flex;
+  justify-content: left;
+  align-items: center;
+}
+.curror {
+  cursor: pointer;
+}
+.show-upload-accept {
+  margin-left: 20px;
+  color: rgb(191, 191, 191);
+}
+.show-count {
+  color: rgb(191, 191, 191);
+}
+</style>
diff --git a/src/views/Publish/launch-center/components/enterpriseQuantityLimitTable.vue b/src/views/Publish/launch-center/components/enterpriseQuantityLimitTable.vue
new file mode 100644
index 00000000..91adda4a
--- /dev/null
+++ b/src/views/Publish/launch-center/components/enterpriseQuantityLimitTable.vue
@@ -0,0 +1,95 @@
+<template>
+  <div class="content">
+    <a-form
+      ref="formRef"
+      :model="formState"
+      :rules="rules"
+      :label-col="labelCol"
+      :wrapper-col="wrapperCol"
+    >
+      <a-form-item label="消息接收者" name="">
+        <a-input
+          placeholder="请输入本次投放名称"
+          v-model:value="formState.deliveryName"
+          :show-count="true"
+          :maxlength="50"
+          class="input"
+        >
+          <template #suffix
+            ><span class="show-count"> {{ formState.deliveryName.length }}/50</span>
+          </template>
+        </a-input>
+        <a-button type="text" class="custom-button" @click="addLogicHandle">
+          <div class="flex-align">
+            <i class="iconfont">&#xe689;</i>
+            <span style="margin-left: 6px">新增人群包</span>
+          </div>
+        </a-button>
+        <a-button type="text" class="custom-button" @click="addLogicHandle">
+          <div class="flex-align">
+            <i class="iconfont">&#xe689;</i>
+            <span style="margin-left: 6px">查看人群包</span>
+          </div>
+        </a-button>
+      </a-form-item>
+      <a-form-item label="消息内容" name="">
+        <a-textarea
+          placeholder="系统会将作答设置信息自动同步，如有额外的投放描述，请在此输入…"
+          v-model:value="formState.description"
+          :auto-size="{ minRows: 5, maxRows: 5 }"
+          type="text-area"
+          :maxlength="200"
+          :show-count="true"
+          style="min-width:580px"
+        >
+        </a-textarea>
+      </a-form-item>
+      <a-form-item label="消息展现示例" name="">
+        <div style="width: 720px;height: 263px;background: #F9F9F9;opacity: 1;display: flex;justify-content: center;padding-top: 30px;">
+          <img style="width: 45px;height: 37px;margin-right: 15px;" :src="require('@/assets/img/business_wechat.png')" alt="">
+          <div style="width: 605px;height: 76px;background: #FFF;border-radius: 4px 4px 4px 4px;opacity: 0.7;padding: 10px;">
+            <span style="color:#000">您好！我们诚邀您参加本次问卷调研。点击</span>
+            <span style="color:#70B936"> xxxx品牌新品调研</span>
+            <span style="color:#000"> 即可参与。感谢您的支持。</span>
+          </div>
+        </div>
+      </a-form-item>
+    </a-form>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+
+defineProps({
+  
+})
+  const formState = ref({
+    deliveryName: "",
+    checked: false,
+    number: null,
+    code: "",
+
+    attachmentName: "",
+    description: "",
+    attachment: [],
+  });
+  const labelCol = ref({
+    span: 6,
+    style: {
+      "text-align": "left",
+    },
+  })
+  const wrapperCol = ref({ span: 18 })
+
+</script>
+
+<style lang="scss" scoped>
+.input {
+  width: 328px;
+  height: 32px;
+  opacity: 1;
+  border-radius: 5px;
+}
+
+</style>
diff --git a/src/views/Publish/launch-center/launch-task/create.vue b/src/views/Publish/launch-center/launch-task/create.vue
index c23c4d9e..da8a3182 100644
--- a/src/views/Publish/launch-center/launch-task/create.vue
+++ b/src/views/Publish/launch-center/launch-task/create.vue
@@ -252,6 +252,7 @@ export default {
   .link-container {
     padding: 32px 24px;
     background: #fff;
+    box-shadow: 0px 0px 6px 0px rgb(0 0 0 / 10%);
     .title {
       font-size: 16px;
       font-weight: bold;
diff --git a/src/views/Publish/launch-center/launch-task/enterpriseWeChat.vue b/src/views/Publish/launch-center/launch-task/enterpriseWeChat.vue
new file mode 100644
index 00000000..0943b3e6
--- /dev/null
+++ b/src/views/Publish/launch-center/launch-task/enterpriseWeChat.vue
@@ -0,0 +1,394 @@
+<template>
+    <div class="launch-center-create">
+      <basicInformation ref="basicInformationRef" :isCreate="isCreate"></basicInformation>
+      <div class="link-container" style="margin-top: 20px">
+        <div class="customer">
+          <sub-title>渠道应用信息</sub-title>
+          <!-- <div class="customer-btn" style="text-align: right">
+            <a-button type="primary" style="margin-right: 12px" @click="open" v-if="isCreate">
+              <i class="iconfont icon-tianjia mr-10"></i>
+              添加渠道应用
+            </a-button>
+          </div> -->
+        </div>
+        <div class="tableBox">
+          <quantityLimitTable
+            :isCreate="isCreate"
+            v-model:datasource="datasource"
+            @deleteRecord="deleteRecord"
+            @update:datasource="onUpdate"
+            :publish_number="publish_number"
+            ref="quantityLimitTableRef"
+          ></quantityLimitTable>
+          <!-- <launchListEmpty v-else></launchListEmpty> -->
+        </div>
+        <div class="customer-btn" style="text-align: right">
+          <a-button type="primary" style="margin-right: 12px" v-if="isCreate" @click="save">
+            确定投放
+          </a-button>
+        </div>
+      </div>
+      <addChannelApplication
+        ref="addChannelApplicationRef"
+        :datasource="datasource"
+        @selectRows="onSelectRows"
+      ></addChannelApplication>
+    </div>
+  </template>
+  
+  <script>
+  import basicInformation from "../components/enterpriseBasicInformation.vue";
+  import SubTitle from "@/views/DataAnalyse/components/SubTitle.vue";
+  import quantityLimitTable from "../components/enterpriseQuantityLimitTable.vue";
+  import launchListEmpty from "../components/launchListEmpty.vue";
+  import { useRoute, useRouter } from "vue-router";
+  import { onMounted, ref, watch } from "@vue/runtime-core";
+  import addChannelApplication from "../components/createChannelApplication.vue";
+  import { add, channels } from "../api/php";
+  import { getQrcode } from "@/api/publish";
+  import { getAnswerSetting } from "@/views/planetDesign/api/api";
+  import { Modal } from "ant-design-vue";
+  
+  export default {
+    components: {
+      basicInformation,
+      quantityLimitTable,
+    //   launchListEmpty,
+      SubTitle,
+      addChannelApplication,
+    },
+    setup() {
+      const route = useRoute();
+      const isCreate = ref(false);
+      const addChannelApplicationRef = ref();
+      const basicInformationRef = ref();
+      const datasource = ref([]);
+      const loading = ref(false);
+      const publish_number = ref(0);
+      const quantityLimitTableRef = ref();
+      const id = ref();
+      const router = useRouter();
+      isCreate.value = route.query.iscreate === "1" ? true : false;
+  
+      watch(
+        () => route.query.iscreate,
+        (value) => {
+          isCreate.value = value === "1" ? true : false;
+        }
+      );
+      watch(
+        () => route.query.id,
+        (value) => {
+          id.value = value;
+          getList();
+        }
+      );
+      id.value = route.query.id;
+  
+      const open = () => {
+        addChannelApplicationRef.value.showModal(datasource.value);
+      };
+  
+      const onSelectRows = (value) => {
+        datasource.value = JSON.parse(JSON.stringify(value));
+        console.log("onSelectRows", value);
+      };
+      const deleteRecord = (recode) => {
+        datasource.value = JSON.parse(JSON.stringify(datasource.value.filter((s) => s !== recode)));
+      };
+  
+      const save = async () => {
+        const params = await basicInformationRef.value.onSubmit();
+        if (quantityLimitTableRef.value) {
+          quantityLimitTableRef.value.onSubmit();
+        }
+  
+        console.log("save", datasource.value);
+  
+        if (datasource.value.length > 0) {
+          let sampleQuotaValue = 0;
+          sampleQuotaValue = datasource.value
+            .map((s) => s.sampleQuota)
+            .reduce((s, v) => {
+              let sampleQuota = 0;
+              if (s) {
+                sampleQuota += s || 0;
+              }
+              if (v) {
+                sampleQuota += v;
+              }
+              return sampleQuota;
+            });
+  
+          if (sampleQuotaValue > publish_number.value && publish_number.value > 0) {
+            Modal.error({
+              content: "样本数量限制累计不能大于" + publish_number.value,
+              title: "提示",
+            });
+            return;
+          }
+        } else {
+          Modal.error({
+            content: "未添加渠道应用",
+            title: "提示",
+          });
+          return;
+        }
+  
+        Modal.confirm({
+          title: "提示",
+          content: "确定后,该投放任务将无法修改（除样本数量限制），可在投放中心查询业务进度",
+          okText: "确认",
+          cancelText: "取消",
+          onOk() {
+            setTimeout(async () => {
+              if (params) {
+                const url = await getUrl(route.query.sn);
+                const data = await add({
+                  ...params,
+                  deliverySource: 1,
+                  attachment: JSON.stringify(params.attachment),
+                  deliveryPlanList: datasource.value.map((s) => {
+                      return {
+                        channelId: s.systemName,
+                        deliveryStatus: 1,
+                        // directorCode: s.systemDescribe,
+                        // directorName: s.systemAdministrator,
+                        outerPlanId: route.query.sn,
+                        receiveApplicationCode: s.applicationCode,
+                        receiveApplicationName: s.applicationChineseName,
+                        sampleQuota: s.sampleQuota > 0 ? s.sampleQuota : 0,
+                        questionnaireUrl: url,
+                        receiverCodeNameList: JSON.stringify([
+                          {
+                            receiverCode: s.systemAdministratorPhone,
+                            receiverName: s.systemAdministrator,
+                          },
+                        ]),
+                      };
+                    })
+                  ,
+                  sn: route.query.sn,
+                });
+                if (data) {
+                  Modal.success({
+                    title: "提示",
+                    content: "添加成功",
+                  });
+                  router.back();
+                }
+              }
+            });
+          },
+        });
+      };
+  
+      const getNum = async () => {
+        const data = await getAnswerSetting(route.query.sn);
+        console.log("getNum", data.data.publish_number);
+        publish_number.value = data.data.publish_number;
+      };
+  
+      const getUrl = async (sn) => {
+        const data = await getQrcode(sn);
+        return data.data.url;
+      };
+  
+      onMounted(() => {
+        getNum();
+        getList();
+      });
+  
+      const getList = async () => {
+        if (!(id.value && route.query.sn)) {
+          return;
+        }
+        loading.value = true;
+        const data = await channels({
+          sn: route.query.sn,
+          deliveryPlanId: route.query.id,
+        }).finally(() => {
+          loading.value = false;
+        });
+        datasource.value = data.data.map((s) => {
+          return {
+            systemAdministratorPhone: s.system_administrator_phone,
+            applicationChineseName: s.app_name,
+            systemChineseName: "小程序",
+            sampleQuota: s.samples > 0 ? s.samples : undefined,
+            systemAdministrator: s.system_administrator,
+            id: s.id,
+          };
+        });
+        console.log("data.data.map", datasource.value);
+      };
+  
+      const onUpdate = (value) => {
+        datasource.value = value.value;
+      };
+  
+      return {
+        // eslint-disable-next-line vue/no-dupe-keys
+        basicInformationRef,
+        datasource,
+        isCreate,
+        addChannelApplicationRef,
+        onUpdate,
+        deleteRecord,
+        onSelectRows,
+        publish_number,
+        open,
+        save,
+        quantityLimitTableRef,
+      };
+    },
+  };
+  </script>
+  
+  <style lang="scss" scoped>
+  .launch-center-create {
+    // position: relative;
+    .link-container {
+      padding: 32px 24px;
+      background: #fff;
+      box-shadow: 0px 0px 6px 0px rgb(0 0 0 / 10%);
+      .title {
+        font-size: 16px;
+        font-weight: bold;
+      }
+      .content {
+        margin-top: 16px;
+        display: flex;
+        align-items: center;
+      }
+      .left {
+        display: flex;
+      }
+      .isEditTable {
+        ::v-deep .ant-table-tbody > tr:hover:not(.ant-table-expanded-row) > td,
+        .ant-table-row-hover,
+        .ant-table-row-hover > td .rowClass {
+          background-color: #f6f7fa !important;
+          color: #e1e2e5;
+          a {
+            color: #e1e2e5;
+          }
+        }
+        .is_copy {
+          color: #2575fe;
+        }
+        .is_onmouse {
+          color: #e1e2e5;
+          padding-left: 15px;
+          position: relative;
+          &::before {
+            position: absolute;
+            top: 5px;
+            left: 0;
+            content: "";
+            width: 10px;
+            height: 10px;
+            background-color: #e1e2e5;
+            border-radius: 50%;
+          }
+        }
+      }
+      .tableBox {
+        margin-top: 16px;
+        .is_active {
+          color: #30c57c;
+          padding-left: 15px;
+          position: relative;
+          &::before {
+            position: absolute;
+            top: 5px;
+            left: 0;
+            content: "";
+            width: 10px;
+            height: 10px;
+            background-color: #30c57c;
+            border-radius: 50%;
+          }
+        }
+        .is_pause {
+          color: #8c8c8c;
+          padding-left: 15px;
+          position: relative;
+          &::before {
+            position: absolute;
+            top: 5px;
+            left: 0;
+            content: "";
+            width: 10px;
+            height: 10px;
+            background-color: #8c8c8c;
+            border-radius: 50%;
+          }
+        }
+      }
+      .customer {
+        display: flex;
+        justify-content: space-between;
+        margin-bottom: 25px;
+      }
+      .right {
+        display: flex;
+        align-items: center;
+        flex-direction: column;
+        justify-content: center;
+        margin-left: 54px;
+      }
+      .copy-btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 76px;
+        height: 32px;
+        border-radius: 2px;
+        box-shadow: 0 2px 0 rgb(0 0 0 / 2%);
+        cursor: pointer;
+        background: #f5f5f5;
+        &:hover {
+          background: #d9d9d9;
+        }
+      }
+      .copy-icon {
+        width: 16px;
+        height: 16px;
+      }
+      .share-icon {
+        width: 16px;
+        height: 16px;
+      }
+      .qrcode {
+        width: 80px;
+        height: 80px;
+      }
+      .qrcode img {
+        display: block;
+        width: 100%;
+        height: 100%;
+      }
+      .download {
+        margin-top: 12px;
+        font-size: 14px;
+        color: #70b936;
+      }
+      .download-icon {
+        width: 16px;
+        height: 16px;
+      }
+    }
+    .mr-10 {
+      margin-right: 10px;
+    }
+    .fixed {
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 60px;
+      background: #fff;
+    }
+  }
+  </style>
+  
\ No newline at end of file
diff --git a/src/views/Publish/launch-center/launch-task/index.vue b/src/views/Publish/launch-center/launch-task/index.vue
index 79a1765e..69e6e73f 100644
--- a/src/views/Publish/launch-center/launch-task/index.vue
+++ b/src/views/Publish/launch-center/launch-task/index.vue
@@ -65,6 +65,45 @@
       </div>
     </div>
     <div v-else></div>
+    <a-modal
+        v-model:visible="visible"
+        wrapClassName="custom-modal"
+        width="624px"
+        style="height:368px"
+        :destroyOnClose="true"
+        :centered="true"
+        :maskClosable="false"
+        :footer="null"
+        @cancel="onCancel"
+        title="选择投放类型"
+      >
+        <div class="delivery-type">
+          <div class="wechat-type" :class="isSelected===1?'selected':''" @click="onSelected(1)">
+            <div class="title">
+              <img :src="require('@/assets/img/business_wechat.png')" alt="">
+              <span>企业微信</span>
+            </div>
+            <div class="present">
+              <p>适用于内部员工调研</p>
+              <p>可指定多成员、多部门、多标签参与</p>
+            </div>
+            <a-button class="custom-button" style="color: #000;" @click="onNewBuilt(1)">
+              开始新建
+            </a-button>
+          </div>
+          <div class="wechat-type" :class="isSelected===2?'selected':''" @click="onSelected(2)">
+            <div class="title">小程序</div>
+            <div class="present program">
+              <p>通过消息中心传递至小程序</p>
+              <p>请先联系小程序运营人员支持标签参与</p>
+            </div>
+            <div class="typeBtn"></div>
+            <a-button class="custom-button" style="color: #000;" @click="onNewBuilt(2)">
+              开始新建
+            </a-button>
+          </div>
+        </div>
+      </a-modal>
   </div>
 </template>
 
@@ -138,16 +177,22 @@ export default {
       // projectname.value = res.data.project_name;
     };
 
+    const visible = ref(false)
     const addLaunchTask = (iscreate = 0, item) => {
       console.log("create", item);
-      router.push({
-        path: "create",
-        query: {
-          ...route.query,
-          iscreate: iscreate,
-          id: item?.record?.plan_id,
-        },
-      });
+      if(iscreate===1) {
+        visible.value = true
+      }else{
+        // 小程序投放入口
+        router.push({
+          path: "create",
+          query: {
+            ...route.query,
+            iscreate: iscreate,
+            id: item?.record?.plan_id,
+          },
+        });
+      }
     };
     const lockLaunchTask = (item) => {
       addLaunchTask(0, item);
@@ -194,6 +239,35 @@ export default {
       }
     };
 
+    const isSelected = ref(0)
+    const onSelected = (isSelect) => {
+      isSelected.value = isSelect
+    }
+    const onNewBuilt = (type) => {
+      if(type===1) {
+        // 企业微信投放入口
+        router.push({
+          path: "enterprise-weChat",
+          query: {
+            ...route.query,
+            iscreate: 1,
+          },
+        });
+      }else{
+        // 小程序投放入口
+        router.push({
+          path: "create",
+          query: {
+            ...route.query,
+            iscreate: 1,
+          },
+        });
+      }
+    }
+    const onCancel = () => {
+      isSelected.value = 0
+    }
+
     onMounted(async () => {
       await fetchInfo(route.query.sn);
       if (status.value === 1) {
@@ -225,6 +299,11 @@ export default {
       createQuantityLimitRef,
       onPageChange,
       onShowSizeChange,
+      visible,
+      isSelected,
+      onSelected,
+      onCancel,
+      onNewBuilt,
     };
   },
 };
@@ -389,4 +468,42 @@ export default {
   height: 36px;
   border-radius: 6px;
 }
+
+.delivery-type {
+  display: flex;
+  justify-content: space-between;
+  .wechat-type {
+    width: 264px;
+    height: 256px;
+    background: #FFFFFF;
+    border-radius: 6px 6px 6px 6px;
+    opacity: 1;
+    border: 1px solid #DFE0E3;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+  }
+  .wechat-type:hover {
+    cursor: pointer;
+  }
+  .present {
+    margin: 24px 0 31px;
+    text-align: center;
+    color: #908B8B;
+    p {
+      padding: 0;
+      margin: 0;
+    }
+  }
+  .program {
+    margin: 25px 0 32px;
+  }
+  img {
+    margin-right: 9px;
+  }
+  .selected {
+    border: 1px solid #70B936;
+  }
+}
 </style>