init

package.json

@@ -17,7 +17,8 @@
     "element-plus": "2.4.4",
     "pinia": "^2.1.7",
     "vue": "^3.4.19",
-    "vue-router": "^4.3.0"
+    "vue-router": "^4.3.0",
+    "vue3-tree-org": "^4.2.2"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.0.4",

src/main.js

@@ -10,6 +10,9 @@ import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
 
 import '@/styles/global.scss'
 
+import vue3TreeOrg from 'vue3-tree-org';
+import "vue3-tree-org/lib/vue3-tree-org.css";
+
 function setupApp() {
   const app = createApp(App)
   initStore(app)
@@ -17,7 +20,7 @@ function setupApp() {
   initRouter(app)
 
   app.use(ElementPlus,{locale: zhCn})
-
+  app.use(vue3TreeOrg)
   app.mount('#app')
 }
 

src/router/modules/cygxRoutes.js

@@ -0,0 +1,587 @@
+import Home from "@/layouts/index.vue";
+
+export default [
+  // // ----------------------------------- 查研观向报告预览
+  // {
+  //   path: "/summaryPre",
+  //   component: () => import("@/views/rai_manage/components/report_preview/summaryPre.vue"),
+  //   name: "预览研选报告",
+  //   hidden: true,
+  // },
+  // {
+  //   path: "/choicenessPre",
+  //   component: () => import("@/views/rai_manage/components/report_preview/choicenessPre.vue"),
+  //   name: "预览报告精选",
+  //   hidden: true,
+  // },
+  // {
+  //   path: "/roadshowPre",
+  //   component: () => import("@/views/rai_manage/components/report_preview/roadshowPre.vue"),
+  //   name: "预览路演精华",
+  //   hidden: true,
+  // },
+  // {
+  //   path: "/thisWeekSummary",
+  //   component: () => import("@/views/rai_manage/components/report_preview/thisWeekSummary.vue"),
+  //   name: "预览本周汇总",
+  //   hidden: true,
+  // },
+  // {
+  //   path: "/lastWeekSummary",
+  //   component: () => import("@/views/rai_manage/components/report_preview/lastWeekSummary.vue"),
+  //   name: "预览上周汇总",
+  //   hidden: true,
+  // },
+  // //  ------------------------------------------------
+  // /* 查研观向报告 */
+  // {
+  //   path: "/",
+  //   component: home,
+  //   name: "查研观向报告",
+  //   hidden: false,
+  //   icon_path: require("@/assets/img/home/rai_report.png"),
+  //   children: [
+  //     {
+  //       path: "RaiDetail",
+  //       component: () => import("@/views/custom_manage/customList/customDetail.vue"),
+  //       name: "客户详情",
+  //       hidden: true,
+  //     },
+  //     {
+  //       path: "appletsReport",
+  //       component: () => import("@/views/rai_manage/reportManage/appletsReport.vue"),
+  //       name: "弘则报告管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "appIndustry",
+  //       component: () => import("@/views/rai_manage/reportManage/components/appIndustry.vue"),
+  //       name: "产业管理",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "appletsReport",
+  //         pathName: "弘则报告管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "addSummaryHz",
+  //       component: () => import("@/views/rai_manage/components/addSummary.vue"),
+  //       name: "添加报告",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "appletsReport",
+  //         pathName: "弘则报告管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editSummaryHz",
+  //       component: () => import("@/views/rai_manage/components/addSummary.vue"),
+  //       name: "编辑报告",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "appletsReport",
+  //         pathName: "弘则报告管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "summaryManage",
+  //       component: () => import("@/views/rai_manage/reportManage/summaryManage.vue"),
+  //       name: "研选报告管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "addSummary",
+  //       component: () => import("@/views/rai_manage/components/addSummary.vue"),
+  //       name: "添加报告",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "summaryManage",
+  //         pathName: "研选报告管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editSummary",
+  //       component: () => import("@/views/rai_manage/components/addSummary.vue"),
+  //       name: "编辑报告",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "summaryManage",
+  //         pathName: "研选报告管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+
+  //     {
+  //       path: "reportChoiceness",
+  //       component: () => import("@/views/rai_manage/reportManage/reportChoiceness.vue"),
+  //       name: "报告精选",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "addChoiceness",
+  //       component: () => import("@/views/rai_manage/components/addChoiceness.vue"),
+  //       name: "添加",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "reportChoiceness",
+  //         pathName: "报告精选",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editChoiceness",
+  //       component: () => import("@/views/rai_manage/components/addChoiceness.vue"),
+  //       name: "编辑",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "reportChoiceness",
+  //         pathName: "报告精选",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "studyThisWeek",
+  //       component: () => import("@/views/rai_manage/reportManage/thisWeek.vue"),
+  //       name: "本周研究汇总",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "addThisWeek",
+  //       component: () => import("@/views/rai_manage/components/addThisWeek.vue"),
+  //       name: "添加",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "studyThisWeek",
+  //         pathName: "本周研究汇总",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editThisWeek",
+  //       component: () => import("@/views/rai_manage/components/addThisWeek.vue"),
+  //       name: "编辑",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "studyThisWeek",
+  //         pathName: "本周研究汇总",
+  //         keepAlive: false,
+  //       },
+  //     },
+
+  //     {
+  //       path: "theLastWeek",
+  //       component: () => import("@/views/rai_manage/reportManage/theLastWeek.vue"),
+  //       name: "上周纪要汇总",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "addSummarizing",
+  //       component: () => import("@/views/rai_manage/components/addSummarizing.vue"),
+  //       name: "添加",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "theLastWeek",
+  //         pathName: "上周纪要汇总",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editSummarizing",
+  //       component: () => import("@/views/rai_manage/components/addSummarizing.vue"),
+  //       name: "编辑",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "theLastWeek",
+  //         pathName: "上周纪要汇总",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "roadshowEssence",
+  //       component: () => import("@/views/rai_manage/reportManage/roadshowEssence.vue"),
+  //       name: "路演精华",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "addRoadshow",
+  //       component: () => import("@/views/rai_manage/components/addRoadshow.vue"),
+  //       name: "添加",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "roadshowEssence",
+  //         pathName: "路演精华",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editRoadshow",
+  //       component: () => import("@/views/rai_manage/components/addRoadshow.vue"),
+  //       name: "编辑",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "roadshowEssence",
+  //         pathName: "路演精华",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "morningMeetingManage",
+  //       component: () => import("@/views/rai_manage/reportManage/morningMeetingManage.vue"),
+  //       name: "晨会精华",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "addMorningMeeting",
+  //       component: () => import("@/views/rai_manage/components/addMorningMeeting.vue"),
+  //       name: "添加晨会精华",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "morningMeetingManage",
+  //         pathName: "晨会精华",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editMorningMeeting",
+  //       component: () => import("@/views/rai_manage/components/addMorningMeeting.vue"),
+  //       name: "编辑晨会精华",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "morningMeetingManage",
+  //         pathName: "晨会精华",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "tacticsTimeLine",
+  //       component: () => import("@/views/rai_manage/reportManage/tacticsTimeLine.vue"),
+  //       name: "策略时间线",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "internalTesting",
+  //       component: () => import("@/views/rai_manage/reportManage/internalTesting.vue"),
+  //       name: "产品内测",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "addHaveReport",
+  //       component: () => import("@/views/rai_manage/reportManage/components/addHaveReport.vue"),
+  //       name: "添加报告",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "internalTesting",
+  //         pathName: "产品内测",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editHaveReport",
+  //       component: () => import("@/views/rai_manage/reportManage/components/addHaveReport.vue"),
+  //       name: "编辑报告",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "internalTesting",
+  //         pathName: "产品内测",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "yanXuanSpecial",
+  //       component: () => import("@/views/rai_manage/reportManage/yanXuanSpecial.vue"),
+  //       name: "研选专栏",
+  //       hidden: false,
+  //     },
+  //   ],
+  // },
+
+  /* 查研观向管理 */
+  {
+    path: "/",
+    component: Home,
+    name: "查研观向管理",
+    hidden: false,
+    // icon_path: require("@/assets/img/home/rai_admin.png"),
+    children: [
+      {
+        path: "Raimap",
+        component: () => import("@/views/rai_manage/cygxManage/industryMap.vue"),
+        name: "行业图谱",
+        hidden: false,
+      },
+      {
+        path: "RaiAdvice",
+        component: () => import("@/views/rai_manage/cygxManage/adviceList.vue"),
+        name: "优化建议",
+        hidden: false,
+      },
+      {
+        path: "searchManage",
+        component: () => import("@/views/rai_manage/cygxManage/searchManage.vue"),
+        name: "搜索词管理",
+        hidden: false,
+      },
+      {
+        path: "applyList",
+        component: () => import("@/views/rai_manage/cygxManage/applyUserList.vue"),
+        name: "权益申请记录",
+        hidden: false,
+      },
+      {
+        path: "RaiInterview",
+        component: () => import("@/views/rai_manage/cygxManage/interviewList.vue"),
+        name: "访谈申请",
+        hidden: false,
+      },
+      {
+        path: "bannerManage",
+        component: () => import("@/views/rai_manage/cygxManage/bannerManage.vue"),
+        name: "banner管理",
+        hidden: false,
+      },
+      {
+        path: "lableManage",
+        component: () => import("@/views/rai_manage/cygxManage/lableManage.vue"),
+        name: "标签管理",
+        hidden: false,
+      },
+    ],
+  },
+
+  // /* 弘则活动管理 */
+  // {
+  //   path: "/",
+  //   component: home,
+  //   name: "弘则活动管理",
+  //   hidden: false,
+  //   icon_path: require("@/assets/img/home/rai_activity.png"),
+  //   children: [
+  //     {
+  //       path: "activityManage",
+  //       component: () => import("@/views/rai_manage/activityManage/activityManage.vue"),
+  //       name: "活动管理",
+  //       hidden: false,
+  //       meta: {
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "addActivity",
+  //       component: () => import("@/views/rai_manage/activityManage/components/addActivity.vue"),
+  //       name: "添加活动",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "activityManage",
+  //         pathName: "活动管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editActivity",
+  //       component: () => import("@/views/rai_manage/activityManage/components/addActivity.vue"),
+  //       name: "编辑活动",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "activityManage",
+  //         pathName: "活动管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "applyManage",
+  //       component: () => import("@/views/rai_manage/activityManage/applyManage.vue"),
+  //       name: "报名管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "meetingManagement",
+  //       component: () => import("@/views/rai_manage/activityManage/meetingManagement.vue"),
+  //       name: "到会管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "practicalMeeting",
+  //       component: () => import("@/views/rai_manage/activityManage/practicalMeeting.vue"),
+  //       name: "线下到会管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "appointment",
+  //       component: () => import("@/views/rai_manage/activityManage/components/appointment.vue"),
+  //       name: "爽约记录",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "practicalMeeting",
+  //         pathName: "到会管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "onLineManage",
+  //       component: () => import("@/views/rai_manage/activityManage/onLineManage.vue"),
+  //       name: "线上到会管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "onLineAppointment",
+  //       component: () => import("@/views/rai_manage/activityManage/components/appointment.vue"),
+  //       name: "爽约记录",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "onLineManage",
+  //         pathName: "线上到会管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "attendMeeting",
+  //       component: () => import("@/views/rai_manage/activityManage/components/attendMeeting.vue"),
+  //       name: "到会详情",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "onLineManage",
+  //         pathName: "到会管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "specialResearch",
+  //       component: () => import("@/views/rai_manage/activityManage/specialResearch.vue"),
+  //       name: "专项调研",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "addResearch",
+  //       component: () => import("@/views/rai_manage/activityManage/specialResearch/addResearch.vue"),
+  //       name: "添加活动",
+  //       hidden: false,
+  //       meta: {
+  //         pathFrom: "specialResearch",
+  //         pathName: "专项调研",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editResearch",
+  //       component: () => import("@/views/rai_manage/activityManage/specialResearch/addResearch.vue"),
+  //       name: "编辑活动",
+  //       hidden: false,
+  //       meta: {
+  //         pathFrom: "specialResearch",
+  //         pathName: "专项调研",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "determineTravel",
+  //       component: () => import("@/views/rai_manage/activityManage/specialResearch/determineTravel.vue"),
+  //       name: "确定行程",
+  //       hidden: false,
+  //       meta: {
+  //         pathFrom: "specialResearch",
+  //         pathName: "专项调研",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "interestAllPreview",
+  //       component: () => import("@/views/rai_manage/activityManage/specialResearch/interestAllPreview.vue"),
+  //       name: "客户兴趣总览",
+  //       hidden: false,
+  //       meta: {
+  //         pathFrom: "specialResearch",
+  //         pathName: "专项调研",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "roadShow",
+  //       component: () => import("@/views/rai_manage/activityManage/roadShowList.vue"),
+  //       name: "微路演管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "themeSurveyPage",
+  //       component: () => import("@/views/rai_manage/activityManage/themeSurveyPage.vue"),
+  //       name: "主题调研问卷",
+  //       hidden: false,
+  //     },
+  //   ],
+  // },
+  // /* 研选活动管理 */
+  // {
+  //   path: "/",
+  //   component: home,
+  //   name: "研选活动管理",
+  //   hidden: false,
+  //   icon_path: require("@/assets/img/home/rai_activity.png"),
+  //   children: [
+  //     {
+  //       path: "purchaserActivityManage",
+  //       component: () => import("@/views/rai_manage/activityManage/activityManage.vue"),
+  //       name: "活动管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "addPurchaserActivity",
+  //       component: () => import("@/views/rai_manage/activityManage/components/addActivity.vue"),
+  //       name: "添加活动",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "purchaserActivityManage",
+  //         pathName: "活动管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "editPurchaserActivity",
+  //       component: () => import("@/views/rai_manage/activityManage/components/addActivity.vue"),
+  //       name: "编辑活动",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "purchaserActivityManage",
+  //         pathName: "活动管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "purchaserApplyManage",
+  //       component: () => import("@/views/rai_manage/activityManage/applyManage.vue"),
+  //       name: "报名管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "purchaserMeetingManagement",
+  //       component: () => import("@/views/rai_manage/activityManage/meetingManagement.vue"),
+  //       name: "到会管理",
+  //       hidden: false,
+  //     },
+  //     {
+  //       path: "purchaserAppointment",
+  //       component: () => import("@/views/rai_manage/activityManage/components/appointment.vue"),
+  //       name: "爽约记录",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "practicalMeeting",
+  //         pathName: "到会管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //     {
+  //       path: "attendMeeting",
+  //       component: () => import("@/views/rai_manage/activityManage/components/attendMeeting.vue"),
+  //       name: "到会详情",
+  //       hidden: true,
+  //       meta: {
+  //         pathFrom: "onLineManage",
+  //         pathName: "到会管理",
+  //         keepAlive: false,
+  //       },
+  //     },
+  //   ],
+  // },
+];

src/views/rai_manage/activityManage/activityManage.vue

@@ -0,0 +1,447 @@
+<template>
+  <!-- 活动管理页面 -->
+  <div class="container-activity">
+    <!-- 头部el-card -->
+    <el-card style="margin-bottom: 20px">
+      <div class="top-card-box">
+        <div class="tabs-box">
+          <span v-for="(item, index) in listTitle" :key="item.ChartPermissionId" @click="tabsBoxBtn(item, index)" :class="index == tabsPitchon ? 'pitch' : ''">{{ item.PermissionName }}</span>
+        </div>
+        <div style="display: flex;align-items: center">
+          <el-upload style="height:40px" ref="imgUpload" action="#" :http-request="handleUploadImg" :show-file-list="false" accept="image/*">
+            <el-button style="height:40px" type="primary">识图建会</el-button>
+          </el-upload>
+          <el-button style="margin-left: 20px;height:40px" type="primary" @click="$router.push(!isResearch ? '/addActivity' : '/addPurchaserActivity')">添加活动</el-button>
+        </div>
+      </div>
+    </el-card>
+    <!-- 内容el-card -->
+    <el-card>
+      <!-- 选择部分 -->
+      <div class="screen-box">
+        <div>
+          <el-select placeholder="行业" clearable v-model="industry" @change="conditionChange" style="margin-bottom: 20px" v-if="!isResearch">
+            <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+          </el-select>
+          <el-select placeholder="活动类型" clearable v-model="cactivityTypeVal" @change="conditionChange">
+            <el-option v-for="item in cactivityTypeList" :label="item.ActivityTypeName" :key="item.ActivityTypeId" :value="item.ActivityTypeId"></el-option>
+          </el-select>
+          <el-date-picker v-model="publishDate" type="date" placeholder="发布时间" format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd" @change="conditionChange"> </el-date-picker>
+          <date-picker style="margin-bottom: 20px" v-model="issueTime" type="date" range placeholder="活动时间" value-type="format" @change="conditionChange"> </date-picker>
+          <el-select placeholder="发布状态" clearable v-model="status" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          </el-select>
+          <el-input v-model="activityLabel" @input="titleInput" placeholder="请输入活动标签" clearable style="display: inline-block; width: 220px; margin-bottom: 20px">
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+        <div>
+          <el-input v-model="titleValue" @input="titleInput" placeholder="请输入活动名称" clearable style="display: inline-block; width: 220px">
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+      </div>
+      <!-- 表格部分 -->
+      <el-table :data="dataList" style="width: 100%" border>
+        <el-table-column align="center" label="活动名称" min-width="285">
+          <template slot-scope="{ row }">
+            <span class="editsty" @click="titleBtnClick(row.ActivityId)">{{ row.ActivityName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="ChartPermissionName" align="center" label="行业" min-width="90"></el-table-column>
+        <el-table-column min-width="120" prop="ActivityTypeName" align="center" label="活动类型"></el-table-column>
+        <el-table-column min-width="120" prop="Label" align="center" label="活动标签"></el-table-column>
+        <el-table-column min-width="219" prop="ActivityTimeText" align="center" label="活动时间"></el-table-column>
+        <el-table-column min-width="200" prop="LastUpdatedTime" align="center" label="更新时间"></el-table-column>
+        <el-table-column align="center" label="发布状态" min-width="100">
+          <template slot-scope="{ row }">
+            {{ row.PublishStatus == 0 ? "未发布" : row.PublishStatus == 1 ? "已发布" : "已取消" }}
+          </template>
+        </el-table-column>
+        <el-table-column v-if="tabsPitchon === 2" align="center" label="路演回放" min-width="100">
+          <template slot-scope="{ row }"> {{ row.IsUpload ? "已上传" : "" }} </template>
+        </el-table-column>
+        <el-table-column align="center" width="156" label="操作">
+          <template slot-scope="{ row }">
+            <div class="operate-box">
+              <p v-if="row.PublishStatus == 0 && tabsPitchon == 0" class="editsty" @click="operationBtn(row.ActivityId, '发布')">发布</p>
+              <p v-if="row.PublishStatus == 3" class="editsty" @click="operationBtn(row.ActivityId, '重新发布')">重新发布</p>
+              <p v-if="row.PublishStatus == 1" class="editsty" @click="operationBtn(row.ActivityId, '取消发布')">取消发布</p>
+              &nbsp;&nbsp;
+              <p class="editsty" @click="editBtn(row.ActivityId, row.PublishStatus)">编辑</p>
+              &nbsp;&nbsp;
+              <p class="deletesty" v-if="row.PublishStatus == 0 && tabsPitchon == 0" @click="operationBtn(row.ActivityId, '删除')">删除</p>
+              <p class="editsty" v-if="row.IsShowSigninButton" @click="handleDownLoadImg(row)">下载签到码</p>
+              <p v-if="row.ChartPermissionId === 31 && tabsPitchon == 0 && row.PublishStatus == 1" class="editsty" @click="overheadHandler(row.ActivityId, '置顶')">
+                &nbsp;&nbsp;{{ row.TopTime == 0 ? "置顶" : "取消置顶" }}
+              </p>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <atc-particulars :dialogVisible.sync="dialogVisible" :detailData.sync="detailData" />
+    <imgMeeting :isShowImgMeetingDlg.sync="isShowImgMeetingDlg" :imgMeetingData.sync="imgMeetingData" @childrenImgMeetingHandler="childrenImgMeetingHandler" />
+  </div>
+</template>
+
+<script>
+import * as OpenCC from "opencc-js";
+// 将繁体中文（香港）转换为简体中文（中国大陆）
+const converter = OpenCC.Converter({ from: "hk", to: "cn" });
+import mPage from "@/components/mPage.vue";
+import { raiInterface, sealInterence } from "@/api/api.js";
+import AtcParticulars from "../components/atcParticulars.vue";
+import imgMeeting from "./components/imgMeeting.vue";
+export default {
+  name: "",
+  components: { mPage, AtcParticulars, imgMeeting },
+  props: {
+    Type: {
+      type: String,
+      emnu: ["hongze", "purchaser"], // 弘则，研选
+      default: "hongze",
+    },
+  },
+  data() {
+    return {
+      listTitle: [
+        {
+          PermissionName: "未开始",
+          Id: "NotStarted",
+        },
+        {
+          PermissionName: "进行中",
+          Id: "HaveInHand",
+        },
+        {
+          PermissionName: "已结束",
+          Id: "Complete",
+        },
+      ],
+      tabsPitchon: 0, //tabs 默认选中
+      page_no: sessionStorage.getItem("cativityBack") ? JSON.parse(sessionStorage.getItem("cativityBack")).page_no : 1,
+      dataList: [], //表格内容
+      industry: "", //行业
+      status: "", //状态
+      issueTime: "", //时间
+      cactivityTypeVal: "", //活动
+      options: [
+        { id: 1, name: "已发布" },
+        { id: 0, name: "未发布" },
+        { id: 3, name: "已取消" },
+      ],
+      titleValue: "", //标题关键词
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      chartPermissionList: [], //行业的数组
+      cactivityTypeList: [], //活动类型
+      dialogVisible: false, //弹框
+      activeStateId: "NotStarted",
+      detailData: {}, //
+      activityLabel: "",
+      publishDate: "",
+      baseApi: process.env.API_ROOT,
+      isShowImgMeetingDlg: false,
+      imgMeetingData: [],
+    };
+  },
+  computed: {
+    sta() {
+      return this.status >= 0 && typeof this.status == "number" ? this.status : 2;
+    },
+    // 弘则 研选 是否是研选
+    isResearch() {
+      return this.$route.path.indexOf("purchaser") != -1 ? true : false;
+    },
+  },
+  created() {},
+  mounted() {
+    if (sessionStorage.getItem("cativityBack")) {
+      const initialize = JSON.parse(sessionStorage.getItem("cativityBack"));
+      this.titleValue = initialize.keyword;
+      this.industry = initialize.industry;
+      this.status = initialize.status;
+      this.issueTime = initialize.issueTime;
+      this.cactivityTypeVal = initialize.cactivityTypeVal;
+      this.activeStateId = initialize.activeStateId;
+      this.tabsPitchon = initialize.tabsPitchon;
+      this.activityLabel = initialize.activityLabel;
+      this.publishDate = initialize.publishDate;
+    }
+    // 研选下 没有行业的搜索框
+    !this.isResearch && this.chartPermission();
+    this.activityType();
+    this.getsummaryManageList();
+  },
+  methods: {
+    titleInput() {
+      this.page_no = 1;
+      this.init();
+      this.getsummaryManageList();
+    },
+    init() {
+      this.industry = ""; //行业
+      this.status = ""; //状态
+      this.issueTime = ""; //时间
+      this.cactivityTypeVal = ""; //活动
+      this.sta = "";
+    },
+    //头部tabs
+    tabsBoxBtn(item, index) {
+      this.activeStateId = item.Id;
+      this.tabsPitchon = index;
+      this.page_no = 1;
+      this.getsummaryManageList();
+    },
+    operationBtn(id, value) {
+      this.$confirm(`确定${value}该活动吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          if (value == "删除") {
+            raiInterface
+              .activityDelete({
+                ActivityId: id,
+              })
+              .then((res) => {
+                if (res.Ret !== 200) return;
+                this.$message.success("删除成功！");
+                let page_num = Math.ceil((this.total - 1) / this.PageSize);
+                if (this.page_no > page_num) {
+                  this.page_no = page_num;
+                }
+                this.getsummaryManageList();
+              });
+          } else {
+            raiInterface
+              .activityPublishAndCancel({
+                ActivityId: id,
+              })
+              .then((res) => {
+                if (res.Ret !== 200) return;
+                this.$message.success(value + "成功！");
+                this.getsummaryManageList();
+              });
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消${value}`,
+          });
+        });
+    },
+    //编辑
+    editBtn(id, show) {
+      this.$router.push({
+        path: !this.isResearch ? "/editActivity" : "/editPurchaserActivity",
+        query: {
+          id: id,
+          isShow: show,
+        },
+      });
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getsummaryManageList();
+    },
+    //获取行业
+    chartPermission() {
+      raiInterface.chartPermission({ IsHideResearch: !this.isResearch }).then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    //活动类型
+    activityType() {
+      raiInterface.getActivityType({ IsResearch: this.isResearch }).then((res) => {
+        if (res.Ret === 200) {
+          this.cactivityTypeList = res.Data.List;
+        }
+      });
+    },
+    //列表
+    getsummaryManageList() {
+      raiInterface
+        .getActivityList({
+          CurrentIndex: this.page_no,
+          PageSize: this.PageSize,
+          PublishStatus: this.sta - 0,
+          ChartPermissionId: this.industry,
+          StartDate: this.issueTime[0],
+          EndDate: this.issueTime[1],
+          KeyWord: this.titleValue,
+          ActivityTypeId: this.cactivityTypeVal,
+          ActiveState: this.activeStateId,
+          ActivityLabel: this.activityLabel,
+          PublishStartDate: this.publishDate,
+          IsResearch: this.isResearch,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.dataList = res.Data.List;
+          this.total = res.Data.Paging.Totals;
+        });
+    },
+    //change事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getsummaryManageList();
+    },
+    //点击标题的弹框
+    titleBtnClick(id) {
+      raiInterface.activityDetail({ ActivityId: Number(id) }).then((res) => {
+        if (res.Ret == 200) {
+          this.detailData = res.Data;
+        }
+      });
+      this.dialogVisible = true;
+    },
+    // 下载图片
+    handleDownLoadImg(row) {
+      let img = new Image();
+      img.setAttribute("crossOrigin", "anonymous");
+      img.src = row.SigninImg;
+      img.onload = () => {
+        let canvas = document.createElement("canvas");
+        canvas.width = img.width;
+        canvas.height = img.height;
+        let context = canvas.getContext("2d");
+        context.drawImage(img, 0, 0, img.width, img.height);
+        let dataURL = canvas.toDataURL("image/png", 1);
+        const a = document.createElement("a");
+        a.setAttribute("download", "签到码.png");
+        a.style.display = "none";
+        a.href = dataURL;
+        document.body.appendChild(a);
+        a.click();
+      };
+    },
+    async handleUploadImg(params) {
+      if (!params.file) return;
+      const fd = new FormData();
+      fd.append("file", params.file);
+      try {
+        const res = await sealInterence.resourceUpload(fd);
+        if (res.Ret === 200) {
+          const resImg = await raiInterface.activityImgToText({
+            ImgUrl: res.Data.ResourceUrl,
+          });
+          if (resImg.Ret === 200) {
+            this.isShowImgMeetingDlg = true;
+            this.imgMeetingData = resImg.Data.List.map((item) => {
+              return {
+                ...item,
+                Company: converter(item.Company),
+              };
+            });
+          }
+        }
+      } catch (err) {
+        console.log(err);
+      }
+    },
+    // 点击取消的回调事件
+    childrenImgMeetingHandler() {
+      this.$refs.imgUpload.clearFiles();
+    },
+    // 是否置顶
+    async overheadHandler(id) {
+      const res = await raiInterface.yanxuan_tope_change({
+        ActivityId: id,
+      });
+      if (res.Ret !== 200) return;
+      this.$message.success("操作成功！");
+      this.getsummaryManageList();
+    },
+  },
+  /* 页面跳转前记录参数 */
+  beforeRouteLeave(to, form, next) {
+    let backData = {
+      page_no: this.page_no,
+      keyword: this.titleValue,
+      industry: this.industry, //行业
+      status: this.status, //状态
+      issueTime: this.issueTime, //时间
+      cactivityTypeVal: this.cactivityTypeVal, //活动
+      activeStateId: this.activeStateId, //
+      tabsPitchon: this.tabsPitchon,
+      activityLabel: this.activityLabel,
+      publishDate: this.publishDate,
+    };
+    sessionStorage.setItem("cativityBack", JSON.stringify(backData));
+    next();
+  },
+  /* 页面进入前是否清除参数 */
+  beforeRouteEnter(to, from, next) {
+    if (from.path != "/editActivity") {
+      sessionStorage.removeItem("cativityBack");
+    }
+    next();
+  },
+};
+</script>
+<style lang="scss">
+.container-activity {
+  .top-card-box {
+    display: flex;
+    justify-content: space-between;
+    .tabs-box {
+      span {
+        display: inline-block;
+        padding: 9px 24px;
+        background-color: #e9f4ff;
+        border: 1px solid #b3d8ff;
+        border-radius: 4px;
+        margin-right: 30px;
+        color: #409eff;
+        cursor: pointer;
+      }
+      .pitch {
+        background-color: #409eff;
+        border: none;
+        color: #fff;
+      }
+    }
+  }
+  .screen-box {
+    display: flex;
+    justify-content: space-between;
+    .el-select {
+      margin-right: 25px;
+    }
+    .el-date-picker,
+    .el-date-editor {
+      margin-right: 25px;
+    }
+  }
+  .mx-datepicker {
+    width: 220px !important;
+    margin-right: 25px;
+  }
+
+  .customWidth {
+    width: 550px !important;
+  }
+  .operate-box {
+    display: flex;
+    flex-wrap: wrap;
+    p {
+      flex-shrink: 0;
+    }
+  }
+  .el-upload  {
+    height: 40px !important;
+    min-height: 40px !important;
+  }
+}
+</style>

src/views/rai_manage/activityManage/applyManage.vue

@@ -0,0 +1,477 @@
+<template>
+  <div class="container-apply">
+    <!-- 头部el-card -->
+    <div class="top-wrap" style="margin-bottom: 20px">
+      <div class="top-card-box">
+        <div class="tabs-box">
+          <span v-for="(item, index) in listTitle" :key="item.ChartPermissionId" @click="tabsBoxBtn(item, index)" :class="item.ChartPermissionId == tabsPitchonType ? 'pitch' : ''">{{
+            item.PermissionName
+          }}</span>
+        </div>
+        <div>
+          <el-input v-model="titleValue" style="width: 521px" placeholder="请输入活动名称" clearable>
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+      </div>
+    </div>
+    <!-- 内容el-card -->
+    <el-card>
+      <!-- 选择部分 -->
+      <div class="screen-box">
+        <div class="screen-button">
+          <template v-if="tabsPitchonType !== 3">
+            <el-button type="primary" v-if="tabsSelectionOne && tabsPitchonType !== 4" @click="addOutbound(tabsBtnName)">{{ tabsBtnName }}</el-button>
+            <el-button v-if="tabsPitchonType !== 1" type="primary" @click="addapply">新增报名</el-button>
+          </template>
+          <!-- 公司调研下的单独按钮 -->
+          <template v-if="tabsPitchonType === 3">
+            <!-- <el-tooltip class="item" effect="dark" content="不限人数的公司调研电话会请点此" placement="bottom">
+              <el-button type="primary" v-if="tabsSelectionOne" @click="addOutbound('新增外呼人员')">新增外呼人员</el-button>
+            </el-tooltip> -->
+            <el-tooltip class="item" effect="dark" content="公司线下调研、限制人数的公司调研电话会请点此" placement="bottom">
+              <el-button v-if="tabsPitchonType !== 1" type="primary" @click="addapply">新增报名</el-button>
+            </el-tooltip>
+          </template>
+          <el-button type="primary" @click="addOutbound('新增预约纪要')">新增预约纪要</el-button>
+          <el-button type="primary" @click="sendMessage">发送模板消息</el-button>
+        </div>
+        <div>
+          <el-select placeholder="行业" clearable v-model="industry" @change="conditionChange" style="margin-bottom: 20px"
+          v-if="!isResearch">
+            <el-option
+              v-for="item in chartPermissionList"
+              :label="item.PermissionName"
+              :key="item.ChartPermissionId"
+              :value="item.ChartPermissionId"
+            ></el-option>
+          </el-select>
+          <el-select placeholder="活动类型" clearable @focus="activityType" v-model="cactivityTypeVal" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in cactivityTypeList" :label="item.ActivityTypeName" :key="item.ActivityTypeId" :value="item.ActivityTypeId"></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="活动时间" value-type="format" @change="conditionChange"> </date-picker>
+          <el-select placeholder="活动状态" clearable v-model="cactivityStatus" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in statusSelect" :label="item.name" :key="item.value" :value="item.value"></el-option>
+          </el-select>
+          <el-select placeholder="发布状态" clearable v-model="publishStatus" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in publishSelect" :label="item.name" :key="item.value" :value="item.value"></el-option>
+          </el-select>
+        </div>
+      </div>
+      <!-- 表格部分 -->
+      <el-table @selection-change="selectChange" :data="dataList" style="width: 100%; margin-top: 15px" border ref="multipleTable">
+        <el-table-column type="selection" align="center" key="ActivityId"></el-table-column>
+        <el-table-column v-for="item in tableApplyColums" :key="item.label" :label="item.label" :width="item.widthsty" :min-width="item.minwidthsty" align="center">
+          <template #header>
+            <span>{{ item.label }}</span>
+            <el-tooltip
+              :content="`总报名人数已满、单机构报名人数满2人、爽约次数超限，仍点击${item.label === '预约失败人数' ? '预约外呼' : '报名'}的客户`"
+              placement="top-start"
+              v-if="item.key === 'SignupFailPeopleNum'"
+            >
+              <i class="el-icon-info" />
+            </el-tooltip>
+          </template>
+          <template slot-scope="{ row }">
+            <div v-if="item.key == 'ReminderPeopleNum'">
+              <span v-if="row.ReminderPeopleNum > 0" class="editsty" @click="particularsBtn('会议提醒人数', row.ActivityId)">{{ row.ReminderPeopleNum }}</span>
+              <span v-else>--</span>
+            </div>
+            <div v-else-if="item.key == 'SignupFailPeopleNum'">
+              <span v-if="row.SignupFailPeopleNum == 0">--</span>
+              <span v-else class="editsty" @click="particularsBtn('报名失败详情', row.ActivityId)">{{ row.SignupFailPeopleNum }}</span>
+            </div>
+            <span v-else @click="handleRowClick(row, item.key)" :style="handleRowStyle(item.key)">{{ handleRowContent(row, item.key) }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <!-- 详情弹框 -->
+    <atc-particulars :dialogVisible.sync="dialogVisible" :detailData.sync="detailData" />
+    <!-- 新增外呼的弹框 -->
+    <apply-dialog
+      :addDialogVisible.sync="addDialogVisible"
+      :dialogVisibleId="dialogVisibleId"
+      :selectList="selectList"
+      :signUpAdd="signUpAdd"
+      :addDialogType="addDialogType"
+      :tabsPitchonType="tabsPitchonType"
+      :minimumSummation="minimumSummation"
+      :selectionArr="selectionArr"
+    />
+    <!-- 报名详情弹框 -->
+    <particulars-dialog :dialogVisibleId="dialogVisibleId" :particularsDialogVisible.sync="particularsDialogVisible" :subscribe="subscribe" />
+    <generation-ask :generaitonType="generaitonType" :generaitondialogVisib.sync="generaitondialogVisib" :generaitonId="generaitonId" />
+    <summary-remind :dialogVisibleId="dialogVisibleId" :summaryRemindDlg.sync="summaryRemindDlg" :subscribe="subscribe" />
+    <template-message :messageDialog.sync="messageDialogVisible" :selectionArr="selectionArr" />
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import mPage from "@/components/mPage.vue";
+import ApplyDialog from "../components/apply/applyDialog.vue";
+import ParticularsDialog from "../components/apply/particularsDialog.vue";
+import AtcParticulars from "../components/atcParticulars.vue";
+import GenerationAsk from "../components/generationAsk.vue";
+import SummaryRemind from "../components/apply/summaryRemind.vue";
+import { ListTitle , purchaserListTitle , TableApplyColums, StatusSelect, PublishSelect } from "../components/apply/applyTableColums";
+import TemplateMessage from "../components/apply/templateMessage.vue";
+export default {
+  name: "",
+  components: { ApplyDialog, ParticularsDialog, mPage, AtcParticulars, GenerationAsk, SummaryRemind, TemplateMessage },
+  props: {},
+  data() {
+    return {
+      tabsSelectionOne: true,
+      dataList: [], //表格的列表
+      page_no: sessionStorage.getItem("interviewListBack") ? JSON.parse(sessionStorage.getItem("interviewListBack")).page_no : 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      industry: "", //行业
+      cactivityTypeVal: "", //活动
+      issueTime: "", //时间
+      selectList: "", //新增外呼人员的id
+      chartPermissionList: [], //行业的数组
+      cactivityTypeList: [], //活动类型
+      addDialogVisible: false, //新增外呼的弹框
+      particularsDialogVisible: false, //报名详情弹框
+      subscribe: "", //预约外呼弹框的tittle
+      titleValue: "", //标题关键词
+      tabsPitchonType: 1,
+      dialogVisible: false, //文章详情
+      detailData: {}, //文章详情数据
+      dialogVisibleId: "", //弹框id
+      reminder: false, //提示
+      generaitondialogVisib: false, //代问的弹框
+      generaitonId: "",
+      generaitonType: "报名",
+      numberFull: false, //
+      tableApplyColums: [],
+      signUpAdd: "",
+      minimumSummation: "",
+      numberLimi: false, //
+      addDialogType: "新增外呼人员",
+      summaryRemindDlg: false, //预约纪要、会议提醒
+      isShowAppointment: true, //是 预约纪要、会议提醒
+      activityTypeName: [],
+      cactivityStatus: 1,
+      publishStatus: "1", //发布状态
+      messageDialogVisible: false, //发送消息模版
+      isResearchPoints: false, //
+    };
+  },
+  computed: {
+    // 弘则 研选 是否是研选
+    isResearch(){
+      return this.$route.path.indexOf("purchaser")!=-1?true:false
+    },
+    listTitle() {
+      return !this.isResearch?ListTitle:purchaserListTitle;
+    },
+    statusSelect() {
+      return StatusSelect;
+    },
+    publishSelect() {
+      return PublishSelect;
+    },
+    tabsBtnName() {
+      return this.tabsPitchonType == 1 ? "新增报名" : "新增外呼人员";
+    },
+  },
+  watch: {
+    titleValue() {
+      this.page_no = 1;
+      this.init();
+      this.getsDataList();
+    }
+  },
+  created() {},
+  mounted() {
+    this.tableApplyColums = TableApplyColums(1);
+    !this.isResearch && this.chartPermission();
+    this.getsDataList();
+  },
+  methods: {
+    init() {
+      this.issueTime = "";
+      this.industry = "";
+      this.cactivityTypeVal = "";
+    },
+    //头部tabs
+    tabsBoxBtn(item, index) {
+      this.tabsPitchonType = item.ChartPermissionId;
+      this.tableApplyColums = TableApplyColums(item.ChartPermissionId);
+      this.cactivityTypeVal = "";
+      this.isResearchPoints = false;
+      this.tabsSelectionOne = item.ChartPermissionId == 2 || item.ChartPermissionId == 5 ? false : true;
+      this.page_no = 1;
+      this.getsDataList();
+    },
+    //列表表格
+    getsDataList() {
+      raiInterface
+        .activitySignup({
+          CurrentIndex: this.page_no,
+          PageSize: this.PageSize,
+          StartDate: this.issueTime[0],
+          EndDate: this.issueTime[1],
+          KeyWord: this.titleValue,
+          SearchType: this.tabsPitchonType,
+          ChartPermissionId: this.industry,
+          ActivityTypeId: this.cactivityTypeVal,
+          ActiveState: this.cactivityStatus,
+          PublishStatus: this.publishStatus ? Number(this.publishStatus) : 2,
+          IsResearch:this.isResearch
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.dataList = res.Data.List;
+          this.total = res.Data.Paging.Totals;
+        });
+    },
+    //添加新增外呼人员
+    addOutbound(type) {
+      if (!this.selectList) {
+        this.$message.warning("请先选择活动");
+      } else if (this.tabsPitchonType == 1 && this.isGenre) {
+        return this.$message.warning("活动类型不同，无法同时新增报名");
+      } else {
+        if (type == "新增外呼人员") {
+          if (this.reminder && this.tabsPitchonType !== 1) return this.$message.warning("当前活动无法新增外呼人员");
+          this.addDialogVisible = true;
+        } else {
+          if (!this.isShowAppointment && type === "新增预约纪要") return this.$message.error("该活动无法预约纪要");
+          this.addDialogVisible = true;
+        }
+        this.addDialogType = type;
+      }
+    },
+    //表格选择复选框的事件
+    selectChange(selection, row) {
+      const arr = [];
+      const num = [];
+      const summation = [];
+      const genre = [];
+      let minimum = [];
+      let isResearch = [];
+      this.selectionArr = selection;
+      selection.forEach((item) => {
+        arr.push(item.ActivityId);
+        num.push(item.LimitPeopleNum);
+        summation.push(item.SignupPeopleNum);
+        genre.push(item.ActivityTypeName);
+        isResearch.push(item.IsResearchPoints);
+        minimum.push(item.LimitPeopleNum - item.SignupPeopleNum);
+      });
+      this.activityTypeName = genre;
+      this.isShowAppointment = selection.every((item) => item.IsShowAppointment == true);
+      const str = arr.join(",");
+      this.reminder = num.some((item) => item > 0);
+      this.selectList = str;
+      this.isGenre = new Set(genre).size > 1 ? true : false;
+      if (this.tabsPitchonType !== 1 && (selection[0] ? selection[0].LimitPeopleNum > 0 : true)) {
+        num.forEach((item) => {
+          this.numberFull = summation.some((key) => key >= item);
+        });
+      }
+      if (this.tabsPitchonType !== 1) {
+        console.log(isResearch, isResearch.length);
+        this.tabsPitchonType == 3 && this.isResearchHandler(isResearch);
+        this.minimumSummation = Math.min(...minimum);
+        this.numberLimi = num.includes(0) && num.some((item) => item > 0);
+      }
+    },
+    // 公司调研下的判断
+    isResearchHandler(isResearch) {
+      if (isResearch && isResearch.length > 1) {
+        for (let i = 0; i < isResearch.length - 1; i++) {
+          if (isResearch[i] !== isResearch[i + 1]) {
+            this.isResearchPoints = true;
+            break;
+          }
+        }
+      } else {
+        this.isResearchPoints = false;
+      }
+    },
+    //报名详情的弹框
+    particularsBtn(val, id) {
+      this.dialogVisibleId = id;
+      this.subscribe = val;
+      if (val === "会议提醒人数" || val === "纪要预约人数") {
+        this.summaryRemindDlg = true;
+      } else {
+        this.particularsDialogVisible = true;
+      }
+    },
+    //change事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getsDataList();
+    },
+    //获取行业
+    chartPermission() {
+      raiInterface.chartPermission({IsHideResearch:!this.isResearch}).then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    //活动类型
+    activityType() {
+      raiInterface
+        .activitySignuplistSearch({
+          SearchType: this.tabsPitchonType,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.cactivityTypeList = res.Data.List;
+          }
+        });
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getsDataList();
+    },
+    //点击标题的弹框
+    titleBtnClick(id) {
+      raiInterface.activityDetail({ ActivityId: Number(id) }).then((res) => {
+        if (res.Ret == 200) {
+          this.detailData = res.Data;
+        }
+      });
+      this.dialogVisible = true;
+    },
+    //点击代问的弹框
+    inquireBtn(id) {
+      this.generaitondialogVisib = true;
+      this.generaitonId = id;
+    },
+    //新增报名
+    addapply() {
+      if (!this.selectList) {
+        return this.$message.warning("请先选择活动");
+      } else if (this.isGenre) {
+        return this.$message.warning("活动类型不同，无法同时新增报名");
+      } else if (this.isResearchPoints && this.tabsPitchonType == 3) {
+        return this.$message.warning("所选活动无法同时新增报名");
+      } else {
+        if (this.numberLimi && this.tabsPitchonType !== 4) {
+          return this.$message.warning("不限人数的电话会请新增外呼人员，限制人数的电话会请新增报名");
+        } else if (this.numberFull && this.tabsPitchonType !== 4) {
+          return this.$message.warning("新增失败，活动人数超限。");
+        }
+        this.signUpAdd = this.activityTypeName.includes("公司调研电话会（易董）") ? "易董" : this.tabsPitchonType == 4 ? "c类" : "报名";
+        this.addDialogType = "新增报名";
+        this.addDialogVisible = true;
+      }
+    },
+    /* 表格行的样式 */
+    handleRowStyle(key) {
+      let isStyle = ["ActivityName", "SignupPeopleNum", "AppointmentPeopleNum", "AskNum"];
+      return isStyle.includes(key) ? "color: #409eff; cursor: pointer" : "";
+    },
+    /* 表格行的点击事件 */
+    handleRowClick(row, key) {
+      switch (key) {
+        case "ActivityName":
+          this.titleBtnClick(row.ActivityId);
+          break;
+        case "SignupPeopleNum":
+          this.particularsBtn("报名详情", row.ActivityId);
+          break;
+        case "AppointmentPeopleNum":
+          this.particularsBtn("纪要预约人数", row.ActivityId);
+          break;
+        case "AskNum":
+          this.inquireBtn(row.ActivityId);
+          break;
+        default:
+          "";
+      }
+    },
+    /* 表格行的数据处理 */
+    handleRowContent(row, key) {
+      if (["LimitPeopleNum"].includes(key)) {
+        return row[key] > 0 && !row.YidongActivityId ? row[key] : "--";
+      } else if (key == "ActiveState") {
+        let status = row[key] == 1 ? "未开始" : row[key] == 2 ? "进行中" : "已结束";
+        return status;
+      } else if (key == "PublishStatus") {
+        let status = row["PublishStatus"] == 1 ? "已发布" : row["PublishStatus"] == 2 ?"未发布":"已取消";
+        return status;
+      } else {
+        return row[key];
+      }
+    },
+    // 发送模版消息
+    sendMessage() {
+      if (this.selectList && this.selectList.split(",").length === 1) {
+        this.messageDialogVisible = true;
+      } else {
+        this.$message.error("请选择一个活动");
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-apply {
+  .top-wrap {
+    margin-bottom: 28px;
+    padding: 20px 30px 0;
+    background: #fff;
+    border: 1px solid #ececec;
+    border-radius: 4px;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+  }
+  .top-card-box {
+    display: flex;
+    justify-content: space-between;
+    .tabs-box {
+      span {
+        display: inline-block;
+        padding: 9px 24px;
+        background-color: #e9f4ff;
+        border: 1px solid #b3d8ff;
+        border-radius: 4px;
+        margin-right: 30px;
+        margin-bottom: 20px;
+        color: #409eff;
+      }
+      .pitch {
+        background-color: #409eff;
+        border: none;
+        color: #fff;
+      }
+    }
+  }
+  .screen-box {
+    display: flex;
+    :first-child {
+      margin-right: 10px;
+    }
+    .el-select {
+      margin-right: 25px;
+    }
+  }
+  .mx-datepicker {
+    width: 220px !important;
+    margin-right: 25px;
+  }
+  .screen-button {
+    display: flex;
+    flex-wrap: wrap;
+    .el-button {
+      height: 40px;
+      margin-right: 20px;
+      margin-left: 0;
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/components/ThemeSurvey/voteDlg.vue

@@ -0,0 +1,239 @@
+<template>
+  <div class="container vote-dlg-container">
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :title="this.rowForm.QuestionnaireId ? '编辑' : '发起投票'"
+      :modal-append-to-body="false"
+      center
+      :append-to-body="true"
+      :visible.sync="initiateVotingDlg"
+      :before-close="closeHandler"
+      width="800px"
+    >
+      <div class="vote-dlg-container-theme-survey">
+        <el-form :model="votingForm" :rules="votingRules" ref="votingForm" class="demo-ruleForm">
+          <el-form-item prop="type">
+            <el-select style="width: 100%" v-model="votingForm.type" placeholder="请选择活动类型">
+              <el-option v-for="item in optionsActivity" :label="item.ActivityTypeName" :key="item.ActivityTypeId" :value="item.ActivityTypeId"> </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item prop="describe">
+            <div class="fr-wrapper-content-vote-dlg-container">
+              <froala :tag="'textarea'" :config="froalaConfig" v-model="votingForm.describe"></froala>
+            </div>
+          </el-form-item>
+          <el-form-item prop="date">
+            <el-date-picker v-model="votingForm.date" type="date" placeholder="请设置投票截止时间" value-format="yyyy-MM-dd" style="width: 100%"> </el-date-picker>
+          </el-form-item>
+          <el-form-item prop="select">
+            <el-select v-model="votingForm.select" placeholder="最多可选几项" style="width: 100%" @change="selectChangeHandler">
+              <el-option label="1" :value="1"></el-option>
+              <el-option label="2" :value="2"></el-option>
+              <el-option label="3" :value="3"></el-option>
+              <el-option label="4" :value="4"></el-option>
+              <el-option label="5" :value="5"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            v-for="(item, index) in votingForm.addThemeList"
+            :key="index"
+            :prop="'addThemeList.' + index + '.ActivityTheme'"
+            :rules="{
+              required: true,
+              message: '请填写活动主题',
+              trigger: 'blur',
+            }"
+          >
+            <div class="add-theme-content">
+              <el-input v-model="item.ActivityTheme" placeholder="活动主题" style="width: 100%" clearable></el-input>
+              <div class="delete-item-icon" @click="deleteThemeItem(item, index)" v-if="index >= 2">
+                <img src="~@/assets/img/icons/delete-Item.png" alt="" />
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item>
+            <div class="add-theme-box" @click="addThemeHandler">
+              <el-image style="width: 25px; height: 25px; margin-right: 10px" :src="require('@/assets/img/icons/add-img.png')" />
+              <span style="cursor: pointer">添加主题</span>
+            </div>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确定</el-button>
+        <el-button style="margin-left: 30px" type="primary" plain @click="closeHandler">取消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+import RichText from "../../../components/richText.vue";
+export default {
+  name: "",
+  components: { RichText },
+  props: {
+    initiateVotingDlg: {
+      type: Boolean,
+      default: false,
+    },
+    rowForm: {
+      type: Object,
+      default: {},
+    },
+  },
+  watch: {
+    rowForm: {
+      handler(newVal) {
+        this.initiateVotingDlg && newVal.QuestionnaireId && this.getListDetails();
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  data() {
+    var that = this;
+    return {
+      froalaConfig: {
+        height: 150,
+        fontSizeDefaultSelection: "16",
+        quickInsertEnabled: false,
+        theme: "dark", //主题
+        placeholderText: "请输入首段描述文字",
+        language: "zh_cn",
+        events: {
+          initialized: function () {
+            that.editor = this;
+            that.editor.toolbar.hide();
+          },
+        },
+      },
+      votingForm: {
+        type: 8,
+        describe: "",
+        date: "",
+        select: "",
+        addThemeList: [
+          { QuestionnaireThemeId: 0, ActivityTheme: "" },
+          { QuestionnaireThemeId: 0, ActivityTheme: "" },
+        ],
+      },
+      votingRules: {
+        type: [{ required: true, message: "请选择活动类型", trigger: "change" }],
+        describe: [{ required: true, message: "请输入首段描述文字", trigger: "blur" }],
+        date: [{ required: true, message: "请设置投票截止时间", trigger: "change" }],
+        select: [{ required: true, message: "请输入最多可选几项", trigger: "change" }],
+      },
+      optionsActivity: [],
+    };
+  },
+  computed: {},
+  created() {},
+  mounted() {
+    this.activityType();
+  },
+  methods: {
+    closeHandler() {
+      this.votingForm = {
+        type: 8,
+        describe: "",
+        date: "",
+        select: "",
+        addThemeList: [
+          { QuestionnaireThemeId: 0, ActivityTheme: "" },
+          { QuestionnaireThemeId: 0, ActivityTheme: "" },
+        ],
+      };
+      this.$refs.votingForm.resetFields();
+      this.$emit("update:initiateVotingDlg", false);
+      this.$emit("update:rowForm", {});
+    },
+    // 添加主题
+    addThemeHandler() {
+      let id = this.votingForm.addThemeList.length;
+      this.votingForm.addThemeList.push({ QuestionnaireThemeId: 0, ActivityTheme: "" });
+    },
+    deleteThemeItem(item, index) {
+      if (index >= 2) {
+        this.votingForm.addThemeList.splice(index, 1);
+      }
+    },
+    // 点击确定
+    submitForm() {
+      this.$refs.votingForm.validate(async (valid) => {
+        if (valid) {
+          const res = await raiInterface.questionnairePreserveAndEdit({
+            ActivityTypeId: this.votingForm.type,
+            MaxChooseTotal: this.votingForm.select,
+            Content: this.votingForm.describe.replace(/<p data-f-id=\"pbf\".*?<\/p>/g,''),
+            EndTime: this.votingForm.date,
+            ListTheme: this.votingForm.addThemeList,
+            QuestionnaireId: this.rowForm.QuestionnaireId || 0,
+          });
+          if (res.Ret === 200) {
+            this.$parent.getDataList();
+            this.$message.success("操作成功");
+            this.closeHandler();
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    // 获取活动类型
+    async activityType() {
+      const res = await raiInterface.getActivityType({
+        IsGetAll: true,
+      });
+      if (res.Ret === 200) {
+        this.optionsActivity = res.Data.List;
+      }
+    },
+    async getListDetails() {
+      const res = await raiInterface.questionnaireDetail({
+        QuestionnaireId: this.rowForm.QuestionnaireId,
+      });
+      if (res.Ret === 200) {
+        let detail = res.Data.Detail;
+        this.votingForm = {
+          type: detail.ActivityTypeId,
+          describe: detail.Content,
+          date: detail.EndTime,
+          select: detail.MaxChooseTotal,
+          addThemeList: detail.ListTheme,
+        };
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.vote-dlg-container-theme-survey {
+  .add-theme-content {
+    display: flex;
+    align-items: center;
+  }
+  .delete-item-icon {
+    display: flex;
+    align-items: center;
+    margin-left: 20px;
+    cursor: pointer;
+    img {
+      width: 15px;
+      height: 15px;
+    }
+  }
+  .add-theme-box {
+    display: flex;
+    align-items: center;
+  }
+}
+
+.fr-wrapper-content-vote-dlg-container {
+  border-top: 1px solid #cccccc !important;
+  border-bottom: 1px solid #cccccc !important;
+}
+</style>

src/views/rai_manage/activityManage/components/ThemeSurvey/votingResultsDlg.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="container vote-dlg-container">
+    <!-- 投票结果 -->
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      title="投票结果"
+      :modal-append-to-body="false"
+      center
+      :append-to-body="true"
+      :visible.sync="isVotinRgesultsDlg"
+      :before-close="closeHandler"
+      width="500px"
+    >
+      <el-table border :data="voteDetailList" style="margin-bottom: 20px" height="350">
+        <el-table-column align="center" prop="ActivityTheme" key="name" label="主题"></el-table-column>
+        <el-table-column width="100" align="center" prop="VoteTotal" key="name" label="票数">
+          <template slot-scope="{ row }">
+            <span class="editsty" @click="lookVoteDetailsHandler(row)"> {{ row.VoteTotal }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
+    <!-- 票数明细 -->
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      title="票数明细"
+      :modal-append-to-body="false"
+      center
+      :append-to-body="true"
+      :visible.sync="isVoteDetails"
+      :before-close="closeHandlerTwo"
+      width="600px"
+    >
+      <el-table border :data="voteNumDetailList" style="margin-bottom: 20px" height="350">
+        <el-table-column align="center" prop="RealName" key="name" label="投票人姓名"></el-table-column>
+        <el-table-column align="center" prop="CompanyName" key="name" label="公司名"></el-table-column>
+        <el-table-column align="center" prop="SellerName" key="name" label="所属销售"></el-table-column>
+        <el-table-column width="160" align="center" prop="CreateTime" key="name" label="投票时间"></el-table-column>
+      </el-table>
+    </el-dialog>
+    <!-- 其余主题 -->
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      title="其余主题"
+      :modal-append-to-body="false"
+      center
+      :append-to-body="true"
+      :visible.sync="theRemainingThemeDlg"
+      :before-close="closeHandlerThree"
+      width="600px"
+    >
+      <el-table border :data="voteOtherList" style="margin-bottom: 20px" height="350">
+        <el-table-column align="center" prop="Content" key="name" label="主题内容"></el-table-column>
+        <el-table-column align="center" prop="RealName" key="name" label="提交人姓名"></el-table-column>
+        <el-table-column align="center" prop="CompanyName" key="name" label="公司名"></el-table-column>
+        <el-table-column align="center" prop="SellerName" key="name" label="所属销售"></el-table-column>
+        <el-table-column width="160" align="center" prop="CreateTime" key="name" label="提交时间"></el-table-column>
+      </el-table>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+
+export default {
+  name: "",
+  props: {
+    isVotinRgesultsDlg: {
+      type: Boolean,
+      default: false,
+    },
+    theRemainingThemeDlg: {
+      type: Boolean,
+      default: false,
+    },
+    rowForm: {
+      type: Object,
+      default: {},
+    },
+  },
+  data() {
+    return {
+      isVoteDetails: false,
+      voteDetailList: [], //投票结果
+      voteNumDetailList: [], //查看票数详情
+      voteOtherList: [], //查看其余主题
+    };
+  },
+  computed: {},
+  watch: {
+    isVotinRgesultsDlg: {
+      handler(newValue) {
+        newValue && this.getVoteDetail();
+      },
+    },
+    theRemainingThemeDlg: {
+      handler(newValue) {
+        newValue && this.lookVoteOther();
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    // 关闭弹框事件
+    closeHandler(type) {
+      this.$emit("update:isVotinRgesultsDlg", false);
+      this.$emit("update:rowForm", {});
+    },
+    closeHandlerTwo() {
+      this.isVoteDetails = false;
+    },
+    closeHandlerThree() {
+      this.$emit("update:theRemainingThemeDlg", false);
+      this.$emit("update:rowForm", {});
+    },
+    // 投票结果
+    async getVoteDetail() {
+      const res = await raiInterface.questionnaireVote_detail({
+        QuestionnaireId: this.rowForm.QuestionnaireId,
+      });
+      if (res.Ret === 200) {
+        this.$nextTick(() => {
+          this.voteDetailList = res.Data.List || [];
+        });
+      }
+    },
+    // 查看票数详情
+    async lookVoteDetailsHandler(item) {
+      const res = await raiInterface.questionnaireVote_list({
+        QuestionnaireThemeId: item.QuestionnaireThemeId,
+      });
+
+      if (res.Ret === 200) {
+        this.isVoteDetails = true;
+        this.$nextTick(() => {
+          this.voteNumDetailList = res.Data.List || [];
+        });
+      }
+    },
+    // 查看其余主题
+    async lookVoteOther() {
+      console.log(this.rowForm);
+      const res = await raiInterface.questionnaireVote_other({
+        QuestionnaireId: this.rowForm.QuestionnaireId,
+      });
+
+      if (res.Ret === 200) {
+        this.$nextTick(() => {
+          this.voteOtherList = res.Data.List || [];
+        });
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.vote-dlg-container-theme-survey {
+  .add-theme-content {
+    display: flex;
+    align-items: center;
+  }
+  .delete-item-icon {
+    display: flex;
+    align-items: center;
+    margin-left: 20px;
+    cursor: pointer;
+    img {
+      width: 15px;
+      height: 15px;
+    }
+  }
+  .add-theme-box {
+    display: flex;
+    align-items: center;
+  }
+}
+
+.fr-wrapper-content-vote-dlg-container {
+  border-top: 1px solid #cccccc !important;
+  border-bottom: 1px solid #cccccc !important;
+}
+</style>

src/views/rai_manage/activityManage/components/addActivity.vue

@@ -0,0 +1,1188 @@
+<template>
+  <div class="container-addAct">
+    <el-card class="card-top">
+      <div class="top-box">
+        <div>
+          <el-select
+            placeholder="请选择行业"
+            :disabled="!isShowSelect"
+            @change="clearTopIndustry"
+            @clear="clearTopIndustry"
+            clearable
+            v-model="optionFormregion"
+            style="width: 360px; margin-right: 30px"
+            v-if="!isResearch"
+          >
+            <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.PermissionName" :value="item.PermissionName"></el-option>
+          </el-select>
+          <el-select placeholder="请选择活动类型" :disabled="!isShowSelect" clearable v-model="cactivityType" @change="activityTypeDetail" style="width: 360px">
+            <el-option v-for="item in cactivityTypeList" :label="item.ActivityTypeName" :key="item.ActivityTypeId" :value="item.ActivityTypeId"></el-option>
+          </el-select>
+          <template>
+            <el-radio style="margin-left: 30px" v-model="areaType" :label="1">国内</el-radio>
+            <el-radio v-model="areaType" :label="2">海外</el-radio>
+          </template>
+        </div>
+        <div>
+          <el-button v-if="isShowSelect" type="primary" @click="templateBtn">活动内容输入模板</el-button>
+        </div>
+      </div>
+    </el-card>
+
+    <el-card style="margin-top: 30px">
+      <froala id="froala-editor" ref="froalaEditor" :tag="'textarea'" :config="froalaConfig" v-model="content"></froala>
+      <div style="margin-top: 25px" v-if="optionFormregion">
+        <template v-if="cactivityType == 1">
+          <el-radio style="margin: 0 0 20px 30px" v-model="subjectRadio" label="1">单主题标签：</el-radio>
+          <el-radio v-model="subjectRadio" label="2">多主题标签：</el-radio>
+        </template>
+        <div style="display: flex; align-items: center">
+          <span style="width: 98px; flex-shrink: 0">
+            主题标签：
+            <el-tooltip placement="top-start">
+              <div slot="content">
+                1、小程序内默认显示产业名称，也可勾选【小程序内显示标的名称】更改显示<br />2、若该活动暂无相关联产业，请联系内容组添加，或勾选并填写【临时标签】用于小程序内展示<br />
+                3、选择产业和关联标的后，即完成对活动的标签定义；可同时勾选并填写【临时标签】，小程序内将显示临时标签名称
+              </div>
+              <i class="el-icon-info" />
+            </el-tooltip>
+          </span>
+          <el-cascader
+            key="multipleTrue"
+            style="margin-right: 10px"
+            v-model="industryCascade"
+            :disabled="selectDisabled"
+            @change="propertyChange"
+            placeholder="请选择产业名称"
+            :show-all-levels="false"
+            :options="industryArr"
+            :props="{ ...defaultProps, multiple: true }"
+            filterable
+          >
+          </el-cascader>
+          <template v-if="isShowAddIcon">
+            <img v-if="!optionFormregion.includes('策略') && !selectDisabled" src="~@/assets/img/set_m/add_ico.png" style="margin: 0 30px 0 0" @click="addIndustryDlg = true" />
+            <img v-if="!optionFormregion.includes('策略') && selectDisabled" src="~@/assets/img/set_m/slide.png" style="margin: 0 30px 0 0" />
+          </template>
+          <el-select v-model="markValue" :disabled="selectDisabled" @focus="markSelectFocus" multiple placeholder="请选择关联标的">
+            <el-option v-for="item in markOptions" :key="item.IndustrialSubjectId" :value="item.IndustrialSubjectId" :label="item.SubjectName"> </el-option>
+          </el-select>
+          <template v-if="isShowAddIcon">
+            <img v-if="!optionFormregion.includes('策略') && !selectDisabled" src="~@/assets/img/set_m/add_ico.png" style="margin: 0 10px" @click="isAddMarketDlg" />
+            <img v-if="!optionFormregion.includes('策略') && selectDisabled" src="~@/assets/img/set_m/slide.png" style="margin: 0 10px" />
+          </template>
+          <el-checkbox style="margin-left: 20px" v-model="isMark">小程序内显示标的名称</el-checkbox>
+          <div style="display: flex; align-items: center; margin-left: 40px">
+            <el-checkbox v-model="radioTemporary">临时标签</el-checkbox>
+            <el-input style="width: 350px; margin: 0 20px" v-model="valTemporary" @focus="radioTemporary = true" placeholder="请输入标签名称" type="text"></el-input>
+            <div class="editsty" style="flex-shrink: 0" @click="dialogVisibleSubject = true">查询标的</div>
+          </div>
+        </div>
+        <!-- 复选 模块 -->
+        <div style="margin-top: 20px">
+          <research-deduct ref="researchSelect" :cactivityType="cactivityType" :optionFormregion="optionFormregion" :isResearch="isResearch" />
+        </div>
+        <div style="margin: 20px 0 0 98px" class="add-delete" v-for="(item, index) in addSubjectLabel" :key="index">
+          <template v-if="subjectRadio == 2">
+            <el-cascader
+              v-model="item.IndustrialManagementIdS"
+              :disabled="item.forbidden"
+              @change="propertyChange"
+              placeholder="请选择产业名称"
+              :show-all-levels="false"
+              :options="industryArr"
+              :props="{ ...defaultProps, multiple: true }"
+              filterable
+            >
+            </el-cascader>
+            <el-select style="margin: 0 10px" v-model="item.IndustrialSubjectIdS" :disabled="item.forbidden" @focus="markSelectFocusAdd(index, item)" multiple placeholder="请选择关联标的">
+              <el-option v-for="val in item.markOptions" :key="val.IndustrialSubjectId" :value="val.IndustrialSubjectId" :label="val.SubjectName"> </el-option>
+            </el-select>
+            <el-checkbox style="margin: 0 0 0 10px" v-model="item.isMark">小程序内显示标的名称</el-checkbox>
+            <div style="display: flex; align-items: center; margin-left: 40px">
+              <el-checkbox v-model="item.temporary" @change="temporaryChangeHandler(item)">临时标签</el-checkbox>
+              <el-input
+                style="width: 350px; margin: 0 20px"
+                v-model="item.temporaryText"
+                @focus="
+                  item.forbidden = true;
+                  item.temporary = true;
+                "
+                placeholder="请输入标签名称"
+                type="text"
+              ></el-input>
+            </div>
+            <img @click="deleteSubject(index, item)" src="~@/assets/img/icons/delete-Item.png" />
+            <el-checkbox style="margin-left: 30px" v-model="item.subscribe">可预约纪要</el-checkbox>
+          </template>
+        </div>
+        <div style="margin: 20px 0 0 30px; display: flex; align-items: center" v-if="subjectRadio == 2">
+          <img @click="addLabelClick" class="editsty" src="~@/assets/img/set_m/add_ico.png" style="margin: 0 10px" />
+          <span @click="addLabelClick" class="editsty"> 添加主题标签</span>
+        </div>
+      </div>
+      <div style="margin-top: 15px" v-if="showType !== '1' && showType !== '9' && subjectRadio != 2">
+        <div class="radio-input" style="margin-bottom: 15px; height: 35px">
+          <span style="width: 98px"> 参会人数限制： </span>
+          <template v-if="showType != 3">
+            <el-radio v-model="radio" label="1">不限制</el-radio>
+            <el-radio v-model="radio" label="2">限制</el-radio>
+          </template>
+          <el-input placeholder="输入人数上限" v-if="radio == 2 || showType !== '2'" class="astrict-inpt" onkeyup="value=value.replace(/[^\d]/g,'')" v-model="astrict" />
+        </div>
+        <div v-if="radio == 2 || showType !== '2'">
+          <div class="checkbox-box">
+            <span style="width: 98px; flex-shrink: 0">
+              活动可见：
+              <el-tooltip :content="checkboxTooltip('活动可见')" placement="top-start">
+                <i class="el-icon-info" />
+              </el-tooltip>
+            </span>
+            <div>
+              <div class="is-visible">
+                <el-radio-group v-model="radioVisibleActivity">
+                  <el-radio :label="1">仅本组客户可见</el-radio>
+                  <el-radio :label="2">所有组客户可见</el-radio>
+                </el-radio-group>
+                <el-checkbox v-model="decisionChecked">仅KP可见</el-checkbox>
+              </div>
+              <div style="display: flex">
+                <span style="width: 70px; flex-shrink: 0" class="text-right"> 套餐类型： </span>
+                <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange" :disabled="checkAllIs">
+                  全选
+                  <el-tooltip :content="checkboxTooltip('全选')" placement="top-start">
+                    <i class="el-icon-info" />
+                  </el-tooltip>
+                </el-checkbox>
+                <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
+                  <el-checkbox v-for="item in cities" :label="item.CustomerTypeId" :key="item.CustomerTypeId" :disabled="forbidden.includes(String(item.CustomerTypeId))">
+                    {{ item.CustomerName }}
+                    <el-tooltip :content="item.Explain" placement="top-start" v-if="item.Explain">
+                      <i class="el-icon-info" />
+                    </el-tooltip>
+                  </el-checkbox>
+                </el-checkbox-group>
+              </div>
+              <div class="checkbox-box" style="margin-top: 20px">
+                <span class="text-right"> 管理规模： </span>
+                <el-checkbox-group v-model="checkScaleList">
+                  <el-checkbox :disabled="scaleIsDisabled.includes('3')" label="3">100亿以上</el-checkbox>
+                  <el-checkbox :disabled="scaleIsDisabled.includes('2')" label="2">50～100亿</el-checkbox>
+                </el-checkbox-group>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <template v-if="activeIsState == 3">
+        <div class="audio-content">
+          <span class="text">会议音频：</span>
+          <el-button v-if="addEditVideo.length > 0" size="small" type="primary" @click="errorUpload">上传会议音频</el-button>
+          <el-upload
+            v-else
+            class="upload-demo"
+            action=""
+            :http-request="handleUploadAudio"
+            accept="audio/*"
+            :on-remove="handleRemoveAudio"
+            :before-remove="beforeRemoveAudio"
+            :limit="1"
+            :file-list="fileListAudio"
+          >
+            <el-button size="small" type="primary">上传会议音频</el-button>
+          </el-upload>
+        </div>
+        <div class="audio-content" style="margin-top: 10px">
+          <span class="text">会议视频：</span>
+          <el-button v-if="fileListAudio.length" size="small" type="primary" @click="errorUpload">上传会议视频</el-button>
+          <el-upload
+            v-else
+            class="upload-demo"
+            action=""
+            accept=".mp4"
+            :http-request="handleUpload"
+            :before-upload="handelBeforeUploadVideo"
+            :before-remove="beforeRemoveAudio"
+            :on-remove="handleRemoveVideo"
+            :file-list="addEditVideo"
+            :disabled="startUpload"
+            :limit="1"
+          >
+            <el-button size="small" type="primary" :loading="startUpload">上传会议视频</el-button>
+          </el-upload>
+          <el-progress type="circle" :percentage="percentage" width="40" style="margin-left: 10px" v-if="startUpload"></el-progress>
+        </div>
+        <div class="audio-content cover-content" style="margin-top: 10px" v-if="(fileListAudio.length || addEditVideo.length) && defaultImage">
+          <span class="text" style="width: 70px; text-align: right">封面：</span>
+          <div class="img-content">
+            <img :src="defaultImage" alt="" />
+            <div class="modify" @click="modifyImgHandler">修改</div>
+          </div>
+        </div>
+      </template>
+      <div style="text-align: center; margin-top: 30px">
+        <el-button type="primary" @click="submitForm('保存')">保存</el-button>
+        <el-button v-if="isShow" type="primary" @click="submitForm('发布')">发布</el-button>
+        <el-button @click="cancelBtn">取消</el-button>
+      </div>
+    </el-card>
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      :title="activityTypeName"
+      :visible.sync="dialogVisible"
+      customClass="customWidth"
+      :before-close="handleClose"
+    >
+      <div id="dialog" v-html="copyText"></div>
+      <div style="margin-bottom: 60px">
+        <div class="content-template" v-if="activityTypeName == '公司调研电话会'">
+          <div @click="contentTemplate('1')" :class="contentTemplateTitle == '1' ? 'active' : ''">进门财经模板</div>
+          <div @click="contentTemplate('2')" :class="contentTemplateTitle == '2' ? 'active' : ''">zoom模板</div>
+        </div>
+        <div v-html="templatePText" v-if="contentTemplateTitle == '1'"></div>
+        <div v-html="ZoomTemplateP" v-else></div>
+        <p v-if="cactivityType == 1" class="no-cv" style="color: #f00">注：多个活动同时输入时，请用分割线隔开</p>
+        <p v-else class="no-cv" style="color: #f00">注：每次只能输入一场活动信息{{ cactivityType == 6 ? "，多篇相关报告时，用分号“；”隔开" : "" }}</p>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取消</el-button>
+        <el-button id="copy_text" type="primary" v-if="contentTemplateTitle == '1'" :data-clipboard-text="copyTxt" @click="handleCopyFun">复制模版</el-button>
+        <el-button id="copy_text" type="primary" v-else :data-clipboard-text="zoomTemplate" @click="handleCopyFun">复制模版</el-button>
+      </span>
+    </el-dialog>
+    <add-industry-mark
+      :optionFormregion="optionFormregion.includes('研选') ? '研选' : optionFormregion"
+      :addIndustryDlg.sync="addIndustryDlg"
+      :addMarkDlg.sync="addMarkDlg"
+      @commitIndustryDlg="commitIndustryDlg"
+      @commitMarkDlg="commitMarkDlg"
+      :addMarkUpVal="addMarkUpVal"
+      :source="3"
+    />
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="查询标的" :visible.sync="dialogVisibleSubject" width="500px" :before-close="handleCloseSubject">
+      <div>
+        <el-select style="width: 100%" v-model="addSubjectName" remote :remote-method="remoteMethod" clearable filterable @change="searchInfo" placeholder="请输入标的名称">
+          <el-option v-for="item in addSubjectOptions" :key="item.IndustrialSubjectId" :label="item.SubjectName" :value="item.SubjectName"> </el-option>
+        </el-select>
+      </div>
+      <p class="subject-text" v-if="isShowSubject">暂无数据</p>
+      <template v-else>
+        <p class="subject-text" v-for="(item, index) in nameSubjectOptions" :key="index">{{ item.Name }} : {{ item.value }}</p>
+      </template>
+      <p style="padding-bottom: 50px"></p>
+    </el-dialog>
+    <modify-img-dlg :modifyImgVisible.sync="modifyImgVisible" :videoAndVoiceList.sync="videoAndVoiceList" />
+  </div>
+</template>
+
+<script>
+import { raiInterface, customInterence, getOSSSign, resourceVoiceupload } from "@/api/api.js";
+import VueFroala from "vue-froala-wysiwyg";
+import Clipboard from "clipboard";
+import AddIndustryMark from "../../components/addIndustryMark.vue";
+import richTextMixins from "../../components/apply/RichTextMixins";
+import MD5 from "js-md5";
+import ResearchDeduct from "./addComopnents/ResearchDeduct.vue";
+import ModifyImgDlg from "./addComopnents/modifyImgDlg.vue";
+
+export default {
+  name: "",
+  components: { AddIndustryMark, ResearchDeduct, ModifyImgDlg },
+  props: {},
+  data() {
+    return {
+      cactivityType: "",
+      content: "", //内容
+      optionFormregion: "", //行业选择
+      radio: "1", //单选按钮
+      isOptionRef: false,
+      chartPermissionList: [], //行业的数组
+      cactivityTypeList: [], //活动类型
+      dialogVisible: false, //弹框
+      astrict: "", //人数限制
+      copyTxt: "1", //复制的模版
+      templatePText: "",
+      checkedCities: [], //
+      checkedCitiesTwo: "",
+      cities: [], //
+      isIndeterminate: false, //是否
+      checkAll: false,
+      showType: "9",
+      activityTypeName: "纪要内容模板",
+      isShow: true,
+      isShowSelect: true,
+      forbidden: [],
+      checkAllIs: false,
+      contentTemplateTitle: "1",
+      zoomTemplate: "",
+      zoomTemplateP: "",
+      industryArr: [], //所有的行业
+      industryCascade: "", //所有行业及联的选择
+      markValue: "", //添加标的
+      markOptions: [], ///添加标的的数组
+      addMarkUpVal: {
+        industrialName: "",
+        industrialId: "",
+      }, //弹框里的
+      radioTemporary: false, //临时标签
+      valTemporary: "", //临时标签的输入框
+      selectDisabled: false, //临时标签的输入后全部禁用
+      defaultProps: {
+        label: "PermissionName",
+        children: "List",
+        value: "ChartPermissionId",
+      },
+      addIndustryDlg: false,
+      addMarkDlg: false,
+      subjectRadio: "1",
+      addSubjectLabel: [],
+      dialogVisibleSubject: false,
+      addSubjectName: "",
+      addSubjectOptions: "",
+      nameSubjectOptions: [],
+      isShowSubject: false,
+      ListSubject: [],
+      checkScaleList: [], //选择规模
+      scaleIsDisabled: "", //选择规模 禁用
+      isMark: false,
+      radioVisibleActivity: 2,
+      decisionChecked: false,
+      fileListAudio: [],
+      baseApi: process.env.API_ROOT,
+      activeIsState: "",
+      addEditVideo: [],
+      startUpload: false, //开始上传
+      percentage: 0,
+      isShowAddIcon: true, //主题标签的添加的iocn 是否显示
+      modifyImgVisible: false,
+      defaultImage: "",
+      shareImg: "",
+      videoAndVoiceList: [],
+      areaType: 1,
+    };
+  },
+  computed: {
+    // 弘则 研选 是否是研选
+    isResearch() {
+      return this.$route.path.indexOf("Purchaser") != -1 ? true : false;
+    },
+  },
+  mixins: [richTextMixins],
+  watch: {
+    radio: {
+      handler(newVal) {
+        if (newVal == 1) {
+          this.astrict = "";
+        }
+        if (this.$route.query.id) return;
+        this.isCheckAllType(this.cactivityType == 3 && newVal == 2 ? true : false);
+      },
+    },
+    radioTemporary() {
+      if (this.radioTemporary) {
+        this.selectDisabled = true;
+      } else {
+        this.valTemporary = "";
+        this.selectDisabled = false;
+      }
+    },
+    subjectRadio() {
+      this.addSubjectLabel = [];
+    },
+    cactivityType: {
+      handler(newval) {
+        if (this.$route.query.id) return;
+        this.isCheckAllType(newval === 4 ? true : false);
+      },
+    },
+    "$route.path": {
+      handler(value) {
+        console.log(value, "value");
+      },
+      immediate: true,
+    },
+  },
+  created() {},
+  mounted() {
+    if (!this.isResearch) {
+      this.chartPermission();
+    } else {
+      this.optionFormregion = "研选订阅";
+    }
+    this.getActivityType();
+    this.customerTypelist();
+    this.getIndustry();
+    if (this.$route.query.id) {
+      this.getDetail();
+    }
+    if (this.$route.query.isShow == 1) {
+      this.isShow = false;
+    }
+    if (this.$route.query.isShow >= 0) {
+      this.isShowSelect = false;
+    }
+  },
+  methods: {
+    // 上传音频
+    async handleUploadAudio(e) {
+      const loading = this.$loading({
+        lock: true,
+        text: "上传音频中...",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+      });
+      let form = new FormData();
+      form.append("file", e.file);
+      const res = await resourceVoiceupload(form);
+      if (res.Ret === 200) {
+        this.getVideoAndImg(1);
+        let obj = {
+          name: res.Data.ResourceName,
+          url: res.Data.ResourceUrl,
+          PlaySeconds: res.Data.PlaySeconds,
+        };
+        this.fileListAudio = [obj];
+        loading.close();
+      }
+    },
+    //删除新增的主题标签
+    deleteSubject(index, item) {
+      this.addSubjectLabel.splice(index, 1);
+    },
+    markSelectFocusAdd(index, item) {
+      item.markOptions = [];
+      item.IndustrialSubjectIdS = [];
+      let arr = [];
+      arr = item.IndustrialManagementIdS.map((key) => {
+        return key[1];
+      });
+      raiInterface
+        .getindustrialSubjectlistIds({
+          IndustrialManagementIdStr: arr.join(","),
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            item.markOptions = res.Data.List || [];
+          }
+        });
+    },
+    addLabelClick() {
+      if (this.addSubjectLabel.length) {
+        let index = this.addSubjectLabel.length - 1;
+        this.addSubjectLabel.push({
+          IndustrialManagementIdS: this.addSubjectLabel[index].IndustrialManagementIdS,
+          IndustrialSubjectIdS: this.addSubjectLabel[index].IndustrialSubjectIdS,
+          markOptions: this.addSubjectLabel[index].markOptions,
+          isMark: this.addSubjectLabel[index].isMark,
+          forbidden: this.addSubjectLabel[index].forbidden,
+          temporary: this.addSubjectLabel[index].temporary,
+          temporaryText: this.addSubjectLabel[index].temporaryText,
+          subscribe: this.addSubjectLabel[index].subscribe,
+        });
+      } else {
+        this.addSubjectLabel = [
+          {
+            IndustrialManagementIdS: this.industryCascade,
+            IndustrialSubjectIdS: this.markValue,
+            markOptions: this.markOptions,
+            isMark: this.isMark,
+            forbidden: this.selectDisabled,
+            temporary: this.radioTemporary,
+            temporaryText: this.valTemporary,
+            subscribe: this.$refs.researchSelect.isCanAppointmentMinutes,
+          },
+        ];
+      }
+    },
+    propertyChange() {
+      if (this.subjectRadio == 2) return;
+      this.markOptions = [];
+      this.markValue = "";
+    },
+    //添加后的 临时标签
+    temporaryChangeHandler(item) {
+      item.forbidden = item.temporary;
+      !item.forbidden ? (item.temporaryText = "") : "";
+    },
+    //编辑进来的详情
+    getDetail() {
+      raiInterface.activityDetail({ ActivityId: Number(this.$route.query.id) }).then((res) => {
+        if (res.Ret !== 200) return;
+        const { Data } = res;
+        this.defaultImage = Data.BackgroundImg;
+        this.shareImg = Data.ShareImg;
+        this.activeIsState = Data.ActiveState;
+        this.cactivityType = Data.ActivityTypeId;
+        this.optionFormregion = Data.ChartPermissionName;
+        this.checkedCities = Data.CustomerTypeIds ? Data.CustomerTypeIds.split(",").map((item) => Number(item)) : [];
+        this.astrict = Data.LimitPeopleNum == "0" ? "" : Data.LimitPeopleNum;
+        this.showType = Data.ShowType;
+        this.content = Data.Body;
+        this.checkScaleList = Data.Scale ? Data.Scale.split(",") : [];
+        this.scaleIsDisabled = Data.Scale;
+        this.radioVisibleActivity = Data.VisibleRange > 0 ? Data.VisibleRange : 1;
+        this.decisionChecked = Data.IsMakerShow == 1 ? true : false;
+        let checkedCount = Data.CustomerTypeIds ? Data.CustomerTypeIds.split(",").length : "";
+        this.checkAll = checkedCount === this.cities.length;
+        this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
+        this.isMark = Data.IsShowSubjectName == 1 ? true : false;
+        this.valTemporary = Data.TemporaryLabel;
+        this.radioTemporary = this.valTemporary ? true : false;
+        this.areaType = Data.AreaType;
+        // 复选框模块
+        this.$nextTick(() => {
+          let RefPage = this.$refs.researchSelect;
+          RefPage.isCanAppointmentMinutes = Data.IsCanAppointmentMinutes == 1 ? true : false;
+          RefPage.isYidongConduct = Data.IsYidongConduct == 1 ? true : false;
+          RefPage.isExternalLabel = Data.IsExternalLabel == 1 ? true : false;
+          RefPage.isCanOutboundCall = Data.IsCanOutboundCall == 1 ? true : false;
+          RefPage.isDeduct = Data.IsResearchPoints == 1 ? true : false;
+          RefPage.provideEmail = Data.IsNeedEmail == 1 ? true : false;
+          RefPage.isBClass = Data.IsBClass == 1 ? true : false;
+          RefPage.SiginupDeadline = Data.SiginupDeadline;
+          RefPage.PointsSet = Data.PointsSet;
+          RefPage.institutionName = Data.PointsSet.CompanyName;
+          RefPage.isShowHz = !!Data.IsShowHz;
+        });
+        this.addEditVideo = Data.VideoDetail
+          ? [Data.VideoDetail].map((item) => {
+              return { name: item.VideoName, PlaySeconds: item.VideoDuration, url: item.VideoUrl };
+            })
+          : [];
+        this.fileListAudio = Data.VoiceList
+          ? Data.VoiceList.map((item) => {
+              return { name: item.Name, PlaySeconds: item.PlaySeconds, url: item.Url };
+            })
+          : [];
+        if (Data.PublishStatus == 1) {
+          this.forbidden = Data.CustomerTypeIds ? Data.CustomerTypeIds.split(",") : [];
+          this.checkAllIs = this.forbidden.length >= 1;
+        }
+        if (this.astrict > 0 && this.showType == 2) {
+          this.radio = "2";
+        }
+        this.valTemporary = res.Data.TemporaryLabel;
+        this.radioTemporary = this.valTemporary ? true : false;
+        this.industryCascade = res.Data.ListIndustrial ? res.Data.ListIndustrial.map((item) => [item.ChartPermissionId, item.IndustrialManagementId]) : "";
+
+        this.markValue = res.Data.ListSubject ? res.Data.ListSubject.map((item) => item.IndustrialSubjectId) : "";
+        if (this.markValue) {
+          this.markSelectFocus();
+        }
+      });
+    },
+    //提交发布活保存前的校验
+    submitForm(type) {
+      if (this.checkedCities) {
+        this.checkedCitiesTwo = this.checkedCities.join(",");
+      }
+      if (!this.radioTemporary && !this.industryCascade.length) return this.$message.error("请选择产业!");
+      if (this.radioTemporary && !this.valTemporary) return this.$message.error("请输入临时标签！");
+      let arr = [];
+      if (this.industryCascade.length) {
+        arr = this.industryCascade.map((item) => {
+          return item[1];
+        });
+      }
+      if (this.showType == "3" || this.radio == "2") {
+        if (!this.astrict) return this.$message.error("请在输入框输入人数上限!");
+      }
+      if (!this.cactivityType || !this.optionFormregion) return this.$message.error("请选择行业或活动类型");
+      if (this.subjectRadio == 2) {
+        let labelArr = this.addSubjectLabel.map((item) => {
+          let labelArrList = [];
+          item.IndustrialManagementIdS.forEach((val) => {
+            labelArrList.push(val[1]);
+          });
+          return {
+            IndustrialManagementIdS: labelArrList.join(","),
+            IndustrialSubjectIdS: item.IndustrialSubjectIdS.join(","),
+            IsShowSubjectName: item.isMark ? 1 : 0,
+            TemporaryLabel: item.temporary ? item.temporaryText : "",
+            IsCanAppointmentMinutes: item.subscribe ? 1 : 0,
+          };
+        });
+        this.ListSubject = [
+          {
+            IndustrialManagementIdS: arr.length ? arr.join(",") : "",
+            IndustrialSubjectIdS: this.markValue.length ? this.markValue.join(",") : "",
+            IsShowSubjectName: this.isMark ? 1 : 0,
+            TemporaryLabel: this.radioTemporary ? this.valTemporary : "",
+            IsCanAppointmentMinutes: this.$refs.researchSelect.isCanAppointmentMinutes ? 1 : 0,
+          },
+          ...labelArr,
+        ];
+      } else {
+        this.ListSubject = [
+          {
+            IndustrialManagementIdS: arr.length ? arr.join(",") : "",
+            IndustrialSubjectIdS: this.markValue.length ? this.markValue.join(",") : "",
+            IsShowSubjectName: this.isMark ? 1 : 0,
+            TemporaryLabel: this.radioTemporary ? this.valTemporary : "",
+            IsCanAppointmentMinutes: this.$refs.researchSelect.isCanAppointmentMinutes ? 1 : 0,
+          },
+        ];
+      }
+      let VoiceList = this.fileListAudio.map((item) => {
+        return {
+          Name: item.name,
+          PlaySeconds: item.PlaySeconds.toString(),
+          Url: item.url,
+        };
+      });
+      let VideoDetail = this.addEditVideo.map((item) => {
+        return {
+          VideoName: item.name,
+          VideoDuration: item.PlaySeconds.toString(),
+          VideoUrl: item.url,
+        };
+      });
+      this.saveTheRelease(type, arr, VoiceList, VideoDetail[0]);
+    },
+    //保存或发布
+    saveTheRelease: _.debounce(async function (type, arr, VoiceList, VideoDetail) {
+      let RefPage = this.$refs.researchSelect;
+      let PointsSet = RefPage.PointsSet;
+      const res = await raiInterface.preserveAndPublishAdd({
+        DoType: type == "发布" ? 1 : 0,
+        ActivityId: Number(this.$route.query.id) || 0,
+        ActivityTypeId: Number(this.cactivityType),
+        Body: this.content,
+        PermissionName: this.optionFormregion,
+        CustomerTypeIds: this.checkedCitiesTwo,
+        IsAllCustomerType: this.checkAll ? 1 : 0,
+        LimitPeopleNum: Number(this.astrict) || 0,
+        IndustrialManagementIdS: arr.length ? arr.join(",") : "",
+        IndustrialSubjectIdS: this.markValue.length ? this.markValue.join(",") : "",
+        List: this.ListSubject,
+        Scale: this.checkScaleList.length ? this.checkScaleList.join(",") : "",
+        LabelType: Number(this.subjectRadio),
+        IsShowSubjectName: this.isMark ? 1 : 0,
+        IsMakerShow: this.decisionChecked ? 1 : 0,
+        VisibleRange: this.radioVisibleActivity,
+        VoiceList,
+        VideoDetail,
+        IsYidongConduct: RefPage.isYidongConduct ? 1 : 0,
+        IsExternalLabel: RefPage.isExternalLabel ? 1 : 0,
+        IsCanOutboundCall: RefPage.isCanOutboundCall ? 1 : 0,
+        IsResearchPoints: RefPage.isDeduct ? 1 : 0,
+        IsNeedEmail: RefPage.provideEmail ? 1 : 0,
+        IsBClass: RefPage.isBClass ? 1 : 0,
+        SiginupDeadline: RefPage.SiginupDeadline,
+        PointsSet,
+        BackgroundImg: this.defaultImage,
+        ShareImg: this.shareImg,
+        IsResearch: this.optionFormregion.includes("研选") ? true : false,
+        IsShowHz: RefPage.isShowHz ? 1 : 0,
+        AreaType: this.areaType,
+      });
+
+      if (res.Ret !== 200) return;
+      this.$message.success("操作成功！");
+      this.$router.back();
+    }, 500),
+    //获取行业
+    chartPermission() {
+      raiInterface.chartPermissionList({ IsHideResearch: !this.isResearch }).then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    //获取活动类型
+    getActivityType() {
+      raiInterface.getActivityType({ IsResearch: this.isResearch }).then((res) => {
+        if (res.Ret === 200) {
+          this.isShowAddIcon = res.Data.IsShowAddIcon;
+          this.cactivityTypeList = res.Data.List;
+        }
+      });
+    },
+    //获取活动类型详情
+    activityTypeDetail(e) {
+      this.radio = "1"; //单选按钮
+      this.astrict = ""; //人数限制
+      this.contentTemplateTitle = "1";
+      this.subjectRadio = "1";
+      this.checkedCities = [];
+      this.$refs.researchSelect.isBClass = false;
+      this.radioVisibleActivity = this.cactivityType == 7 ? 1 : 2;
+      if (!this.cactivityType) return;
+      raiInterface
+        .activityTypeDetail({
+          ActivityTypeId: this.cactivityType - 0,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.copyTxt = res.Data.Template;
+            this.templatePText = res.Data.TemplateP;
+            this.zoomTemplate = res.Data.ZoomTemplate;
+            this.ZoomTemplateP = res.Data.ZoomTemplateP;
+            this.showType = res.Data.ShowType;
+            this.activityTypeName = res.Data.ActivityTypeName;
+          }
+        });
+    },
+    // 操作：点击了复制按钮
+    handleCopyFun() {
+      let clipboard = new Clipboard("#copy_text");
+      clipboard.on("success", (e) => {
+        this.$message({
+          type: "success",
+          message: "复制成功!",
+        });
+        this.dialogVisible = false;
+        clipboard.destroy(); // 释放内存
+      });
+      clipboard.on("error", (e) => {
+        // 不支持复制
+        this.$Message.info("该浏览器不支持自动复制");
+        clipboard.destroy(); // 释放内存
+      });
+    },
+    //点击了复制模版
+    templateBtn() {
+      if (!this.cactivityType) return this.$message.error("请选择活动类型");
+      this.dialogVisible = true;
+    },
+    //获取多选的客户列表
+    customerTypelist() {
+      raiInterface.customerTypelist().then((res) => {
+        if (res.Ret === 200) {
+          this.cities = res.Data.List;
+        }
+      });
+    },
+    // 子组件来的事件 产业
+    commitIndustryDlg(data, type = "") {
+      this.getIndustry();
+      this.industryCascade.push([Number(data.ChartPermissionId), Number(data.NewId)]);
+    },
+    // 子组件来的事件 标的
+    commitMarkDlg(data) {
+      let arr = this.industryCascade.flat(Infinity);
+      raiInterface
+        .getindustrialSubjectlistIds({
+          IndustrialManagementIdStr: arr[1],
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.markOptions = res.Data.List || [];
+          }
+        });
+      this.markValue = data.split(",").map((item) => Number(item));
+    },
+    /* 获取全部的行业 */
+    getIndustry() {
+      raiInterface.getListIndustrial().then((res) => {
+        if (res.Ret === 200) {
+          this.industryArr = res.Data.List || [];
+        }
+      });
+    },
+    //top 行业清除的事件
+    clearTopIndustry() {
+      this.industryCascade = [];
+      this.radioTemporary = false;
+      this.valTemporary = "";
+      this.markValue = "";
+      this.radioVisibleActivity = 2;
+    },
+    //添加标的的点击事件
+    isAddMarketDlg() {
+      let arr = this.industryCascade.flat(Infinity);
+      this.industryArr.forEach((item) => {
+        if (item.ChartPermissionId == arr[0]) {
+          this.addMarkUpVal.industrialId = arr[1];
+          item.List.forEach((key) => {
+            if (key.ChartPermissionId == arr[1]) {
+              this.addMarkUpVal.industrialName = key.PermissionName;
+            }
+          });
+        }
+      });
+      if (this.industryCascade.length == 1) {
+        this.addMarkDlg = true;
+      } else if (this.industryCascade.length > 1) {
+        this.$message.error("已选多个产业，无法添加标的");
+      } else {
+        this.$message.error("请先选择产业");
+      }
+    },
+    //点击添加标的的下拉选择框
+    markSelectFocus() {
+      if (!this.industryCascade.length) {
+        this.$message.error("请先选择产业");
+      } else {
+        let arr = [];
+        arr = this.industryCascade.map((item) => {
+          return item[1];
+        });
+        raiInterface
+          .getindustrialSubjectlistIds({
+            IndustrialManagementIdStr: arr.join(","),
+          })
+          .then((res) => {
+            if (res.Ret === 200) {
+              this.markOptions = res.Data.List || [];
+            }
+          });
+      }
+    },
+    handleCheckAllChange(val) {
+      if (val) {
+        let newCodeList = this.cities.map((item) => item.CustomerTypeId);
+        this.checkedCities = newCodeList;
+      } else {
+        this.checkedCities = [];
+      }
+      this.checkedCitiesTwo = this.checkedCities.join(",");
+      this.isIndeterminate = false;
+    },
+    handleCheckedCitiesChange(value) {
+      let checkedCount = value.length;
+      this.checkAll = checkedCount === this.cities.length;
+      this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
+    },
+    cancelBtn() {
+      this.$router.back();
+    },
+    contentTemplate(type) {
+      this.contentTemplateTitle = type;
+    },
+    handleCloseSubject() {
+      this.nameSubjectOptions = [];
+      this.addSubjectName = "";
+      this.addSubjectOptions = [];
+      this.dialogVisibleSubject = false;
+    },
+    async remoteMethod(query) {
+      if (query !== "") {
+        const res = await raiInterface.industrialSubjectSearch({
+          KeyWord: query,
+        });
+        if (res.Ret === 200) {
+          this.addSubjectOptions = res.Data.List || [];
+        }
+      }
+    },
+    async searchInfo(val) {
+      if (val !== "") {
+        const res = await raiInterface.industrialSubjectSearchInfo({
+          KeyWord: val,
+        });
+        if (res.Ret === 200) {
+          this.isShowSubject = res.Data.List ? false : true;
+          let arrList = [];
+          arrList = res.Data.List
+            ? res.Data.List.map((item) => {
+                let arr = [];
+                item.List.forEach((key) => {
+                  arr.push(key.Name);
+                });
+                return {
+                  ...item,
+                  value: arr.join(","),
+                };
+              })
+            : [];
+          this.nameSubjectOptions = arrList;
+        }
+      } else {
+        this.nameSubjectOptions = [];
+      }
+    },
+    //套餐类型的 提升文本
+    checkboxTooltip(val) {
+      let str = "";
+      switch (val) {
+        case "全选":
+          str = "所有客户均可看到该活动（冻结、流失客户也可看到，但会提示无权限参会）";
+          break;
+        case "活动可见":
+          str = "套餐类型和管理规模两项下，均有勾选时，只要满足其中之一的条件，客户就可见此活动。例如：勾选了大套餐客户和100亿以上，则大套餐客户和100亿以上规模的客户都可以看到此活动";
+          break;
+      }
+      return str;
+    },
+    //删除上传
+    handleRemoveAudio(file, fileList) {
+      this.fileListAudio = [];
+    },
+    //删除上传前得确认
+    beforeRemoveAudio(file, fileList) {
+      return this.$confirm(`确定移除 ${file.name}？`);
+    },
+    //删除视频的上传
+    handleRemoveVideo(file, fileList) {
+      this.addEditVideo = [];
+    },
+    //获取视频时长的promise
+    handleGetDuration(file) {
+      return new Promise((resolve, reject) => {
+        const fileUrl = URL.createObjectURL(file);
+        const audioEl = new Audio(fileUrl);
+        audioEl.addEventListener("loadedmetadata", (e) => {
+          resolve(audioEl.duration);
+        });
+      });
+    },
+
+    //上传视频判断格式
+    handelBeforeUploadVideo(e) {
+      if (e.type != "video/mp4") {
+        this.$message.warning("上传失败，上传视频格式不正确");
+        return false;
+      }
+    },
+
+    // 上传视频
+    async handleUpload(e) {
+      const duration = await this.handleGetDuration(e.file);
+      this.addEditVideo.push({
+        name: e.file.name,
+        PlaySeconds: duration + "",
+        url: "",
+      });
+      const res = await getOSSSign();
+
+      if (res.Ret === 200) {
+        let accessKeyId = res.Data.AccessKeyId;
+        let accessKeySecret = res.Data.AccessKeySecret;
+        let stsToken = res.Data.SecurityToken;
+        this.handleUploadToOSS(e.file, accessKeyId, accessKeySecret, stsToken);
+      }
+    },
+    //上传到阿里云
+    async handleUploadToOSS(file, accessKeyId, accessKeySecret, stsToken) {
+      this.startUpload = true;
+      const ALOSSINS = new OSS({
+        // yourRegion填写Bucket所在地域。以华东1（杭州）为例，Region填写为oss-cn-hangzhou。
+        region: "oss-cn-shanghai",
+        // 从STS服务获取的临时访问密钥（AccessKey ID和AccessKey Secret）。
+        accessKeyId: accessKeyId,
+        accessKeySecret: accessKeySecret,
+        // 从STS服务获取的安全令牌（SecurityToken）。
+        stsToken: stsToken,
+        // 填写Bucket名称，例如examplebucket。
+        bucket: "hzchart",
+        endpoint: "hzstatic.hzinsights.com",
+        cname: true,
+        timeout: 600000,
+      });
+      // 生成文件名
+      const t = new Date().getTime().toString();
+      const temName = `static/yb/video/${MD5(t)}.${file.name.split(".")[1]}`;
+      console.log(temName);
+
+      const options = {
+        // 获取分片上传进度、断点和返回值。
+        progress: (p, cpt, res) => {
+          console.log(p);
+          this.percentage = parseInt(p * 100);
+        },
+        // 设置并发上传的分片数量。
+        parallel: 10,
+        // 设置分片大小。默认值为1 MB，最小值为100 KB。
+        partSize: 1024 * 1024 * 10, // 10MB
+      };
+      try {
+        const res = await ALOSSINS.multipartUpload(temName, file, { ...options });
+        console.log("上传结果", res);
+        if (res.res.status === 200) {
+          this.getVideoAndImg(2);
+          let VideoUrl = "https://hzstatic.hzinsights.com/" + res.name;
+          this.addEditVideo[0].url = VideoUrl;
+          this.startUpload = false;
+          this.percentage = 0;
+        }
+      } catch (error) {
+        this.$message.warning("上传失败，请刷新重试");
+        this.startUpload = false;
+        this.percentage = 0;
+      }
+    },
+    errorUpload() {
+      this.$message.error("音频文件和视频文件，仅支•持•上•传一个");
+    },
+    // 公司线下调研 调研电话会 的选择
+    isCheckAllType(newval) {
+      if (newval) {
+        let newCodeList = [];
+        this.cities.forEach((item) => {
+          if (![5, 6, 7].includes(item.CustomerTypeId)) {
+            newCodeList.push(item.CustomerTypeId);
+          }
+        });
+        this.checkedCities = newCodeList;
+        this.checkedCitiesTwo = this.checkedCities.join(",");
+        this.isIndeterminate = true;
+        this.checkAll = false;
+      } else {
+        this.checkedCities = [];
+        this.checkedCitiesTwo = "";
+        this.checkAll = false;
+      }
+    },
+    // 点击修改图片的弹框
+    modifyImgHandler() {
+      let type = this.addEditVideo.length > 0 ? 2 : 1;
+      this.getVideoAndImg(type, "修改");
+      this.modifyImgVisible = true;
+    },
+    // video_and_voiceImgActivityVideo（）
+    async getVideoAndImg(type, isOne = "") {
+      const res = await raiInterface.video_and_voiceImgActivityVideo({
+        FileType: type,
+        ActivityId: Number(this.$route.query.id),
+      });
+      if (res.Ret === 200) {
+        isOne == "修改" ? "" : (this.defaultImage = res.Data.List[0].ImgUrl);
+        this.videoAndVoiceList = res.Data.List;
+      }
+    },
+  },
+};
+</script>
+<style lang="scss">
+.container-addAct {
+  .content-template {
+    display: flex;
+    div {
+      margin-right: 20px;
+      padding-bottom: 4px;
+    }
+    .active {
+      border-bottom: 4px solid #409eff;
+    }
+    margin-bottom: 20px;
+  }
+  .customWidth {
+    width: 550px !important;
+  }
+  .top-box {
+    display: flex;
+    justify-content: space-between;
+  }
+  .fr-second-toolbar {
+    display: none;
+  }
+  #dialog {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    color: #333;
+    font-size: 14px;
+    div {
+      margin-bottom: 40px;
+    }
+  }
+  .no-cv {
+    margin-top: 30px;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+  .text-right {
+    display: inline-block;
+    text-align: right;
+  }
+  .radio-input {
+    display: flex;
+    align-items: center;
+    .el-input__inner {
+      box-sizing: border-box;
+      line-height: 30px;
+      width: 112px;
+      height: 28px !important;
+      background: #ffffff;
+      border: 1px solid #aab4cc;
+      border-radius: 4px;
+    }
+  }
+  .astrict-inpt {
+    box-sizing: border-box;
+    line-height: 30px;
+    width: 112px;
+    height: 28px !important;
+    background: #ffffff;
+    input {
+      padding: 10px;
+    }
+  }
+  .checkbox-box {
+    display: flex;
+    margin-bottom: 10px;
+    .el-checkbox {
+      margin-left: 5px;
+      margin-right: 30px;
+    }
+  }
+  .subject-text {
+    padding-top: 20px;
+  }
+  .is-visible {
+    margin-bottom: 20px;
+    .el-checkbox {
+      margin-left: 20px;
+    }
+  }
+  .audio-content {
+    display: flex;
+    align-items: center;
+    .test {
+      flex-shrink: 0;
+    }
+    .upload-demo {
+      display: flex;
+      .el-upload-list {
+        margin-left: 20px;
+      }
+    }
+  }
+  .cover-content {
+    align-items: stretch;
+    vertical-align: bottom;
+    .img-content {
+      position: relative;
+      height: 200px;
+      width: 200px;
+      border: 1px solid #ccc;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    .modify {
+      position: absolute;
+      bottom: 0;
+      right: -50px;
+      height: 20px;
+      cursor: pointer;
+      color: #409eff;
+    }
+  }
+
+  .el-upload-list__item.is-success.focusing .el-icon-close-tip {
+    display: none !important;
+  }
+}
+.fr-visible {
+  display: none !important;
+}
+.add-delete {
+  display: flex;
+  align-items: center;
+  img {
+    width: 18px;
+  }
+}
+</style>

src/views/rai_manage/activityManage/components/addComopnents/ResearchDeduct.vue

@@ -0,0 +1,216 @@
+<template>
+  <div style="margin-top: 20px" class="add-activity-deduct-page">
+    <el-checkbox v-model="isCanAppointmentMinutes">
+      可预约纪要
+      <el-tooltip placement="top-start" content="会后提供纪要的活动，请勾选此选项，小程序内会显示【预约纪要】按钮">
+        <i class="el-icon-info" />
+      </el-tooltip>
+    </el-checkbox>
+    <el-checkbox v-if="isResearch && [1, 3, 5, 8].includes(cactivityType)" v-model="isShowHz"> 同时在弘则活动页展示 </el-checkbox>
+    <el-checkbox v-if="cactivityType == 3" v-model="isExternalLabel"> 外部资源 </el-checkbox>
+    <template v-if="cactivityType == 7 || cactivityType == 2">
+      <el-checkbox v-model="isYidongConduct">
+        易董办会
+        <el-tooltip placement="top-start" content="在易董举办的活动，请勾选此选项">
+          <i class="el-icon-info" />
+        </el-tooltip>
+      </el-checkbox>
+      <el-checkbox v-if="isYidongConduct" v-model="isCanOutboundCall">
+        可提供外呼
+        <el-tooltip placement="top-start" content="用户可在小程序中选择预约外呼参会">
+          <i class="el-icon-info" />
+        </el-tooltip>
+      </el-checkbox>
+      <el-checkbox v-if="isYidongConduct && cactivityType == 2" v-model="isBClass"> B类非公开会议 </el-checkbox>
+    </template>
+    <template v-if="optionFormregion.includes('研选')">
+      <el-checkbox v-model="isDeduct" style="margin-right: 20px"> 研选扣点 </el-checkbox>
+      <el-select clearable @change="ObjectChangeHandler" v-model="PointsSet.PointsObject" placeholder="请选择扣点对象" v-if="isDeduct" style="width: 160px">
+        <el-option v-for="item in deductUser" :key="item.value" :label="item.label" :value="item.value"> </el-option>
+      </el-select>
+      <template v-if="isDeduct && PointsSet.PointsObject">
+        <el-select clearable v-model="PointsSet.CompanyPointsNum" placeholder="办会人扣点点数" v-if="PointsSet.PointsObject == 3" style="width: 160px">
+          <el-option v-for="item in dataPointsSet" :key="item.PointsNum" :label="item.PointsNum" :value="item.PointsNum"> </el-option>
+        </el-select>
+        <el-select clearable v-model="PointsSet.UserPointsNum" placeholder="请选择扣点点数" style="width: 160px" v-if="PointsSet.PointsObject == 1">
+          <el-option v-for="item in dataPointsSet" :key="item.PointsNum" :label="item.PointsNum" :value="item.PointsNum"> </el-option>
+        </el-select>
+        <el-select clearable v-model="PointsSet.CompanyPointsNum" placeholder="请选择扣点点数" style="width: 160px" v-if="PointsSet.PointsObject == 2">
+          <el-option v-for="item in dataPointsSet" :key="item.PointsNum" :label="item.PointsNum" :value="item.PointsNum"> </el-option>
+        </el-select>
+        <el-autocomplete
+          :fetch-suggestions="querySearchAsync"
+          clearable
+          v-model="institutionName"
+          placeholder=" 请输入办会机构名称"
+          v-if="PointsSet.PointsObject != 1"
+          style="width: 300px"
+          @select="companyChangeHandler"
+          @clear="companyClearHandler"
+        ></el-autocomplete>
+        <el-select clearable v-model="PointsSet.UserPointsNum" placeholder="参会人扣点点数" v-if="PointsSet.PointsObject == 3" style="width: 160px; margin-left: 20px">
+          <el-option v-for="item in dataPointsSet" :key="item.PointsNum" :label="item.PointsNum" :value="item.PointsNum"> </el-option>
+        </el-select>
+        <el-select clearable v-model="PointsSet.PointsType" placeholder="请选择扣点形式" v-if="PointsSet.PointsObject != 2" style="width: 160px">
+          <el-option v-for="item in pointsTypeList" :key="item.val" :label="item.label" :value="item.val"> </el-option>
+        </el-select>
+      </template>
+      <span style="margin: 0 20px" v-if="isDeduct">
+        报名截止时间：
+        <el-date-picker clearable v-model="SiginupDeadline" type="datetime" placeholder="选择日期时间" value-format="yyyy-MM-dd HH:mm:ss"> </el-date-picker>
+      </span>
+      <span style="margin: 0 20px 0 0" v-if="PointsSet.PointsType == 1">
+        取消报名截止时间：
+        <el-select clearable v-model="PointsSet.CancelDeadlineType" placeholder="请选择截止时间" style="width: 200px">
+          <el-option v-for="item in dataDeadlineSet" :key="item.Id" :label="item.Name" :value="item.Id"> </el-option>
+        </el-select>
+      </span>
+      <el-checkbox v-model="provideEmail"> 需提供邮箱 </el-checkbox>
+    </template>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import { DeductUser, DeductForm } from "./addOfEditData";
+export default {
+  name: "",
+  components: {},
+  props: {
+    cactivityType: {
+      required: true,
+      default: "",
+    },
+    optionFormregion: {
+      required: true,
+      type: String,
+      default: "",
+    },
+    isResearch: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      isCanAppointmentMinutes: false, // 可预约纪要
+      isYidongConduct: false, // 易懂办会
+      isCanOutboundCall: false, // 可提供外呼
+      isExternalLabel: false, //外部资源
+      institutionName: "", //机构名称
+      isDeduct: false, // 研选扣点
+      isBClass: false, // B类非公开
+      provideEmail: "", //提供邮箱
+      SiginupDeadline: "", //
+      nameCompany: [],
+      dataPointsSet: [],
+      PointsSet: {
+        PointsObject: "", //扣点对象
+        CompanyId: 0, //公司ID
+        CompanyName: "", //公司名称
+        UserPointsNum: "", //参会人扣点数量
+        PointsType: "", //扣点形式，1:报名即扣点，2:到会即扣点
+        CompanyPointsNum: "", //办会人扣点数量
+        CancelDeadlineType: "", //截至报名时间
+      },
+      dataDeadlineSet: [],
+      isShowHz: false,
+    };
+  },
+  computed: {
+    deductUser() {
+      return DeductUser;
+    },
+    pointsTypeList() {
+      return DeductForm;
+    },
+  },
+  watch: {
+    cactivityType: {
+      handler(newval) {
+        if (this.$route.query.id) return;
+        if (newval == 1) {
+          this.isCanAppointmentMinutes = true;
+        } else {
+          this.isCanAppointmentMinutes = false;
+        }
+      },
+    },
+  },
+  created() {
+    let time = new Date().toISOString().substr(0, 10);
+    this.SiginupDeadline = time + " 15:30:00";
+  },
+  mounted() {
+    this.getActivityPointsSet();
+    this.getActivityDeadlineSet();
+  },
+  methods: {
+    // 获取扣点点数的
+    async getActivityPointsSet() {
+      const res = await raiInterface.activityPointsSet();
+      if (res.Ret === 200) {
+        this.dataPointsSet = res.Data.List;
+      }
+    },
+    // 获取截取时间的
+    async getActivityDeadlineSet() {
+      const res = await raiInterface.activityDeadlineSet();
+      if (res.Ret === 200) {
+        this.dataDeadlineSet = res.Data;
+      }
+    },
+    // 远程搜索公司
+    async querySearchAsync(query, cb) {
+      cb([]);
+      if (query) {
+        const res = await raiInterface.activityCompanySearch({
+          KeyWord: query,
+        });
+        if (res.Ret === 200) {
+          let arr = res.Data.List.map((_) => {
+            return {
+              ..._,
+              value: `${_.CompanyName}  --  ${_.RealName}`,
+            };
+          });
+          this.nameCompany = arr;
+          cb(arr);
+        }
+      } else {
+        cb([]);
+      }
+    },
+    // 选择后的事件
+    companyChangeHandler() {
+      let itemData = this.nameCompany.find((item) => this.institutionName === item.value);
+      this.PointsSet.CompanyId = itemData.CompanyId;
+      this.PointsSet.CompanyName = itemData.value;
+    },
+    // 点击清楚
+    companyClearHandler() {
+      this.PointsSet.CompanyId = 0;
+      this.PointsSet.CompanyName = "";
+    },
+    // 数据的初始
+    ObjectChangeHandler() {
+      this.PointsSet.CompanyId = 0; //公司ID
+      this.PointsSet.CompanyName = ""; //公司名称
+      this.PointsSet.UserPointsNum = ""; //参会人扣点数量
+      this.PointsSet.PointsType = ""; //扣点形式，1=报名即扣点，2=到会即扣点
+      this.PointsSet.CompanyPointsNum = ""; //办会人扣点数量
+      this.PointsSet.CancelDeadlineType = ""; //办会人扣点数量
+      this.institutionName = ""; //
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.add-activity-deduct-page {
+  .el-select,
+  .el-input {
+    margin-right: 25px;
+    margin-bottom: 20px;
+  }
+}
+</style>

src/views/rai_manage/activityManage/components/addComopnents/addOfEditData.js

@@ -0,0 +1,16 @@
+export const DeductUser = [
+  { label: "参会人", value: "1" },
+  { label: "办会人", value: "2" },
+  { label: "办会人和参会人", value: "3" },
+];
+
+export const DeductForm = [
+  {
+    label: "到会扣点",
+    val: "2",
+  },
+  {
+    label: "报名即扣点",
+    val: "1",
+  },
+];

src/views/rai_manage/activityManage/components/addComopnents/modifyImgDlg.vue

@@ -0,0 +1,83 @@
+<template>
+  <div class="container">
+    <!-- 选择图片的弹框 -->
+    <el-dialog title="选择图片" :visible.sync="modifyImgVisible" width="80%" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center @close="cancelHandle">
+      <div class="seleect-img-box">
+        <div class="content-img" @click="clickSelectImg(item)" v-for="(item, index) in videoAndVoiceList" :key="index">
+          <img :src="item.ImgUrl" alt="" class="item-img" />
+        </div>
+      </div>
+      <!-- <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChangeSelectImg" />
+      </el-col> -->
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+
+export default {
+  name: "",
+  components: {},
+  props: {
+    modifyImgVisible: {
+      type: Boolean,
+      default: false,
+    },
+    videoAndVoiceList: {
+      type: Array,
+      default: [],
+    },
+  },
+  data() {
+    return {
+      imgListArr: [],
+      total: 0,
+      page_no: 1,
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    // this.getSelectImgListAll();
+  },
+  methods: {
+    // 选择图片的分页
+    handleCurrentChangeSelectImg(page) {
+      this.page_no = page;
+      this.getSelectImgList();
+    },
+    cancelHandle() {
+      this.$emit("update:modifyImgVisible", false);
+    },
+    clickSelectImg(item) {
+      this.$parent.defaultImage = item.ImgUrl;
+      this.$parent.shareImg = item.ShareImg;
+      this.cancelHandle();
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.seleect-img-box {
+  display: flex;
+  flex-wrap: wrap;
+  .content-img {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 236px;
+    height: 133px;
+    flex-shrink: 0;
+    margin: 0 50px 50px 0;
+    border: 1px solid #dcdfe6;
+    cursor: pointer;
+    .item-img {
+      width: 222px;
+      height: 119px;
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/components/appointment.vue

@@ -0,0 +1,197 @@
+<template>
+ <div class="container-appointment">
+     <!-- 头部el-card -->
+    <el-card style="margin-bottom: 20px;">
+      <div class="top-card-box">
+        <div></div>
+       <div>  
+           <el-input style="width:521px" v-model="keyWord" placeholder="请输入手机号/公司名称" clearable>
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+      </div>
+    </el-card>
+    <!-- 内容el-card -->
+    <el-card>
+      <div>
+        <el-select v-model="sellerName" @change="sellerNameChange" placeholder="所属销售" clearable>
+             <el-option v-for="item in sellerList" :key="item.SellerName" :label="item.SellerName" :value="item.SellerName"></el-option>
+          </el-select>
+          </div>
+        <!-- 表格部分 -->
+     <el-table :data="dataList"  style="width: 100%; margin-top: 20px;" border="">
+        <el-table-column prop="RealName" align="center" label="姓名"></el-table-column>
+        <el-table-column prop="Mobile" align="center" label="手机号"></el-table-column>
+        <el-table-column prop="CompanyName" align="center" label="公司名称"></el-table-column>
+        <el-table-column prop="SellerName" align="center" label="所属销售"></el-table-column>
+        <el-table-column prop="BreakAppointmentNum" align="center" label="爽约次数"></el-table-column>
+        <el-table-column prop="" align="center" label="操作">
+          <template slot-scope="scope">
+            <span class="editsty" @click="detail(scope.row.UserId)">查看详情</span>
+          </template>
+        </el-table-column>
+        <el-table-column width="170" prop="" align="center" label="报名限制">
+          <template slot-scope="scope">
+            <el-switch
+            :disabled="roleIdentity==='rai_seller'"
+             @change="switchChange(scope.row.UserId)"
+              v-model="scope.row.Operation"
+             active-text="已限制"
+            inactive-text="不限制">
+            </el-switch>
+          </template>
+        </el-table-column>
+     </el-table>
+      <el-col :span="24" class="toolbar">
+				<m-page 
+				:total="total"
+				:page_no="page_no"
+        :pageSize="10"
+				@handleCurrentChange="handleCurrentChange"/>
+			</el-col>
+    </el-card>
+     <el-dialog
+    
+      v-dialogDrag 
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      :visible.sync="dialogVisiblepartica"
+      customClass="custom-appoinetdialog"
+      :before-close="confirmPerson"
+    >
+    <div slot="title" style="display: flex; align-items: center">
+        <img
+          :src="$icons.warntop"
+          style="color: #fff; width: 16px; height: 16px; margin-right: 5px"
+        />
+        <span style="font-size: 16px">爽约详情</span>
+      </div>
+      <div>
+        <el-table  max-height="260px" :data="detailList" border style="width: 100%; margin-top: 10px;">
+        <el-table-column width="250" prop="ActivityName" align="center" label="活动名称"></el-table-column>
+        <el-table-column prop="ChartPermissionName" align="center" label="行业"></el-table-column>
+        <el-table-column prop="ActivityTypeName" align="center" label="活动类型"></el-table-column>
+        <el-table-column width="230" prop="ActivityTimeText" align="center" label="活动时间"></el-table-column>
+        </el-table>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmPerson">知道了</el-button>
+      </span>
+     </el-dialog>
+ </div>
+</template>
+
+<script>
+import mPage from '@/components/mPage.vue'
+import {raiInterface} from '@/api/api.js'
+export default {
+  name: '',
+  components: {mPage},
+  props: {},
+  data () {
+    return {
+        page_no:sessionStorage.getItem('interviewListBack')?JSON.parse(sessionStorage.getItem('interviewListBack')).page_no:1,
+        total:0,//条数
+        PageSize:10,//每页显示几条
+        dataList: [],//表格的列表
+        keyWord:'',
+        sellerName:'',
+        sellerList:[],
+        dialogVisiblepartica:false,
+        detailList:null
+    }
+  },
+  computed: {
+    roleIdentity(){
+      
+      return localStorage.getItem('RoleIdentity')
+    }
+  },
+  watch: {
+    keyWord(){
+      this.page_no=1
+      this.getsDataList()
+    }
+  },
+  created () {},
+  mounted () {
+    this.getsDataList()
+    this.sellerNameListList()
+  },
+  methods: {
+    sellerNameChange(){
+      this.page_no=1
+      this.getsDataList()
+    },
+      //列表表格
+    getsDataList(){
+      raiInterface.breakAppointmentList({
+        CurrentIndex:this.page_no,
+        PageSize:this.PageSize,
+        KeyWord:this.keyWord,
+        SellerName:this.sellerName
+      }).then((res) => {
+        if(res.Ret !== 200) return
+        this.dataList=res.Data.List
+        this.total= res.Data.Paging.Totals
+      })
+    },
+      //分页
+    handleCurrentChange(page){
+     	this.page_no = page
+      this.getsDataList()
+    },
+    detail(id){
+        raiInterface.breakAppointmentDetail({ UserId:id}).then((res)=>{
+         if(res.Ret !== 200) return
+          this.dialogVisiblepartica=true
+          this.$nextTick(()=>{
+            this.detailList=res.Data.List
+          })
+        })
+    },
+    confirmPerson(){
+       this.dialogVisiblepartica=false
+    },
+    sellerNameListList(){
+      raiInterface.sellerNameListList().then((res)=>{
+        if(res.Ret===200){
+          this.sellerList=res.Data.List
+        }
+      })
+    },
+    switchChange(id){
+       raiInterface.signUpRestrictUid({
+        UserId:id,
+     }).then((res) =>{
+       if(res.Ret === 200){
+          this.$message.success('操作成功')
+       }else{
+          this.getsDataList()
+       }
+       
+     })   
+    }
+  }
+}
+</script>
+<style  lang="scss">
+.container-appointment{
+  .custom-appoinetdialog {
+    width: 800px;
+  }
+    .top-card-box {
+        display: flex;
+        justify-content: space-between;
+    }
+    .el-switch__label  {
+    color: #606266 ;
+   font-size: 14px;
+   font-weight:400;
+  }
+   .is-active {
+    color: #409EFF !important;
+  }
+}
+</style>

src/views/rai_manage/activityManage/components/attendMeeting.vue

@@ -0,0 +1,200 @@
+<template>
+  <div class="container-attendMeeting">
+    <el-card style="margin-bottom: 20px">
+      <h4 style="margin-bottom: 10px">预约客户</h4>
+      <el-table :data="makeList" style="width: 100%" border>
+        <el-table-column min-width="75" align="center" prop="RealName" label="姓名" width=""> </el-table-column>
+        <el-table-column min-width="110" align="center" prop="Mobile" label="手机号" width=""> </el-table-column>
+        <el-table-column min-width="110" align="center" prop="OutboundMobile" label="外呼号码" width=""> </el-table-column>
+        <el-table-column min-width="150" align="center" prop="CompanyName" label="公司名称" width=""> </el-table-column>
+        <el-table-column min-width="115" align="center" prop="SellerName" label="所属销售" width=""> </el-table-column>
+        <el-table-column align="center" prop="" label="是否到会" width="">
+          <template slot-scope="scope">
+            {{ scope.row.IsMeeting == 1 ? "已到会" : "未到会" }}
+          </template>
+        </el-table-column>
+        <el-table-column min-width="130" align="center" prop="FirstMeetingTime" label="首次入会时间" width=""> </el-table-column>
+        <el-table-column min-width="130" align="center" prop="LastMeetingTime" label="最后退出时间" width=""> </el-table-column>
+        <el-table-column min-width="98" align="center" prop="Duration" label="参与总时长" width=""> </el-table-column>
+        <el-table-column min-width="91" align="center" prop="MeetingTypeStr" label="参会方式" width=""> </el-table-column>
+        <el-table-column min-width="91" align="center" prop="MeetingAuthentication" label="参会鉴权" width=""> </el-table-column>
+        <el-table-column min-width="91" align="center" prop="MeetingStatusStr" label="参会状态" width=""> </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card style="margin-bottom: 20px">
+      <h4 style="margin-bottom: 10px">未预约客户</h4>
+      <el-table :data="notMakeList" style="width: 100%" border>
+        <el-table-column min-width="75" align="center" prop="RealName" label="姓名" width=""> </el-table-column>
+        <el-table-column min-width="110" align="center" prop="Mobile" label="手机号" width=""> </el-table-column>
+        <el-table-column min-width="160" align="center" prop="CompanyName" label="公司名称" width=""> </el-table-column>
+        <el-table-column min-width="125" align="center" prop="SellerName" label="所属销售" width=""> </el-table-column>
+        <el-table-column min-width="160" align="center" prop="FirstMeetingTime" label="首次入会时间" width=""> </el-table-column>
+        <el-table-column min-width="160" align="center" prop="LastMeetingTime" label="最后退出时间" width=""> </el-table-column>
+        <el-table-column min-width="98" align="center" prop="Duration" label="参与总时长" width=""> </el-table-column>
+        <el-table-column min-width="91" align="center" prop="MeetingTypeStr" label="参会方式" width=""> </el-table-column>
+        <el-table-column min-width="91" align="center" prop="MeetingAuthentication" label="参会鉴权" width=""> </el-table-column>
+        <el-table-column min-width="91" align="center" prop="MeetingStatusStr" label="参会状态" width=""> </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card style="margin-bottom: 20px">
+      <h4 style="margin-bottom: 10px">潜在客户</h4>
+      <el-table :data="potentialList" style="width: 100%" border>
+        <el-table-column width="300" align="center" prop="RealName" label="备注">
+          <template slot-scope="{ row }">
+            <div class="remark-list">
+              <span>{{ row.Content }}</span>
+              <div class="button">
+                <span class="editsty" @click="examineHandle(row, '添加')">添加</span>
+                <span class="editsty" @click="examineHandle(row, '历史')">历史</span>
+              </div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="75" align="center" prop="RealName" label="姓名" width=""> </el-table-column>
+        <el-table-column min-width="110" align="center" prop="Mobile" label="手机号" width=""> </el-table-column>
+        <el-table-column min-width="160" align="center" prop="CompanyName" label="公司名称" width=""> </el-table-column>
+        <el-table-column min-width="125" align="center" prop="Position" label="职位" width=""> </el-table-column>
+        <el-table-column min-width="160" align="center" prop="FirstMeetingTime" label="首次入会时间" width=""> </el-table-column>
+        <el-table-column min-width="160" align="center" prop="LastMeetingTime" label="最后退出时间" width=""> </el-table-column>
+        <el-table-column min-width="98" align="center" prop="Duration" label="参与总时长" width=""> </el-table-column>
+        <el-table-column min-width="91" align="center" prop="MeetingTypeStr" label="参会方式" width=""> </el-table-column>
+        <el-table-column min-width="91" align="center" prop="MeetingAuthentication" label="参会鉴权" width=""> </el-table-column>
+        <el-table-column min-width="91" align="center" prop="MeetingStatusStr" label="参会状态" width=""> </el-table-column>
+      </el-table>
+    </el-card>
+    <el-dialog v-dialogDrag :visible.sync="examineOrAddDlg" :close-on-click-modal="false" :modal-append-to-body="false" @close="cancelHandle" center :width="examineOrAddShow ? '800px' : '500px'">
+      <div slot="title">
+        <i class="el-icon-close" style="fontsize: 24px; cursor: pointer; position: absolute; right: 20px; top: 50%; transform: translateY(-50%)" @click="cancelHandle"></i>
+        <span style="fontsize: 16px">{{ examineOrAddShow ? "历史备注" : "添加备注" }}</span>
+      </div>
+      <div v-if="examineOrAddShow">
+        <el-table :data="lableRemarkList" style="width: 100%" border height="350">
+          <el-table-column align="center" prop="Content" label="备注信息"> </el-table-column>
+          <el-table-column align="center" width="90" prop="RealName" label="备注人"> </el-table-column>
+          <el-table-column align="center" width="200" prop="CreateTime" label="备注时间"> </el-table-column>
+        </el-table>
+      </div>
+      <div v-else>
+        <el-input type="textarea" :rows="4" placeholder="请输入备注信息" v-model.trim="addRemarText"> </el-input>
+      </div>
+      <div style="display: flex; justify-content: center; margin: 40px 0">
+        <template v-if="!examineOrAddShow">
+          <el-button type="primary" @click="saveHandle">确定</el-button>
+          <el-button type="primary" plain @click="cancelHandle">关闭</el-button>
+        </template>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {},
+  data() {
+    return {
+      makeList: [],
+      notMakeList: [],
+      potentialList: [],
+      examineOrAddDlg: false, //弹窗
+      examineOrAddShow: false, //区分弹窗显示
+      addRemarText: "", //备注输入框
+      lableRemarkList: [], //备注数据
+      addRemarksFrom: {}, //item 的数据
+      remainTime: 0,
+      remainTiming: null, //
+      articleId: null, //
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {
+    this.remainTiming = setInterval(() => {
+      this.remainTime++;
+    }, 1000);
+  },
+  mounted() {
+    this.articleId = +this.$route.query.id;
+    this.attendanceDetail();
+  },
+  methods: {
+    async attendanceDetail() {
+      const res = await raiInterface.attendanceDetail({
+        ActivityId: this.articleId,
+      });
+      try {
+        if (res.Ret === 200) {
+          this.makeList = res.Data.List1;
+          this.notMakeList = res.Data.List2;
+          this.potentialList = res.Data.List3;
+        }
+      } catch (err) {}
+    },
+    //弹窗的开启事件
+    async examineHandle(item, type) {
+      this.addRemarksFrom = item;
+      this.examineOrAddShow = type === "历史" ? true : false;
+      this.examineOrAddDlg = true;
+      if (this.examineOrAddShow) {
+        const res = await raiInterface.activityMeetRemarkList({ Mobile: item.Mobile });
+        if (res.Ret === 200) {
+          this.$nextTick(() => {
+            this.lableRemarkList = res.Data.List || [];
+          });
+        }
+      }
+    },
+    //弹窗的关闭事件
+    cancelHandle() {
+      this.addRemarksFrom = {};
+      this.addRemarText = "";
+      this.examineOrAddDlg = false;
+    },
+    //添加备注的确定事件
+    async saveHandle() {
+      if (!this.addRemarText) return this.$message.error("请输入备注内容");
+      const res = await raiInterface.activityMeetAddRemarks({
+        ActivityId: this.addRemarksFrom.ActivityId,
+        Mobile: this.addRemarksFrom.Mobile,
+        Content: this.addRemarText,
+      });
+      if (res.Ret === 200) {
+        this.addRemarksFrom = {};
+        this.addRemarText = "";
+        this.examineOrAddDlg = false;
+        this.$message.success("添加成功");
+        this.attendanceDetail();
+      }
+    },
+    //添加阅读时长
+    async activityMeetAddStopTime() {
+      const res = await raiInterface.activityMeetAddStopTime({
+        ActivityId: this.articleId,
+        StopTime: this.remainTime,
+      });
+      if (res.Ret === 200) {
+      }
+    },
+  },
+  destroyed() {
+    clearInterval(this.remainTiming);
+    this.activityMeetAddStopTime();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-attendMeeting {
+  .remark-list {
+    display: flex;
+    text-align: left;
+    justify-content: space-between;
+    .button {
+      display: flex;
+      flex-direction: column;
+      flex-shrink: 0;
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/components/imgMeeting.vue

@@ -0,0 +1,124 @@
+<template>
+  <div class="container-img-meeting">
+    <el-dialog width="800px" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="新建标的" :visible.sync="isShowImgMeetingDlg" :before-close="handleClose">
+      <div style="margin-bottom: 10px">
+        <p>请确认建会信息:</p>
+        <div class="box-content" style="padding-left:20px">
+          <div class="box-date">日期</div>
+          <div class="box-time">时间</div>
+          <div class="box-name">公司名称</div>
+        </div>
+      </div>
+      <div class="box-content hover-box-content" v-for="(item, index) in imgMeetingData" :key="item.id">
+        <div class="box-date">
+          <el-date-picker v-model="item.TitmeYMD" type="date" value-format="yyyy年MM月dd日" format="yyyy年MM月dd日  (周ddd)" placeholder="选择日期" style="width: 230px"> </el-date-picker>
+        </div>
+        <div class="box-time">
+          <el-time-picker v-model="item.TitmeHM" value-format="hh:mm A" format="hh:mm A" placeholder="任意时间点" style="width: 160px"> </el-time-picker>
+        </div>
+        <div class="box-name">
+          <el-input v-model="item.Company" placeholder="请输入内容" style="width: 100%" clearable></el-input>
+        </div>
+        <div class="delete-item-icon" @click="deleteLabelItem(item, index)">
+          <img src="~@/assets/img/icons/delete-Item.png" alt="" />
+        </div>
+      </div>
+
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmPerson">确定</el-button>
+        <el-button @click="handleClose">取消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    isShowImgMeetingDlg: {
+      type: Boolean,
+      required: true,
+      default: false,
+    },
+    imgMeetingData: {
+      default: [],
+      required: true,
+      type: Array,
+    },
+  },
+  data() {
+    return {
+      value1: "",
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {},
+  methods: {
+    // 确定事件
+    async confirmPerson() {
+      let isConfirm = this.imgMeetingData.every((item) => item.TitmeYMD && item.TitmeHM && item.Company);
+      if (!isConfirm) return this.$message.error("每格的内容都必填。");
+      const res = await raiInterface.preserveAndPublishAdd({
+        ListImgToText: this.imgMeetingData,
+      });
+      console.log(res);
+      if (res.Ret === 200) {
+        this.$message.success("新增成功！");
+        this.$parent.page_no = 1;
+        this.$parent.getsummaryManageList();
+        this.handleClose();
+      }
+    },
+    handleClose() {
+      this.$emit("update:isShowImgMeetingDlg", false);
+
+      this.$emit("childrenImgMeetingHandler");
+    },
+    deleteLabelItem(item, index) {
+      this.$parent.imgMeetingData.splice(index, 1);
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-img-meeting {
+  .box-content {
+    margin-top: 20px;
+    display: flex;
+    font-weight: 500;
+
+    .box-date {
+      width: 230px;
+      margin-right: 20px;
+    }
+    .box-time {
+      width: 160px;
+      margin-right: 20px;
+    }
+    .box-name {
+      width: 260px;
+    }
+    .delete-item-icon {
+      display: flex;
+      align-items: center;
+      margin-left: 20px;
+      img {
+        width: 15px;
+        height: 15px;
+      }
+    }
+  }
+  .hover-box-content {
+    margin-top: 0;
+    padding: 10px 20px;
+    &:hover {
+      background-color: #eaf3fe;
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/meetingManagement.vue

@@ -0,0 +1,519 @@
+<template>
+  <!-- 实际到会管理页面 -->
+  <div class="container-practical">
+    <!-- 头部el-card -->
+    <el-card style="margin-bottom: 20px">
+      <div class="top-card-box">
+        <el-radio-group v-model="meetingTab" class="tabs-box">
+          <el-radio-button :label="1">线上到会管理</el-radio-button>
+          <el-radio-button :label="2">线下到会管理</el-radio-button>
+        </el-radio-group>
+        <div>
+          <el-input v-model="keyWord" placeholder="请输入活动名称" style="width: 521px" clearable>
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+      </div>
+    </el-card>
+    <!-- 内容el-card -->
+    <el-card>
+      <!-- 选择部分 -->
+      <div class="screen-box">
+        <div>
+          <el-select placeholder="行业" clearable v-model="industry" @change="conditionChange" style="margin-bottom: 20px"
+          v-if="!isResearch">
+            <el-option
+              v-for="item in chartPermissionList"
+              :label="item.PermissionName"
+              :key="item.ChartPermissionId"
+              :value="item.ChartPermissionId"
+            ></el-option>
+          </el-select>
+          <el-select
+            placeholder="活动类型"
+            clearable
+            @focus="activityType"
+            v-model="cactivityTypeVal"
+            @change="conditionChange"
+            style="margin-bottom: 20px"
+          >
+            <el-option
+              v-for="item in cactivityTypeList"
+              :label="item.ActivityTypeName"
+              :key="item.ActivityTypeId"
+              :value="item.ActivityTypeId"
+            ></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="活动时间" value-type="format" @change="conditionChange"> </date-picker>
+        </div>
+        <div class="top-buttons">
+          <el-button type="primary" @click="searchCustomer = true" v-if="meetingTab==1">搜索流失客户</el-button>
+          <el-button style="margin-left: 20px" type="primary" 
+          @click="$router.push(isResearch?'/purchaserAppointment':'/appointment')">查看客户爽约记录</el-button>
+        </div>
+      </div>
+      <!-- 表格部分 -->
+      <el-table :data="dataList" style="width: 100%; margin-top: 20px" border="">
+        <el-table-column min-width="400" align="center" label="活动名称">
+          <template slot-scope="scope">
+            <span class="editsty" @click="titleBtnClick(scope.row.ActivityId)"> {{ scope.row.ActivityName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="ChartPermissionName" align="center" label="行业"></el-table-column>
+        <el-table-column min-width="120" prop="ActivityTypeName" align="center" label="活动类型"></el-table-column>
+        <el-table-column min-width="219" prop="ActivityTimeText" align="center" label="活动时间"></el-table-column>
+        <el-table-column prop="" align="center" label="报名人数">
+          <template slot-scope="scope">
+            <span class="editsty" @click="particulars(scope.row.ActivityId)">{{ scope.row.SignupPeopleNum }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="105" prop="MeetPeopleNum" align="center" label="实际参会人数"></el-table-column>
+        <el-table-column min-width="105" prop="UpdateTime" align="center" label="数据更新时间" v-if="meetingTab==1"></el-table-column>
+        <el-table-column min-width="115" align="center" label="操作" v-if="meetingTab==1">
+          <template slot-scope="scope">
+            <!-- <input type="file" size="small" name="file" @change="fileSelected()" id="fileImport" class="true-file" style="display: none" /> -->
+            <p class="editsty" v-if="scope.row.IsShowHandMovement" @click="matching(scope.row.ActivityId)">&nbsp;&nbsp;手动匹配</p>
+            <!-- <span class="editsty" v-if="scope.row.IsYidongConduct === 1" @click="particularsSubmit(scope.row.ActivityId)"
+              >{{ scope.row.IsSubmitMeeting === 0 ? "上传" : "修改" }}参会表格</span
+            > -->
+            <span class="editsty" v-if="scope.row.IsShowSubmitMeeting" @click="arriveHandel(scope.row.ActivityId)">&nbsp;&nbsp;提交到会情况</span>
+            <span class="editsty" v-if="scope.row.IsShowUpdateMeeting" @click="arriveHandel(scope.row.ActivityId)">&nbsp;&nbsp;修改到会情况</span>
+            <span class="editsty" v-if="scope.row.IsShowAttendanceDetails" @click="attendMeeting(scope.row, '到会详情')">&nbsp;&nbsp;到会详情</span>
+            <el-popover v-else-if="scope.row.IsSubmitMeeting == 1 && scope.row.OperationStyle == 2" width="500" trigger="hover" placement="right">
+              <p>到会详情浏览记录</p>
+              <el-table :data="gridData" style="width: 100%" border height="350">
+                <el-table-column align="center" property="RealName" label="浏览人"></el-table-column>
+                <el-table-column align="center" property="CreateTime" label="浏览时间"></el-table-column>
+                <el-table-column align="center" property="StopTime" label="停留时长">
+                  <template slot-scope="{ row }">
+                    {{ row.StopTime }}
+                    <span v-if="row.StopTime">s</span>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <p slot="reference" class="editsty" @mouseenter="popoverMouseenter(scope.row.ActivityId)" @click="goDetail(scope.row.ActivityId)">
+                &nbsp;&nbsp;到会详情
+              </p>
+            </el-popover>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center" label="操作" v-else-if="meetingTab==2">
+          <template slot-scope="scope">
+            <span v-if="scope.row.OperationStyle == 1" class="editsty" @click="arriveHandel(scope.row.ActivityId)"
+              >&nbsp;&nbsp;提交到会情况</span
+            >
+
+            <span class="editsty" v-if="scope.row.OperationStyle == 2" @click="arriveHandel(scope.row.ActivityId)"
+              >&nbsp;&nbsp;修改到会情况</span
+            >
+
+            <span class="editsty" v-if="scope.row.OperationStyle == 2" @click="particularsOffline(scope.row.ActivityId, '到会详情')"
+              >&nbsp;&nbsp;到会详情</span
+            >
+           
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="PageSize" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <!-- 详情弹框 -->
+    <atc-particulars :dialogVisible.sync="dialogVisible" :detailData.sync="detailData" />
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      :visible.sync="dialogLeparticaShow"
+      customClass="custom-applydialog"
+      :before-close="confirmPerson"
+    >
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.warntop" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">
+          {{ excelType == "Teleconference" && isLimitPeople == 1 ? "预约外呼详情" : "报名详情" }}
+        </span>
+      </div>
+      <div>
+        <p style="margin-bottom: 10px" v-if="isYiDongShow">
+          <template v-if="memberType == 'Admin'"> 共有{{ totalDlg }}人{{ excelType == "AppointmentCall" ? "预约外呼" : "报名" }} </template>
+          <template v-else-if="memberType == 'Sale'">
+            共有{{ totalDlg }}人{{ excelType == "AppointmentCall" ? "预约外呼" : "报名" }}，其中本人名下客户{{ myTotalDlg }}人
+          </template>
+          <template v-else>
+            共有{{ totalDlg }}人{{ excelType == "AppointmentCall" ? "预约外呼" : "报名" }}，其中本组名下客户{{ myTotalDlg }}人
+          </template>
+        </p>
+        <p style="margin-bottom: 10px" v-else>
+          <template v-if="memberType == 'Admin'"> 共有{{ totalDlg }}人报名</template>
+        </p>
+        <el-table max-height="260px" :data="tableDataSub" border style="width: 100%">
+          <el-table-column width="130" align="center" prop="RealName" key="name" label="姓名"></el-table-column>
+          <el-table-column width="150" align="center" prop="Mobile" key="mobile" label="手机号" v-if="isYiDongShow"></el-table-column>
+          <el-table-column
+            width="150"
+            align="center"
+            prop="OutboundMobile"
+            key="outboundMobile"
+            label="外呼号码"
+            v-if="isYiDongShow"
+          ></el-table-column>
+          <el-table-column align="center" prop="CompanyName" key="company" label="公司名称" v-if="isCClassNot"></el-table-column>
+          <el-table-column width="150" align="center" prop="SellerName" key="seller" label="所属销售"></el-table-column>
+          <el-table-column min-width="110" key="meeting" align="center" label="参会方式" v-if="isYiDongShow">
+            <template slot-scope="{ row }">
+              <span>
+                {{ row.SignupType == 1 ? "预约外呼" : row.SignupType == 2 ? "自主拨入" : row.SignupType == 4 ? "自主入会" : "" }}
+              </span>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmPerson">知道了</el-button>
+      </span>
+    </el-dialog>
+    <matching-dlg :matchingDlgShow.sync="matchingDlgShow" :matchingId="matchingId" />
+    <partical-dialog
+      :type="attendType"
+      :offlineId="offlineId"
+      :submitDialog.sync="submitDialog"
+      :dialogVisiblepartica.sync="dialogVisiblepartica"
+      :particlaDlg="particlaDlg"
+    />
+    <search-customer-dlg :searchCustomer.sync="searchCustomer" />
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+import AtcParticulars from "../components/atcParticulars.vue";
+import MatchingDlg from "../components/matchingDlg.vue";
+import ParticalDialog from "../components/particalDialog.vue";
+import SearchCustomerDlg from "../components/apply/searchCustomerDlg.vue";
+
+export default {
+  name: "meetingManagement",
+  components: { mPage, AtcParticulars, MatchingDlg, ParticalDialog, SearchCustomerDlg },
+  props: {},
+  data() {
+    return {
+      meetingTab:1,
+      dataList: [], //表格的列表
+      tableDataSub: [],
+      page_no: sessionStorage.getItem("interviewListBack") ? JSON.parse(sessionStorage.getItem("interviewListBack")).page_no : 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      keyWord: "",
+      industry: "", //行业
+      cactivityTypeVal: "", //活动
+      chartPermissionList: [], //行业的数组
+      cactivityTypeList: [], //活动类型
+      issueTime: "", //时间
+      tabsPitchonType: 1,
+      detailData: {}, //
+      dialogVisible: false,
+      dialogLeparticaShow: false,
+      companyId: "", //
+      excelType: "",
+      isLimitPeople: "",
+      totalDlg: 0,
+      myTotalDlg: 0,
+      memberType: "",
+      matchingDlgShow: false, //匹配弹框
+      matchingId: "",
+      gridData: [],
+      submitDialog: false, //
+      offlineId: "",
+      dialogVisiblepartica: false, //
+      searchCustomer: false, //搜索流失客户
+      isYidongConduct: 0,
+      particlaDlg: {
+        isSpecial: false,
+        id: "",
+        title: "",
+        type: "",
+      },
+    };
+  },
+  computed: {
+    // 弘则 研选 是否是研选
+    isResearch(){
+      return this.$route.path.indexOf("purchaser")!=-1?true:false
+    },
+    exportUser() {
+      return process.env.API_ROOT + "/cygx/activityMeet/meetingExport?" + localStorage.getItem("auth") || "";
+    },
+    isYiDongShow() {
+      return this.isYidongConduct === 1 || this.excelType !== "CClass";
+    },
+    isCClassNot() {
+      return this.isYidongConduct != 1 && this.excelType == "CClass";
+    },
+    attendType(){
+      return this.meetingTab == 1 ? "" : "线下到会";
+    }
+  },
+  watch: {
+    keyWord() {
+      this.page_no = 1;
+      this.init();
+      this.getsDataList();
+    },
+    meetingTab(value) {
+      if(!this.keyWord){
+        this.page_no = 1;
+        this.init();
+        this.getsDataList();
+      } else this.keyWord=""
+    },
+  },
+  created() {},
+  mounted() {
+    !this.isResearch && this.chartPermission();
+    this.getsDataList();
+  },
+  methods: {
+    init() {
+      this.industry = ""; //行业
+      this.issueTime = ""; //时间
+      this.cactivityTypeVal = ""; //活动
+    },
+    //获取行业
+    chartPermission() {
+      raiInterface.chartPermission({IsHideResearch:!this.isResearch}).then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    //活动类型
+    activityType() {
+      raiInterface
+        .activityTypeMeetType({
+          MeetType: this.meetingTab,
+          IsResearch:this.isResearch
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.cactivityTypeList = res.Data.List;
+          }
+        });
+    },
+    //change事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getsDataList();
+    },
+    //列表表格
+    getsDataList() {
+      raiInterface
+        .activityMeetList({
+          CurrentIndex: this.page_no,
+          PageSize: this.PageSize,
+          StartDate: this.issueTime[0],
+          EndDate: this.issueTime[1],
+          KeyWord: this.keyWord,
+          SearchType: this.tabsPitchonType,
+          ChartPermissionId: this.industry,
+          ActivityTypeId: this.cactivityTypeVal,
+          MeetType: this.meetingTab,
+          IsResearch:this.isResearch
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.dataList = res.Data.List;
+          this.total = res.Data.Paging.Totals;
+        });
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getsDataList();
+    },
+    //手动匹配
+    matching(id) {
+      this.matchingId = id;
+      this.matchingDlgShow = true;
+    },
+    //到会详情
+    attendMeeting(item, text) {
+      if (item.SubmitMeetingType == 1 || item.YidongActivityId) {
+        this.offlineId = item.ActivityId;
+        this.particlaDlg = {
+          id: item.ActivityId,
+          title: text,
+          type: item.SubmitMeetingType,
+        };
+        this.dialogVisiblepartica = true;
+      } else {
+        this.goDetail(item.ActivityId);
+      }
+    },
+    //详情弹框
+    particulars(id) {
+      if(this.meetingTab == 1){
+        raiInterface
+        .appointmentList({
+          ActivityId: id,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.excelType = res.Data.ExcelType;
+          this.isLimitPeople = res.Data.IsLimitPeople;
+          this.totalDlg = res.Data.Total;
+          this.myTotalDlg = res.Data.MyTotal;
+          this.memberType = res.Data.MemberType;
+          this.isYidongConduct = res.Data.IsYidongConduct;
+          this.$nextTick(() => {
+            this.tableDataSub = res.Data.List;
+          });
+        });
+        this.dialogLeparticaShow = true;
+      }else if(this.meetingTab == 2){
+        this.particularsOffline(id,'报名详情')
+      }
+
+    },
+    particularsOffline(id,text){
+      this.offlineId = id;
+      this.particlaDlg = {
+        id,
+        title: text,
+      };
+      this.dialogVisiblepartica = true;
+    },
+    // meetingExport() {
+    //   const loading = this.$loading({
+    //     lock: true,
+    //     text: "客户参会详情文件下载中...",
+    //     spinner: "el-icon-loading",
+    //     background: "rgba(0, 0, 0, 0.7)",
+    //   });
+    //   const xhr = new XMLHttpRequest();
+    //   xhr.open("GET", this.exportUser, true);
+    //   xhr.responseType = "blob";
+    //   xhr.onload = function () {
+    //     if (this.status == 200) {
+    //       loading.close();
+    //       var blob = this.response;
+    //       var a = document.createElement("a");
+    //       var url = window.URL.createObjectURL(blob); //创建url对象
+    //       a.href = url;
+    //       a.download = "客户参会详情.xlsx";
+    //       a.click();
+    //       window.URL.revokeObjectURL(url); //释放url对象
+    //     } else {
+    //       this.$message.error("下载失败！");
+    //     }
+    //   };
+    //   xhr.send();
+    // },
+    //到会情况
+    // particularsSubmit(id) {
+    //   this.companyId = id;
+    //   $("#fileImport").click();
+    // },
+    //点击标题的弹框
+    titleBtnClick(id) {
+      raiInterface.activityDetail({ ActivityId: Number(id) }).then((res) => {
+        if (res.Ret == 200) {
+          this.detailData = res.Data;
+        }
+      });
+      this.dialogVisible = true;
+    },
+    //关闭弹框
+    confirmPerson() {
+      this.tableDataSub = [];
+      this.dialogLeparticaShow = false;
+    },
+    //到会情况
+    arriveHandel(id) {
+      this.offlineId = id;
+      this.submitDialog = true;
+    },
+    // 上传
+    // fileSelected(type) {
+    //   const that = this;
+    //   if (document.getElementById("fileImport").files[0]) {
+    //     let hostfile = document.getElementById("fileImport").files[0];
+    //     let size = Math.floor(hostfile.size / 1024 / 1024);
+    //     if (size > 200) {
+    //       that.$message.error("上传文件大小不能大于200M！");
+    //       hostfile = {};
+    //       return false;
+    //     }
+    //     if (hostfile.name.toLowerCase().includes(".xlsx")) {
+    //       let form = new FormData();
+    //       form.append("File", hostfile); //hostfile.name
+    //       form.append("ActivityId", that.companyId);
+
+    //       raiInterface.activityMeetImport(form).then((res) => {
+    //         if (res.Ret === 200) {
+    //           that.isShowImportDia = true;
+    //           that.importParams = form;
+    //           that.importData = res.Data || [];
+    //           this.$confirm("参会情况已提交成功，可点击【到会详情】查看", "提示", {
+    //             confirmButtonText: "知道了",
+    //             type: "warning",
+    //             showCancelButton: false,
+    //           });
+    //           this.getsDataList();
+    //         }
+    //         $("#fileImport").val("");
+    //         hostfile = {};
+    //       });
+    //     } else {
+    //       that.$message.error("请上传.xlsx的文件格式！");
+    //     }
+    //   }
+    // },
+    goDetail(id) {
+      let routerUrl = this.$router.resolve({
+        path: "attendMeeting",
+        query: {
+          id: id,
+        },
+      });
+      window.open(routerUrl.href, "_blank");
+    },
+    async popoverMouseenter(id) {
+      const res = await raiInterface.activityMeetHistoryList({
+        ActivityId: id,
+      });
+      if (res.Ret === 200) {
+        this.gridData = res.Data.List || [];
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-practical {
+  .top-card-box {
+    display: flex;
+    justify-content: space-between;
+  }
+  .screen-box {
+    display: flex;
+    justify-content: space-between;
+    .top-buttons{
+      display: flex;
+      align-items: flex-start;
+    }
+    .el-select {
+      margin-right: 25px;
+    }
+  }
+  .mx-datepicker {
+    width: 220px !important;
+    margin-right: 25px;
+  }
+  .custom-applydialog {
+    height: 820px;
+  }
+}
+</style>

src/views/rai_manage/activityManage/onLineManage.vue

@@ -0,0 +1,464 @@
+<template>
+  <!-- 实际到会管理页面 -->
+  <div class="container-practical">
+    <!-- 头部el-card -->
+    <el-card style="margin-bottom: 20px">
+      <div class="top-card-box">
+        <div class="tabs-box"></div>
+        <div>
+          <el-input v-model="keyWord" placeholder="请输入活动名称" style="width: 521px" clearable>
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+      </div>
+    </el-card>
+    <!-- 内容el-card -->
+    <el-card>
+      <!-- 选择部分 -->
+      <div class="screen-box">
+        <div>
+          <el-select placeholder="行业" clearable v-model="industry" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option
+              v-for="item in chartPermissionList"
+              :label="item.PermissionName"
+              :key="item.ChartPermissionId"
+              :value="item.ChartPermissionId"
+            ></el-option>
+          </el-select>
+          <el-select
+            placeholder="活动类型"
+            clearable
+            @focus="activityType"
+            v-model="cactivityTypeVal"
+            @change="conditionChange"
+            style="margin-bottom: 20px"
+          >
+            <el-option
+              v-for="item in cactivityTypeList"
+              :label="item.ActivityTypeName"
+              :key="item.ActivityTypeId"
+              :value="item.ActivityTypeId"
+            ></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="活动时间" value-type="format" @change="conditionChange"> </date-picker>
+        </div>
+        <div style="min-width: 340px">
+          <el-button type="primary" @click="searchCustomer = true">搜索流失客户</el-button>
+          <el-button style="margin-left: 20px" type="primary" @click="$router.push('/onLineAppointment')">查看客户爽约记录</el-button>
+        </div>
+      </div>
+      <!-- 表格部分 -->
+      <el-table :data="dataList" style="width: 100%; margin-top: 20px" border="">
+        <el-table-column min-width="400" align="center" label="活动名称">
+          <template slot-scope="scope">
+            <span class="editsty" @click="titleBtnClick(scope.row.ActivityId)"> {{ scope.row.ActivityName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="ChartPermissionName" align="center" label="行业"></el-table-column>
+        <el-table-column min-width="120" prop="ActivityTypeName" align="center" label="活动类型"></el-table-column>
+        <el-table-column min-width="219" prop="ActivityTimeText" align="center" label="活动时间"></el-table-column>
+        <el-table-column prop="" align="center" label="报名人数">
+          <template slot-scope="scope">
+            <span class="editsty" @click="particulars(scope.row.ActivityId)">{{ scope.row.SignupPeopleNum }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="105" prop="MeetPeopleNum" align="center" label="实际参会人数"></el-table-column>
+        <el-table-column min-width="105" prop="UpdateTime" align="center" label="数据更新时间"></el-table-column>
+        <el-table-column min-width="115" align="center" label="操作">
+          <template slot-scope="scope">
+            <input type="file" size="small" name="file" @change="fileSelected()" id="fileImport" class="true-file" style="display: none" />
+            <p class="editsty" v-if="scope.row.IsShowHandMovement" @click="matching(scope.row.ActivityId)">&nbsp;&nbsp;手动匹配</p>
+            <!-- <span class="editsty" v-if="scope.row.IsYidongConduct === 1" @click="particularsSubmit(scope.row.ActivityId)"
+              >{{ scope.row.IsSubmitMeeting === 0 ? "上传" : "修改" }}参会表格</span
+            > -->
+            <span class="editsty" v-if="scope.row.IsShowSubmitMeeting" @click="arriveHandel(scope.row.ActivityId)">&nbsp;&nbsp;提交到会情况</span>
+            <span class="editsty" v-if="scope.row.IsShowUpdateMeeting" @click="arriveHandel(scope.row.ActivityId)">&nbsp;&nbsp;修改到会情况</span>
+            <span class="editsty" v-if="scope.row.IsShowAttendanceDetails" @click="attendMeeting(scope.row, '到会详情')">&nbsp;&nbsp;到会详情</span>
+            <el-popover v-else-if="scope.row.IsSubmitMeeting == 1 && scope.row.OperationStyle == 2" width="500" trigger="hover" placement="right">
+              <p>到会详情浏览记录</p>
+              <el-table :data="gridData" style="width: 100%" border height="350">
+                <el-table-column align="center" property="RealName" label="浏览人"></el-table-column>
+                <el-table-column align="center" property="CreateTime" label="浏览时间"></el-table-column>
+                <el-table-column align="center" property="StopTime" label="停留时长">
+                  <template slot-scope="{ row }">
+                    {{ row.StopTime }}
+                    <span v-if="row.StopTime">s</span>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <p slot="reference" class="editsty" @mouseenter="popoverMouseenter(scope.row.ActivityId)" @click="goDetail(scope.row.ActivityId)">
+                &nbsp;&nbsp;到会详情
+              </p>
+            </el-popover>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="PageSize" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <!-- 详情弹框 -->
+    <atc-particulars :dialogVisible.sync="dialogVisible" :detailData.sync="detailData" />
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      :visible.sync="dialogLeparticaShow"
+      customClass="custom-applydialog"
+      :before-close="confirmPerson"
+    >
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.warntop" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">
+          {{ excelType == "Teleconference" && isLimitPeople == 1 ? "预约外呼详情" : "报名详情" }}
+        </span>
+      </div>
+      <div>
+        <p style="margin-bottom: 10px" v-if="isYiDongShow">
+          <template v-if="memberType == 'Admin'"> 共有{{ totalDlg }}人{{ excelType == "AppointmentCall" ? "预约外呼" : "报名" }} </template>
+          <template v-else-if="memberType == 'Sale'">
+            共有{{ totalDlg }}人{{ excelType == "AppointmentCall" ? "预约外呼" : "报名" }}，其中本人名下客户{{ myTotalDlg }}人
+          </template>
+          <template v-else>
+            共有{{ totalDlg }}人{{ excelType == "AppointmentCall" ? "预约外呼" : "报名" }}，其中本组名下客户{{ myTotalDlg }}人
+          </template>
+        </p>
+        <p style="margin-bottom: 10px" v-else>
+          <template v-if="memberType == 'Admin'"> 共有{{ totalDlg }}人报名</template>
+        </p>
+        <el-table max-height="260px" :data="tableDataSub" border style="width: 100%">
+          <el-table-column width="130" align="center" prop="RealName" key="name" label="姓名"></el-table-column>
+          <el-table-column width="150" align="center" prop="Mobile" key="mobile" label="手机号" v-if="isYiDongShow"></el-table-column>
+          <el-table-column
+            width="150"
+            align="center"
+            prop="OutboundMobile"
+            key="outboundMobile"
+            label="外呼号码"
+            v-if="isYiDongShow"
+          ></el-table-column>
+          <el-table-column align="center" prop="CompanyName" key="company" label="公司名称" v-if="isCClassNot"></el-table-column>
+          <el-table-column width="150" align="center" prop="SellerName" key="seller" label="所属销售"></el-table-column>
+          <el-table-column min-width="110" key="meeting" align="center" label="参会方式" v-if="isYiDongShow">
+            <template slot-scope="{ row }">
+              <span>
+                {{ row.SignupType == 1 ? "预约外呼" : row.SignupType == 2 ? "自主拨入" : row.SignupType == 4 ? "自主入会" : "" }}
+              </span>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmPerson">知道了</el-button>
+      </span>
+    </el-dialog>
+    <matching-dlg :matchingDlgShow.sync="matchingDlgShow" :matchingId="matchingId" />
+    <partical-dialog
+      :offlineId="offlineId"
+      :submitDialog.sync="submitDialog"
+      :dialogVisiblepartica.sync="dialogVisiblepartica"
+      :particlaDlg="particlaDlg"
+    />
+    <search-customer-dlg :searchCustomer.sync="searchCustomer" />
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+import AtcParticulars from "../components/atcParticulars.vue";
+import { Loading } from "element-ui";
+import MatchingDlg from "../components/matchingDlg.vue";
+import ParticalDialog from "../components/particalDialog.vue";
+import SearchCustomerDlg from "../components/apply/searchCustomerDlg.vue";
+
+export default {
+  name: "",
+  components: { mPage, AtcParticulars, MatchingDlg, ParticalDialog, SearchCustomerDlg },
+  props: {},
+  data() {
+    return {
+      dataList: [], //表格的列表
+      tableDataSub: [],
+      page_no: sessionStorage.getItem("interviewListBack") ? JSON.parse(sessionStorage.getItem("interviewListBack")).page_no : 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      keyWord: "",
+      industry: "", //行业
+      cactivityTypeVal: "", //活动
+      chartPermissionList: [], //行业的数组
+      cactivityTypeList: [], //活动类型
+      issueTime: "", //时间
+      tabsPitchonType: 1,
+      detailData: {}, //
+      dialogVisible: false,
+      dialogLeparticaShow: false,
+      companyId: "", //
+      excelType: "",
+      isLimitPeople: "",
+      totalDlg: 0,
+      myTotalDlg: 0,
+      memberType: "",
+      matchingDlgShow: false, //匹配弹框
+      matchingId: "",
+      gridData: [],
+      submitDialog: false, //
+      offlineId: "",
+      dialogVisiblepartica: false, //
+      searchCustomer: false, //搜索流失客户
+      isYidongConduct: 0,
+      particlaDlg: {
+        isSpecial: false,
+        id: "",
+        title: "",
+        type: "",
+      },
+    };
+  },
+  computed: {
+    exportUser() {
+      return process.env.API_ROOT + "/cygx/activityMeet/meetingExport?" + localStorage.getItem("auth") || "";
+    },
+    isYiDongShow() {
+      return this.isYidongConduct === 1 || this.excelType !== "CClass";
+    },
+    isCClassNot() {
+      return this.isYidongConduct != 1 && this.excelType == "CClass";
+    },
+  },
+  watch: {
+    keyWord() {
+      this.page_no = 1;
+      this.init();
+      this.getsDataList();
+    },
+  },
+  created() {},
+  mounted() {
+    this.chartPermission();
+    this.getsDataList();
+  },
+  methods: {
+    init() {
+      this.industry = ""; //行业
+      this.issueTime = ""; //时间
+      this.cactivityTypeVal = ""; //活动
+    },
+    //获取行业
+    chartPermission() {
+      raiInterface.chartPermission().then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    //活动类型
+    activityType() {
+      raiInterface
+        .activityTypeMeetType({
+          MeetType: 1,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.cactivityTypeList = res.Data.List;
+          }
+        });
+    },
+    //change事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getsDataList();
+    },
+    //列表表格
+    getsDataList() {
+      raiInterface
+        .activityMeetList({
+          CurrentIndex: this.page_no,
+          PageSize: this.PageSize,
+          StartDate: this.issueTime[0],
+          EndDate: this.issueTime[1],
+          KeyWord: this.keyWord,
+          SearchType: this.tabsPitchonType,
+          ChartPermissionId: this.industry,
+          ActivityTypeId: this.cactivityTypeVal,
+          MeetType: 1,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.dataList = res.Data.List;
+          this.total = res.Data.Paging.Totals;
+        });
+    },
+    //到会详情
+    attendMeeting(item, text) {
+      if (item.SubmitMeetingType == 1 || item.YidongActivityId) {
+        this.offlineId = item.ActivityId;
+        this.particlaDlg = {
+          id: item.ActivityId,
+          title: text,
+          type: item.SubmitMeetingType,
+        };
+        this.dialogVisiblepartica = true;
+      } else {
+        this.goDetail(item.ActivityId);
+      }
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getsDataList();
+    },
+    //详情弹框
+    particulars(id) {
+      raiInterface
+        .appointmentList({
+          ActivityId: id,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.excelType = res.Data.ExcelType;
+          this.isLimitPeople = res.Data.IsLimitPeople;
+          this.totalDlg = res.Data.Total;
+          this.myTotalDlg = res.Data.MyTotal;
+          this.memberType = res.Data.MemberType;
+          this.isYidongConduct = res.Data.IsYidongConduct;
+          this.$nextTick(() => {
+            this.tableDataSub = res.Data.List;
+          });
+        });
+      this.dialogLeparticaShow = true;
+    },
+    // meetingExport() {
+    //   const loading = this.$loading({
+    //     lock: true,
+    //     text: "客户参会详情文件下载中...",
+    //     spinner: "el-icon-loading",
+    //     background: "rgba(0, 0, 0, 0.7)",
+    //   });
+    //   const xhr = new XMLHttpRequest();
+    //   xhr.open("GET", this.exportUser, true);
+    //   xhr.responseType = "blob";
+    //   xhr.onload = function () {
+    //     if (this.status == 200) {
+    //       loading.close();
+    //       var blob = this.response;
+    //       var a = document.createElement("a");
+    //       var url = window.URL.createObjectURL(blob); //创建url对象
+    //       a.href = url;
+    //       a.download = "客户参会详情.xlsx";
+    //       a.click();
+    //       window.URL.revokeObjectURL(url); //释放url对象
+    //     } else {
+    //       this.$message.error("下载失败！");
+    //     }
+    //   };
+    //   xhr.send();
+    // },
+    //到会情况
+    particularsSubmit(id) {
+      this.companyId = id;
+      $("#fileImport").click();
+    },
+    //点击标题的弹框
+    titleBtnClick(id) {
+      raiInterface.activityDetail({ ActivityId: Number(id) }).then((res) => {
+        if (res.Ret == 200) {
+          this.detailData = res.Data;
+        }
+      });
+      this.dialogVisible = true;
+    },
+    //关闭弹框
+    confirmPerson() {
+      this.tableDataSub = [];
+      this.dialogLeparticaShow = false;
+    },
+    //到会情况
+    arriveHandel(id) {
+      this.offlineId = id;
+      this.submitDialog = true;
+    },
+    // 上传
+    fileSelected(type) {
+      const that = this;
+      if (document.getElementById("fileImport").files[0]) {
+        let hostfile = document.getElementById("fileImport").files[0];
+        let size = Math.floor(hostfile.size / 1024 / 1024);
+        if (size > 200) {
+          that.$message.error("上传文件大小不能大于200M！");
+          hostfile = {};
+          return false;
+        }
+        if (hostfile.name.toLowerCase().includes(".xlsx")) {
+          let form = new FormData();
+          form.append("File", hostfile); //hostfile.name
+          form.append("ActivityId", that.companyId);
+
+          raiInterface.activityMeetImport(form).then((res) => {
+            if (res.Ret === 200) {
+              that.isShowImportDia = true;
+              that.importParams = form;
+              that.importData = res.Data || [];
+              this.$confirm("参会情况已提交成功，可点击【到会详情】查看", "提示", {
+                confirmButtonText: "知道了",
+                type: "warning",
+                showCancelButton: false,
+              });
+              this.getsDataList();
+            }
+            $("#fileImport").val("");
+            hostfile = {};
+          });
+        } else {
+          that.$message.error("请上传.xlsx的文件格式！");
+        }
+      }
+    },
+    goDetail(id) {
+      let routerUrl = this.$router.resolve({
+        path: "attendMeeting",
+        query: {
+          id: id,
+        },
+      });
+      window.open(routerUrl.href, "_blank");
+    },
+    //手动匹配
+    matching(id) {
+      this.matchingId = id;
+      this.matchingDlgShow = true;
+    },
+    async popoverMouseenter(id) {
+      const res = await raiInterface.activityMeetHistoryList({
+        ActivityId: id,
+      });
+      if (res.Ret === 200) {
+        this.gridData = res.Data.List || [];
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-practical {
+  .top-card-box {
+    display: flex;
+    justify-content: space-between;
+  }
+  .screen-box {
+    display: flex;
+    justify-content: space-between;
+    .el-select {
+      margin-right: 25px;
+    }
+  }
+  .mx-datepicker {
+    width: 220px !important;
+    margin-right: 25px;
+  }
+  .custom-applydialog {
+    height: 820px;
+  }
+}
+</style>

src/views/rai_manage/activityManage/practicalMeeting.vue

@@ -0,0 +1,283 @@
+<template>
+  <!-- 实际到会管理页面 -->
+  <div class="container-practical">
+    <!-- 头部el-card -->
+    <el-card style="margin-bottom: 20px">
+      <div class="top-card-box">
+        <div class="tabs-box"></div>
+        <div>
+          <el-input v-model="keyWord" placeholder="请输入活动名称" style="width: 521px" clearable>
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+      </div>
+    </el-card>
+    <!-- 内容el-card -->
+    <el-card>
+      <!-- 选择部分 -->
+      <div class="screen-box">
+        <div>
+          <el-select placeholder="行业" clearable v-model="industry" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option
+              v-for="item in chartPermissionList"
+              :label="item.PermissionName"
+              :key="item.ChartPermissionId"
+              :value="item.ChartPermissionId"
+            ></el-option>
+          </el-select>
+          <el-select
+            placeholder="活动类型"
+            clearable
+            @focus="activityType"
+            v-model="cactivityTypeVal"
+            @change="conditionChange"
+            style="margin-bottom: 20px"
+          >
+            <el-option
+              v-for="item in cactivityTypeList"
+              :label="item.ActivityTypeName"
+              :key="item.ActivityTypeId"
+              :value="item.ActivityTypeId"
+            ></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="活动时间" value-type="format" @change="conditionChange"> </date-picker>
+        </div>
+        <div>
+          <!-- <a>
+               <el-button type="primary" @click="meetingExport">下载客户参会记录</el-button>
+          </a> -->
+          <el-button style="margin-left: 20px" type="primary" @click="$router.push('/appointment')">查看客户爽约记录</el-button>
+        </div>
+      </div>
+      <!-- 表格部分 -->
+      <el-table :data="dataList" style="width: 100%; margin-top: 20px" border="">
+        <el-table-column min-width="350" align="center" label="活动名称">
+          <template slot-scope="scope">
+            <span class="editsty" @click="titleBtnClick(scope.row.ActivityId)"> {{ scope.row.ActivityName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="ChartPermissionName" align="center" label="行业"></el-table-column>
+        <el-table-column min-width="120" prop="ActivityTypeName" align="center" label="活动类型"></el-table-column>
+        <el-table-column min-width="219" prop="ActivityTimeText" align="center" label="活动时间"></el-table-column>
+        <el-table-column prop="" align="center" label="报名人数">
+          <template slot-scope="scope">
+            <span class="editsty" @click="particulars(scope.row.ActivityId, '报名详情')">{{ scope.row.SignupPeopleNum }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="105" prop="MeetPeopleNum" align="center" label="实际参会人数"></el-table-column>
+        <el-table-column min-width="200" align="center" label="操作">
+          <template slot-scope="scope">
+            <span v-if="scope.row.OperationStyle == 1" class="editsty" @click="particularsSubmit(scope.row.ActivityId)"
+              >&nbsp;&nbsp;提交到会情况</span
+            >
+
+            <span class="editsty" v-if="scope.row.OperationStyle == 2" @click="particularsSubmit(scope.row.ActivityId)"
+              >&nbsp;&nbsp;修改到会情况</span
+            >
+
+            <span class="editsty" v-if="scope.row.OperationStyle == 2" @click="particulars(scope.row.ActivityId, '到会详情')"
+              >&nbsp;&nbsp;到会详情</span
+            >
+           
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+
+    <!-- 详情弹框 -->
+    <atc-particulars :dialogVisible.sync="dialogVisible" :detailData.sync="detailData" />
+    <partical-dialog
+      type="线下到会"
+      :offlineId="offlineId"
+      :dialogVisiblepartica.sync="dialogVisiblepartica"
+      :particlaDlg="particlaDlg"
+      :submitDialog.sync="submitDialog"
+    />
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+import AtcParticulars from "../components/atcParticulars.vue";
+import ParticalDialog from "../components/particalDialog.vue";
+export default {
+  name: "",
+  components: { mPage, ParticalDialog, AtcParticulars },
+  props: {},
+  data() {
+    return {
+      dataList: [], //表格的列表
+      page_no: sessionStorage.getItem("interviewListBack") ? JSON.parse(sessionStorage.getItem("interviewListBack")).page_no : 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      keyWord: "",
+      dialogVisiblepartica: false, //详情弹框
+      particlaDlg: {
+        isSpecial: false,
+        id: "",
+        title: "",
+      },
+      submitDialog: false,
+      industry: "", //行业
+      cactivityTypeVal: "", //活动
+      chartPermissionList: [], //行业的数组
+      cactivityTypeList: [], //活动类型
+      issueTime: "", //时间
+      tabsPitchonType: 1,
+      detailData: {}, //
+      dialogVisible: false,
+      offlineId: "",
+    };
+  },
+  computed: {
+    exportUser() {
+      return process.env.API_ROOT + "/cygx/activityMeet/meetingExport?" + localStorage.getItem("auth") || "";
+    },
+  },
+  watch: {
+    keyWord() {
+      this.page_no = 1;
+      this.init();
+      this.getsDataList();
+    },
+  },
+  created() {},
+  mounted() {
+    this.chartPermission();
+    this.getsDataList();
+  },
+  methods: {
+    init() {
+      this.industry = ""; //行业
+      this.issueTime = ""; //时间
+      this.cactivityTypeVal = ""; //活动
+    },
+    meetingExport() {
+      const loading = this.$loading({
+        lock: true,
+        text: "客户参会详情文件下载中...",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+      });
+      const xhr = new XMLHttpRequest();
+      xhr.open("GET", this.exportUser, true);
+      xhr.responseType = "blob";
+      xhr.onload = function () {
+        if (this.status == 200) {
+          loading.close();
+          //var _b = xhr.getResponseHeader('Content-Disposition');
+          //var _c = _b.split('filename=')[1];
+          //var _d = decodeURIComponent(_c.split('.')[0])+'.'+_c.split('.')[1];
+          var blob = this.response;
+          var a = document.createElement("a");
+          var url = window.URL.createObjectURL(blob); //创建url对象
+          a.href = url;
+          // a.download = _d;
+          a.download = "客户参会详情.xlsx";
+          a.click();
+          window.URL.revokeObjectURL(url); //释放url对象
+        } else {
+          this.$message.error("下载失败！");
+        }
+      };
+      xhr.send();
+    },
+    //获取行业
+    chartPermission() {
+      raiInterface.chartPermission().then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    //活动类型
+    activityType() {
+      raiInterface
+        .activityTypeMeetType({
+          MeetType: 2,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.cactivityTypeList = res.Data.List;
+          }
+        });
+    },
+    //change事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getsDataList();
+    },
+    //列表表格
+    getsDataList() {
+      raiInterface
+        .activityMeetList({
+          CurrentIndex: this.page_no,
+          PageSize: this.PageSize,
+          StartDate: this.issueTime[0],
+          EndDate: this.issueTime[1],
+          KeyWord: this.keyWord,
+          SearchType: this.tabsPitchonType,
+          ChartPermissionId: this.industry,
+          ActivityTypeId: this.cactivityTypeVal,
+          MeetType: 2,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.dataList = res.Data.List;
+          this.total = res.Data.Paging.Totals;
+        });
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getsDataList();
+    },
+    //详情弹框
+    particulars(id, text) {
+      this.offlineId = id;
+      this.particlaDlg = {
+        id: id,
+        title: text,
+      };
+      this.dialogVisiblepartica = true;
+    },
+    //到会情况
+    particularsSubmit(id) {
+      this.offlineId = id;
+      this.submitDialog = true;
+    },
+    //点击标题的弹框
+    titleBtnClick(id) {
+      raiInterface.activityDetail({ ActivityId: Number(id) }).then((res) => {
+        if (res.Ret == 200) {
+          this.detailData = res.Data;
+        }
+      });
+      this.dialogVisible = true;
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-practical {
+  .top-card-box {
+    display: flex;
+    justify-content: space-between;
+  }
+  .screen-box {
+    display: flex;
+    justify-content: space-between;
+    .el-select {
+      margin-right: 25px;
+    }
+  }
+  .mx-datepicker {
+    width: 220px !important;
+    margin-right: 25px;
+  }
+}
+</style>

src/views/rai_manage/activityManage/roadShow/components/addVideoDlg.vue

@@ -0,0 +1,462 @@
+<template>
+  <div class="container add-edit-video">
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      width="568px"
+      title="添加视频"
+      :visible.sync="addEditdialogVisib"
+      customClass="add-edit-video-dlg"
+      :before-close="cancelHandle"
+    >
+      <div>
+        <el-form :model="addEditVideo" :rules="rules" ref="ruleFormVideo" class="demo-ruleForm">
+          <el-form-item prop="audioName">
+            <div style="display: flex; justify-content: space-between">
+              <el-input style="width: 75%" clearable placeholder="请上传视频" v-model="addEditVideo.videoName"></el-input>
+              <el-upload action="" accept=".mp4" :http-request="handleUpload" :before-upload="handelBeforeUploadVideo" :show-file-list="false" :disabled="startUpload">
+                <el-button type="primary" :loading="startUpload">上传视频</el-button>
+              </el-upload>
+              <el-progress type="circle" :percentage="percentage" width="40" style="margin-left: 10px" v-if="startUpload"></el-progress>
+            </div>
+            <p style="color: #ff3737">注：视频格式支持mp4</p>
+          </el-form-item>
+          <el-form-item prop="industryId">
+            <el-select style="width: 100%" placeholder="请选择行业" v-model="addEditVideo.industryId" clearable @change="selectChangeHandle">
+              <el-option 
+              v-for="item in chartPermissionList.filter(item => item.PermissionName != '宏观' && item.PermissionName != '策略' && item.PermissionName != '研选订阅')" 
+                :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item prop="property">
+            <!-- <el-cascader
+              style="width: 100%"
+              @focus="industrySelectFocus"
+              placeholder="请选择产业"
+              v-model="addEditVideo.property"
+              :props="{ ...defaultProps }"
+              :options="selectedIndustryArr"
+              :key="addEditVideo.industryId"
+              filterable
+              clearable
+            ></el-cascader> -->
+            <el-select v-model="addEditVideo.property" placeholder="请选择产业" clearable filterable
+            style="width: 100%;" @focus="industrySelectFocus">
+              <el-option :label="item.PermissionName" :value="item.ChartPermissionId" 
+              v-for="item in selectedIndustryArr" :key="item.ChartPermissionId"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item prop="publishDate">
+            <el-date-picker
+              style="width: 100%"
+              v-model="addEditVideo.publishDate"
+              type="date"
+              placeholder="请选择发布时间"
+              format="yyyy 年 MM 月 dd 日"
+              value-format="yyyy-MM-dd"
+              @change="conditionChange"
+            >
+            </el-date-picker>
+          </el-form-item>
+          <div class="uploadImageContain">
+            <el-form-item prop="imgUrl">
+              <div class="imgUploadBox">
+                <el-upload action="" :http-request="(e)=>handleImageUpload(e,'imgUrl')"
+                :multiple="false" :show-file-list="false" v-if="!addEditVideo.imgUrl">
+                  <div class="image-upload-item">
+                    <img src="~@/assets/icons/uploadImg-blue.svg"/>
+                    <span>添加列表页封面</span>
+                  </div>
+                </el-upload>
+                <div v-else class="uploaded-image-item">
+                  <el-image :src="addEditVideo.imgUrl" 
+                  class="videoImage"
+                  :preview-src-list="[addEditVideo.imgUrl]"/>
+                  <span class="del-image" @click="addEditVideo.imgUrl=''">删除</span>
+                </div>   
+              </div>
+            </el-form-item>
+          
+            <el-form-item prop="detailImgUrl">
+              <div class="imgUploadBox">
+                <el-upload action="" :http-request="(e)=>handleImageUpload(e,'detailImgUrl')"
+                :multiple="false" :show-file-list="false" v-if="!addEditVideo.detailImgUrl" >
+                <div class="image-upload-item">
+                    <img src="~@/assets/icons/uploadImg-blue.svg"/>
+                    <span>添加详情页封面</span>
+                  </div>
+                </el-upload>
+                <div v-else class="uploaded-image-item">
+                  <el-image :src="addEditVideo.detailImgUrl" 
+                  class="videoImage"
+                  :preview-src-list="[addEditVideo.detailImgUrl]"/>
+                  <span class="del-image" @click="addEditVideo.detailImgUrl=''">删除</span>
+                </div>            
+              </div>
+            </el-form-item>
+            <el-form-item prop="shareImgUrl">
+              <div class="imgUploadBox">
+                <el-upload action="" :http-request="(e)=>handleImageUpload(e,'shareImgUrl')"
+                :multiple="false" :show-file-list="false" v-if="!addEditVideo.shareImgUrl" >
+                <div class="image-upload-item">
+                    <img src="~@/assets/icons/uploadImg-blue.svg"/>
+                    <span>添加视频分享图</span>
+                  </div>
+                </el-upload>
+                <div v-else class="uploaded-image-item">
+                  <el-image :src="addEditVideo.shareImgUrl" 
+                  class="videoImage"
+                  :preview-src-list="[addEditVideo.shareImgUrl]"/>
+                  <span class="del-image" @click="addEditVideo.shareImgUrl=''">删除</span>
+                </div>            
+              </div>
+            </el-form-item>
+          </div>
+        </el-form>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmSubmit(0)">保存</el-button>
+        <el-button type="primary" v-if="publishStatus != 1" @click="confirmSubmit(1)">发布</el-button>
+        <el-button @click="cancelHandle">取消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getOSSSign } from "@/api/api.js";
+import MD5 from "js-md5";
+import { raiInterface, raiVideoApi } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    addEditdialogVisib: {
+      type: Boolean,
+      default: false,
+    },
+    chartPermissionList: {
+      type: Array,
+      default: [],
+    },
+    playDetailsList: {
+      default: {},
+      type: Object,
+    },
+  },
+  data() {
+    return {
+      addEditVideo: {
+        videoName: "", //音频名称
+        industryId: "", //行业id
+        property: "", //产业名称
+        publishDate: "", //发布时间
+        videoUrl: "", //视频链接
+        VideoSeconds: "", //时长
+        imgUrl:"", // 视频封面
+        shareImgUrl:"", // 分享的视频封面
+        detailImgUrl:""// 详情的视频封面
+      },
+      rules: {
+        videoName: [{ required: true, message: "请上传视频", trigger: "blur" }],
+        industryId: [{ required: true, message: "请选择行业", trigger: "change" }],
+        property: { required: true, message: "请选择产业", trigger: "change" },
+        publishDate: [{ required: true, message: "请选择发布时间", trigger: "change" }],
+        imgUrl:{ required: true, message: "请选择列表页封面", trigger: "change" },
+        shareImgUrl:{ required: true, message: "请选择视频分享图", trigger: "change" },
+        detailImgUrl:{ required: true, message: "请选择详情页封面", trigger: "change" }
+      },
+      videoId: 0,
+      publishStatus: 0,
+      industryArr: [],
+      selectedIndustryArr:[],
+      defaultProps: {
+        label: "PermissionName",
+        children: "List",
+        value: "ChartPermissionId",
+      },
+      percentage: 0,
+      startUpload: false, //开始上传
+    };
+  },
+  computed: {},
+  watch: {
+    playDetailsList: {
+      async handler(newval) {
+        if (JSON.stringify(newval) != "{}") {
+          await this.getIndustry(newval.ChartPermissionId);
+          console.log(newval);
+          this.addEditVideo = {
+            videoName: newval.VideoName, //音频名称
+            industryId: newval.ChartPermissionId, //行业id
+            property: newval.IndustryId || "", //产业名称
+            publishDate: newval.PublishDate, //发布时间
+            videoUrl: newval.VideoUrl, //视频链接
+            VideoSeconds: newval.VideoDuration, //时长
+            imgUrl:newval.ImgUrl, // 视频封面
+            shareImgUrl:newval.ShareImgUrl, // 分享的视频封面
+            detailImgUrl:newval.DetailImgUrl
+          };
+          this.videoId = newval.VideoId;
+          this.publishStatus = newval.PublishStatus;
+        } else {
+          this.videoId = 0;
+          this.selectedIndustryArr=[]
+          this.publishStatus = 0;
+        }
+      },
+      deep: true,
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    /* 获取全部的行业 前的判断 */
+    industrySelectFocus() {
+      if (!this.addEditVideo.industryId) {
+        this.$message.error("请先选择行业");
+      }
+    },
+    // 行业更改
+    selectChangeHandle(value){
+      this.addEditVideo.property=""
+      value?this.getIndustry(value):this.selectedIndustryArr =[]
+    },
+    /* 获取选择的行业 */
+    getIndustry(industryId) {
+      if (this.industryArr.length){
+        this.selectedIndustryArr = this.industryArr.filter(item => item.ChartPermissionId == industryId)[0].List
+        return;
+      } 
+      raiInterface.getListIndustrial().then((res) => {
+        if (res.Ret === 200) {
+          this.industryArr = res.Data.List || [];
+          this.selectedIndustryArr = this.industryArr.filter(item => item.ChartPermissionId == industryId)[0].List
+          // if (this.addEditVideo.property) {
+            // let valId = "";
+            // this.industryArr.forEach((item) => {
+            //   if (item.List.some((key) => key.ChartPermissionId == this.addEditVideo.property)) {
+            //     valId = item.ChartPermissionId;
+            //   }
+            // });
+          //   this.addEditVideo.property = [industryId, this.addEditVideo.property];
+          // }
+        }
+      });
+    },
+    //获取视频时长的promise
+    handleGetDuration(file) {
+      return new Promise((resolve, reject) => {
+        const fileUrl = URL.createObjectURL(file);
+        const audioEl = new Audio(fileUrl);
+        audioEl.addEventListener("loadedmetadata", (e) => {
+          resolve(audioEl.duration);
+        });
+      });
+    },
+
+    //上传视频判断格式
+    handelBeforeUploadVideo(e) {
+      if (e.type != "video/mp4") {
+        this.$message.warning("上传失败，上传视频格式不正确");
+        return false;
+      }
+    },
+
+    // 上传视频
+    async handleUpload(e) {
+      const duration = await this.handleGetDuration(e.file);
+      // 取消视频的大小校验 -- 查研观向 8.4
+      // if (duration > 600) {
+      //   this.$message.warning("视频时长不得超过10分钟");
+      //   return;
+      // }
+      console.log(e, duration);
+      this.addEditVideo.videoName = e.file.name;
+      this.addEditVideo.VideoSeconds = duration + ""; //时常
+      const res = await getOSSSign();
+      if (res.Ret === 200) {
+        let accessKeyId = res.Data.AccessKeyId;
+        let accessKeySecret = res.Data.AccessKeySecret;
+        let stsToken = res.Data.SecurityToken;
+        this.handleUploadToOSS(e.file, accessKeyId, accessKeySecret, stsToken);
+      }
+    },
+    //上传到阿里云
+    async handleUploadToOSS(file, accessKeyId, accessKeySecret, stsToken) {
+      this.startUpload = true;
+      const ALOSSINS = new OSS({
+        // yourRegion填写Bucket所在地域。以华东1（杭州）为例，Region填写为oss-cn-hangzhou。
+        region: "oss-cn-shanghai",
+        // 从STS服务获取的临时访问密钥（AccessKey ID和AccessKey Secret）。
+        accessKeyId: accessKeyId,
+        accessKeySecret: accessKeySecret,
+        // 从STS服务获取的安全令牌（SecurityToken）。
+        stsToken: stsToken,
+        // 填写Bucket名称，例如examplebucket。
+        bucket: "hzchart",
+        endpoint: "hzstatic.hzinsights.com",
+        cname: true,
+        timeout: 600000,
+      });
+      // 生成文件名
+      const t = new Date().getTime().toString();
+      const temName = `static/yb/video/${MD5(t)}.${file.name.split(".")[1]}`;
+      console.log(temName);
+
+      const options = {
+        // 获取分片上传进度、断点和返回值。
+        progress: (p, cpt, res) => {
+          console.log(p);
+          this.percentage = parseInt(p * 100);
+        },
+        // 设置并发上传的分片数量。
+        parallel: 10,
+        // 设置分片大小。默认值为1 MB，最小值为100 KB。
+        partSize: 1024 * 1024 * 10, // 10MB
+      };
+      try {
+        const res = await ALOSSINS.multipartUpload(temName, file, { ...options });
+        console.log("上传结果", res);
+        if (res.res.status === 200) {
+          this.addEditVideo.videoUrl = "https://hzstatic.hzinsights.com/" + res.name;
+          this.startUpload = false;
+          this.percentage = 0;
+        }
+      } catch (error) {
+        this.$message.warning("上传失败，请刷新重试");
+        this.startUpload = false;
+        this.percentage = 0;
+      }
+    },
+    //保存或发布
+    confirmSubmit(type) {
+      this.$refs.ruleFormVideo.validate(async (valid) => {
+        if (valid) {
+          const res = await raiVideoApi.addVideo({
+            VideoName: this.addEditVideo.videoName,
+            ChartPermissionId: this.addEditVideo.industryId,
+            IndustryId: this.addEditVideo.property || 0,
+            VideoUrl: this.addEditVideo.videoUrl,
+            VideoDuration: this.addEditVideo.VideoSeconds,
+            PublishDate: this.addEditVideo.publishDate,
+            PublishOrSave: type==1?type:this.publishStatus,
+            VideoId: this.videoId,
+            ImgUrl:this.addEditVideo.imgUrl,
+            ShareImgUrl:this.addEditVideo.shareImgUrl,
+            DetailImgUrl:this.addEditVideo.detailImgUrl
+          });
+          if (res.Ret === 200) {
+            this.$message.success("添加成功");
+            this.cancelHandle();
+            this.$parent.getVideoList();
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    // ------------------图片上传
+    handleImageUpload(e,type){
+      let formData = new FormData()
+      formData.append("file", e.file)
+      raiInterface.upload(formData).then(res=>{
+        if(type=='imgUrl'){
+          this.addEditVideo.imgUrl = res.Data.ResourceUrl
+        }else if(type=='shareImgUrl'){
+          this.addEditVideo.shareImgUrl = res.Data.ResourceUrl
+        }else{
+          this.addEditVideo.detailImgUrl = res.Data.ResourceUrl
+        }
+        // 触发表单验证
+        this.$refs.ruleFormVideo.validateField(type)
+      })  
+    },
+    //详情进来编辑
+    async editVideo() {
+      const res = await raiVideoApi.editVideo({});
+    },
+    cancelHandle() {
+      this.$refs.ruleFormVideo.resetFields();
+      this.addEditVideo = {
+        videoName: "", //音频名称
+        industryId: "", //行业id
+        property: "", //产业名称
+        publishDate: "", //发布时间
+        videoUrl: "", //视频链接
+        VideoSeconds: "", //时长
+        imgUrl:"", // 视频封面
+        shareImgUrl:"", // 分享的视频封面
+        detailImgUrl:""
+      };
+      this.$emit("update:addEditdialogVisib", false);
+      this.$emit("update:playDetailsList", {});
+    },
+  },
+};
+</script>
+<style lang="scss">
+.add-edit-video {
+  .add-edit-video-dlg {
+    .el-input {
+      width: 100%;
+    }
+  }
+}
+</style>
+<style lang="scss" scoped>
+.uploadImageContain{
+  display: flex;
+  justify-content: space-between;
+  .imgUploadBox{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 110px;
+    height: 110px;
+    .image-upload-item{
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      img{
+        height: 32px;
+      }
+      span{
+        color: #409eff;
+        font-weight: 400;
+        font-size: 14px;
+      }
+    }
+    .uploaded-image-item{
+      height: 110px;
+      width: 110px;
+      display: flex;
+      justify-content: center;
+      .videoImage{
+        border-radius: 1px;
+      }
+      .del-image{
+        display: none;
+        color: #fff;
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        text-align: center;
+        line-height: 24px;
+        width: 110px;
+        background-color: rgba($color: #000000, $alpha: 0.8);
+        cursor: pointer;
+      }
+      &:hover{
+        .del-image{
+          display: block;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/roadShow/components/playDetailsDlg.vue

@@ -0,0 +1,131 @@
+<template>
+  <div class="container paly-details-dlg">
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="播放详情" :visible.sync="playDetailsVisible" width="1242px" :before-close="cancelHandle">
+      <el-table :data="dataList" style="width: 100%" border height="400">
+        <template v-for="item in tableColums">
+          <el-table-column :key="item.label" :label="item.label" :width="item.widthsty" :min-width="item.minwidthsty" align="center" v-if="tabActive == 4 && item.key != 'PlaySeconds'">
+            <template slot-scope="{ row }">
+              <span>{{ handleRowContent(row, item.key) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column :key="item.label" :label="item.label" :width="item.widthsty" :min-width="item.minwidthsty" align="center" v-else-if="tabActive != 4">
+            <template slot-scope="{ row }">
+              <span>{{ handleRowContent(row, item.key) }}</span>
+            </template>
+          </el-table-column>
+        </template>
+      </el-table>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { PalyTable } from "../tableTabs";
+import { raiVideoApi } from "@/api/api.js";
+
+export default {
+  name: "",
+  components: {},
+  props: {
+    playDetailsVisible: {
+      default: false,
+      required: true,
+      type: Boolean,
+    },
+    playDetailsList: {
+      default: {},
+      required: true,
+      type: Object,
+    },
+    tabActive: {
+      required: true,
+      type: Number,
+    },
+  },
+  data() {
+    return {
+      dataList: [],
+    };
+  },
+  computed: {
+    tableColums() {
+      return PalyTable;
+    },
+  },
+  watch: {
+    "playDetailsList.VideoId": {
+      handler(newval) {
+        if (newval) {
+          this.tabActive == 4 && this.getVideoDeatil();
+        }
+      },
+    },
+    "playDetailsList.FileName": {
+      handler(newval) {
+        if (newval) {
+          newval == "视频" && this.activityVideoDeatil();
+          newval == "音频" && this.getVoiceDeatil();
+        }
+      },
+    },
+    "playDetailsList.AskserieVideoId": {
+      handler(newval) {
+        if (newval) {
+          this.askserieVideoHistoryList();
+        }
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    cancelHandle() {
+      this.$emit("update:playDetailsVisible", false);
+      this.$emit("update:playDetailsList", {});
+      this.dataList = [];
+    },
+    async getVideoDeatil() {
+      const res = await raiVideoApi.videoDeatil({ VideoId: this.playDetailsList.VideoId });
+      if (res.Ret === 200) {
+        this.dataList = res.Data || [];
+      }
+    },
+    async getVoiceDeatil() {
+      const res = await raiVideoApi.voiceDeatil({ VideoId: this.playDetailsList.VideoId });
+      if (res.Ret === 200) {
+        this.dataList = res.Data || [];
+      }
+    },
+    async activityVideoDeatil() {
+      const res = await raiVideoApi.activityVideoDeatil({ VideoId: this.playDetailsList.VideoId });
+      if (res.Ret === 200) {
+        this.dataList = res.Data || [];
+      }
+    },
+    async askserieVideoHistoryList() {
+      const res = await raiVideoApi.askserie_videoHistory_list({ AskserieVideoId: this.playDetailsList.AskserieVideoId });
+      if (res.Ret === 200) {
+        this.dataList = res.Data.List || [];
+      }
+    },
+    handleRowContent(row, key) {
+      if (key == "PlaySeconds") {
+        if (!row[key] || row[key] == 0) return '--';
+        let m = parseInt(row[key] / 60);
+        let s = parseInt(row[key] % 60);
+        let ms = `${m > 9 ? m : "0" + m}分${s > 9 ? s : "0" + s}秒`;
+        return ms;
+      } else {
+        return row[key];
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.paly-details-dlg {
+  .el-table {
+    margin-bottom: 30px;
+  }
+}
+</style>

src/views/rai_manage/activityManage/roadShow/components/releaseAudio.vue

@@ -0,0 +1,297 @@
+<template>
+  <div class="container add-edit-release-audio">
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      width="568px"
+      :title="dlgTitle"
+      :visible.sync="addEditdialogReleaseAudio"
+      customClass="add-edit-video-dlg"
+      :before-close="cancelHandle"
+    >
+      <div>
+        <el-form :model="addEditAudio" :rules="rules" ref="ruleFormAudio" class="demo-ruleForm">
+          <el-form-item prop="audioName">
+            <div style="display: flex; justify-content: space-between">
+              <el-input style="width: 75%" clearable placeholder="请上传音频" v-model="addEditAudio.audioName"></el-input>
+              <el-upload class="upload-demo" action="" :show-file-list="false" :http-request="handleUploadAudio" accept="audio/*" :file-list="fileListAudio">
+                <el-button type="primary" :loading="startUpload">上传音频</el-button>
+              </el-upload>
+              <el-progress type="circle" :percentage="percentage" width="40" style="margin-left: 10px" v-if="startUpload"></el-progress>
+            </div>
+          </el-form-item>
+          <el-form-item prop="industryId">
+            <el-select style="width: 100%" placeholder="请选择行业" v-model="addEditAudio.industryId" clearable @change="selectChangeHandle">
+              <el-option
+                v-for="item in chartPermissionList.filter((item) => item.PermissionName != '宏观' && item.PermissionName != '策略' && item.PermissionName != '研选订阅')"
+                :label="item.PermissionName"
+                :key="item.ChartPermissionId"
+                :value="item.ChartPermissionId"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-select v-model="addEditAudio.property" multiple placeholder="请选择产业（可多选）" clearable filterable style="width: 100%" @focus="industrySelectFocus">
+              <el-option :label="item.PermissionName" :value="item.ChartPermissionId" v-for="item in selectedIndustryArr" :key="item.ChartPermissionId"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="cover-content" style="margin: 10px 0" v-if="this.addEditAudio.industryId && defaultImage">
+        <span class="text" style="width: 46px; text-align: right">封面：</span>
+        <div class="img-content">
+          <img :src="defaultImage" alt="" />
+          <div class="modify" @click="modifyImgHandler">修改</div>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmSubmit(1)">确定</el-button>
+        <el-button @click="cancelHandle">取消</el-button>
+      </span>
+    </el-dialog>
+    <modify-img-dlg :modifyImgVisible.sync="modifyImgVisible" :videoAndVoiceList.sync="videoAndVoiceList" />
+  </div>
+</template>
+
+<script>
+import { raiInterface, resourceVoiceupload, raiVideoApi } from "@/api/api.js";
+import ModifyImgDlg from "../../components/addComopnents/modifyImgDlg.vue";
+export default {
+  name: "",
+  components: { ModifyImgDlg },
+  props: {
+    addEditdialogReleaseAudio: {
+      type: Boolean,
+      default: false,
+    },
+    chartPermissionList: {
+      type: Array,
+      default: [],
+    },
+    playDetailsList: {
+      default: {},
+      type: Object,
+    },
+  },
+  watch: {
+    "playDetailsList.AskserieVideoId": {
+      handler(newVal) {
+        newVal && newVal > 0 && this.askserieVideoDetail();
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  data() {
+    return {
+      addEditAudio: {
+        audioName: "", //音频名称
+        industryId: "", //行业id
+        property: "", //产业名称
+        audioUrl: "", //视频链接
+        AudioSeconds: "", //时长
+      },
+      rules: {
+        // audioName: [{ required: true, message: "请上传音频", trigger: "blur" }],
+        industryId: [{ required: true, message: "请选择行业", trigger: "change" }],
+      },
+      industryArr: [],
+      selectedIndustryArr: [],
+      percentage: 0,
+      startUpload: false, //开始上传
+      fileListAudio: [],
+      videoAndVoiceList: [],
+      defaultImage: [],
+      modifyImgVisible: false,
+      defaultImage: "",
+      shareImg: "",
+      dlgTitle: "发布问答",
+    };
+  },
+  computed: {},
+  created() {},
+  mounted() {},
+  methods: {
+    /* 获取全部的行业 前的判断 */
+    industrySelectFocus() {
+      if (!this.addEditAudio.industryId) {
+        this.$message.error("请先选择行业");
+      }
+    },
+    // 行业更改
+    selectChangeHandle(value) {
+      this.addEditAudio.property = "";
+      value ? this.getIndustry(value) : (this.selectedIndustryArr = []);
+      value && this.getVideoAndImg();
+    },
+    /* 获取选择的行业 */
+    getIndustry(industryId) {
+      if (this.industryArr.length) {
+        this.selectedIndustryArr = this.industryArr.filter((item) => item.ChartPermissionId == industryId)[0].List;
+        return;
+      }
+      raiInterface.getListIndustrial().then((res) => {
+        if (res.Ret === 200) {
+          this.industryArr = res.Data.List || [];
+          this.selectedIndustryArr = this.industryArr.filter((item) => item.ChartPermissionId == industryId)[0].List;
+        }
+      });
+    },
+    //保存或发布
+    confirmSubmit(type) {
+      this.$refs.ruleFormAudio.validate(async (valid) => {
+        if (valid) {
+          if (!this.fileListAudio[0].url) return this.$message.error("请上传音频");
+          if (!this.addEditAudio.audioName) return this.$message.error("请输入音频名称");
+          let ChartPermissionName = "";
+          this.chartPermissionList.forEach((item) => {
+            if (item.ChartPermissionId == this.addEditAudio.industryId) {
+              ChartPermissionName = item.PermissionName;
+            }
+          });
+          const res = await raiVideoApi.askseriePreserveAndEdit({
+            AskserieVideoId: this.playDetailsList.AskserieVideoId ? this.playDetailsList.AskserieVideoId : 0,
+            VideoName: this.addEditAudio.audioName,
+            ChartPermissionId: this.addEditAudio.industryId,
+            ChartPermissionName,
+            IndustrialManagementIds: this.addEditAudio.property ? this.addEditAudio.property.join(",") : "",
+            VideoUrl: this.addEditAudio.audioUrl,
+            VideoDuration: this.addEditAudio.AudioSeconds + "",
+            BackgroundImg: this.defaultImage,
+            ShareImg: this.shareImg,
+          });
+          if (res.Ret === 200) {
+            this.$message.success("添加成功");
+            this.cancelHandle();
+            this.$parent.getVideoList();
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    // 上传音频
+    async handleUploadAudio(e) {
+      this.startUpload = true;
+      let form = new FormData();
+      form.append("file", e.file);
+      const res = await resourceVoiceupload(form);
+      if (res.Ret === 200) {
+        let obj = {
+          name: res.Data.ResourceName,
+          url: res.Data.ResourceUrl,
+          PlaySeconds: res.Data.PlaySeconds,
+        };
+        this.addEditAudio.audioName = res.Data.ResourceName; //音频名称
+        this.addEditAudio.audioUrl = res.Data.ResourceUrl; //视频链接
+        this.addEditAudio.AudioSeconds = res.Data.PlaySeconds; //时长
+        this.fileListAudio = [obj];
+      }
+      this.startUpload = false;
+    },
+    // 封面图
+    async getVideoAndImg(isOne = "") {
+      const res = await raiInterface.video_and_voiceImgActivityVideo({
+        ChartPermissionId: this.addEditAudio.industryId,
+      });
+      if (res.Ret === 200) {
+        isOne == "修改" ? "" : ((this.defaultImage = res.Data.List[0].ImgUrl), (this.shareImg = res.Data.List[0].ShareImg));
+        this.videoAndVoiceList = res.Data.List;
+      }
+    },
+    // 点击修改图片的弹框
+    modifyImgHandler() {
+      this.getVideoAndImg("修改");
+      this.modifyImgVisible = true;
+    },
+    cancelHandle() {
+      this.$refs.ruleFormAudio.resetFields();
+      this.addEditAudio = {
+        audioName: "", //音频名称
+        industryId: "", //行业id
+        property: "", //产业名称
+        audioUrl: "", //视频链接
+        AudioSeconds: "", //时长
+      };
+      this.fileListAudio = [];
+      this.defaultImage = "";
+      this.shareImg = "";
+      this.dlgTitle = "发布问答";
+      this.$emit("update:addEditdialogReleaseAudio", false);
+      this.$emit("update:playDetailsList", {});
+    },
+    // 获取详情
+    async askserieVideoDetail() {
+      const res = await raiVideoApi.askserieVideoDetail({
+        AskserieVideoId: this.playDetailsList.AskserieVideoId,
+      });
+      if (res.Ret === 200) {
+        this.dlgTitle = "编辑";
+        let { Detail } = res.Data;
+        this.getIndustry(Detail.ChartPermissionId);
+        let str = [];
+        Detail.ListIndustrial &&
+          Detail.ListIndustrial.forEach((item) => {
+            str.push(item.IndustrialManagementId);
+          });
+        this.addEditAudio = {
+          audioName: Detail.VideoName, //音频名称
+          industryId: Detail.ChartPermissionId, //行业id
+          property: str, //产业名称
+          audioUrl: Detail.VideoUrl, //视频链接
+          AudioSeconds: Detail.VideoDuration, //时长
+        };
+        this.defaultImage = Detail.BackgroundImg;
+        this.shareImg = Detail.ShareImg;
+        let obj = {
+          name: Detail.VideoName,
+          url: Detail.VideoUrl,
+          PlaySeconds: Detail.VideoDuration,
+        };
+        this.fileListAudio = [obj];
+      }
+    },
+  },
+};
+</script>
+<style lang="scss">
+.add-edit-release-audio {
+  .add-edit-video-dlg {
+    .el-input {
+      width: 100%;
+    }
+  }
+}
+</style>
+<style lang="scss" scoped>
+.add-edit-release-audio {
+  display: flex;
+  justify-content: space-between;
+  .cover-content {
+    display: flex;
+    // align-items: stretch;
+    // vertical-align: bottom;
+    .img-content {
+      position: relative;
+      height: 200px;
+      width: 200px;
+      border: 1px solid #ccc;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    .modify {
+      position: absolute;
+      bottom: 0;
+      right: -50px;
+      height: 20px;
+      cursor: pointer;
+      color: #409eff;
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/roadShow/tableTabs.js

@@ -0,0 +1,181 @@
+//表格列
+export const tableColums = (type) => {
+  return type === 1 || type === 2
+    ? [
+        {
+          label: "文件名称",
+          key: "VideoName",
+          widthsty: 300,
+        },
+        {
+          label: "文件类型",
+          key: "FileName",
+          widthsty: 90,
+        },
+        {
+          label: "行业",
+          key: "ChartPermissionName",
+          widthsty: 90,
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypeName",
+          minwidthsty: "110",
+        },
+        {
+          label: "活动标签",
+          key: "Label",
+          minwidthsty: "120",
+        },
+        {
+          label: "活动时间",
+          key: "ActivityTimeText",
+          minwidthsty: "200",
+        },
+        {
+          label: "时长",
+          key: "VideoDuration",
+          widthsty: 100,
+        },
+        {
+          label: "播放量",
+          key: "VideoCounts",
+          widthsty: 100,
+        },
+        {
+          label: "留言",
+          key: "CommentNum",
+          widthsty: 100,
+        },
+      ]
+    : type === 3
+    ? [
+        {
+          label: "文件名称",
+          key: "VideoName",
+          widthsty: 300,
+        },
+        {
+          label: "行业",
+          key: "ChartPermissionName",
+          widthsty: 90,
+        },
+        {
+          label: "产业",
+          key: "IndustryName",
+        },
+        {
+          label: "发布状态",
+          key: "PublishStatus",
+          widthsty: 90,
+        },
+        {
+          label: "发布时间",
+          key: "PublishDate",
+          widthsty: 160,
+        },
+        {
+          label: "更新时间",
+          key: "ModifyDate",
+          widthsty: 160,
+        },
+        {
+          label: "时长",
+          key: "VideoDuration",
+          widthsty: 100,
+        },
+        {
+          label: "播放量",
+          key: "VideoCounts",
+          widthsty: 100,
+        },
+        {
+          label: "留言",
+          key: "CommentNum",
+          widthsty: 100,
+        },
+      ]
+    : [
+        {
+          label: "文件名称",
+          key: "VideoName",
+          widthsty: 300,
+        },
+        {
+          label: "行业",
+          key: "ChartPermissionName",
+          widthsty: 90,
+        },
+        {
+          label: "产业",
+          key: "IndustryName",
+        },
+        {
+          label: "发布状态",
+          key: "PublishStatus",
+          widthsty: 90,
+        },
+        {
+          label: "发布时间",
+          key: "PublishDate",
+          widthsty: 160,
+        },
+        {
+          label: "更新时间",
+          key: "ModifyDate",
+          widthsty: 160,
+        },
+        {
+          label: "时长",
+          key: "VideoDuration",
+          widthsty: 100,
+        },
+        {
+          label: "播放量",
+          key: "VideoCounts",
+          widthsty: 100,
+        },
+        {
+          label: "留言",
+          key: "CommentNum",
+          widthsty: 100,
+        },
+      ];
+};
+//表格列
+export const PalyTable = [
+  {
+    label: "姓名",
+    key: "RealName",
+  },
+  {
+    label: "手机号",
+    key: "Mobile",
+  },
+  {
+    label: "公司名称",
+    key: "CompanyName",
+  },
+  {
+    label: "所属销售",
+    key: "SellerName",
+  },
+  {
+    label: "播放时间",
+    key: "CreateTime",
+  },
+  {
+    label: "播放时长",
+    key: "PlaySeconds",
+  },
+  {
+    label: "播放来源",
+    key: "RegisterPlatform",
+  },
+];
+export const TopTabs = [
+  { name: "路演回放", value: 1 },
+  { name: "调研反馈", value: 2 },
+  { name: "问答系列", value: 3 },
+  { name: "产业视频", value: 4 },
+];

src/views/rai_manage/activityManage/roadShowList.vue

@@ -0,0 +1,392 @@
+<template>
+  <div class="container container-road-show">
+    <div class="top-wrap">
+      <div style="display: flex">
+        <span @click="topTabsHandler(item)" :class="['item', tabActive === item.value && 'active']" v-for="item in topTabs" :key="item.value">{{ item.name }}</span>
+      </div>
+      <el-input v-model="fileName" @input="fileNameHandle" placeholder="请输入文件名称" clearable style="display: inline-block; width: 350px">
+        <i slot="prefix" class="el-input__icon el-icon-search"></i>
+      </el-input>
+    </div>
+
+    <!-- // 筛选 表格 -->
+    <el-card style="margin-top: 20px">
+      <div class="select-content">
+        <div>
+          <el-select style="margin-bottom: 20px" placeholder="行业" v-model="chartPermissionId" clearable @change="selectChangeHandle">
+            <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+          </el-select>
+          <el-select v-if="tabActive == 1 || tabActive == 2" placeholder="活动类型" clearable v-model="cactivityTypeVal" @change="selectChangeHandle">
+            <el-option v-for="item in cactivityTypeList" :label="item.ActivityTypeName" :key="item.ActivityTypeId" :value="item.ActivityTypeId"></el-option>
+          </el-select>
+          <date-picker
+            style="margin-bottom: 20px"
+            v-model="issueTime"
+            type="date"
+            range
+            :placeholder="tabActive == 4 || tabActive == 3 ? '发布时间' : '活动时间'"
+            value-type="format"
+            @change="selectChangeHandle"
+          >
+          </date-picker>
+          <el-select v-if="tabActive == 4 || tabActive == 3" placeholder="发布状态" clearable v-model="publishStatus" @change="selectChangeHandle" style="margin-bottom: 20px">
+            <el-option v-for="item in publishSelect" :label="item.name" :key="item.value" :value="item.value"></el-option>
+          </el-select>
+        </div>
+        <div>
+          <el-button type="primary" v-if="tabActive === 4" @click="addEditdialogVisib = true">添加视频</el-button>
+          <el-button type="primary" v-if="tabActive === 3" @click="addEditdialogReleaseAudio = true">发布问答</el-button>
+        </div>
+      </div>
+      <el-table :data="dataList" style="width: 100%" border @sort-change="sortChangeHandle">
+        <el-table-column
+          v-for="item in tableColums"
+          :key="item.label"
+          :label="item.label"
+          :width="item.widthsty"
+          :min-width="item.minwidthsty"
+          align="center"
+          :sortable="item.key === 'VideoCounts' || item.key === 'VoiceCounts' ? 'custom' : false"
+        >
+          <template slot-scope="{ row }">
+            <span @click="handleRowClick(row, item.key)" :style="handleRowStyle(item.key)">{{ handleRowContent(row, item.key) }}</span>
+          </template></el-table-column
+        >
+        <el-table-column align="center" prop="LastUpdatedTime" width="170" label="操作">
+          <template slot-scope="{ row }">
+            <div v-if="tabActive === 4 || tabActive === 3">
+              <span class="editsty" @click="handlePublish(row)">{{ row.PublishStatus == 1 ? "取消发布" : "发布" }}</span>
+              &nbsp;&nbsp;
+              <span class="editsty" @click="handleEditVideo(row, '产业')">编辑</span>
+            </div>
+            <template v-else>
+              <span class="editsty" @click="titleBtnClick(row.ActivityId)">活动详情</span>
+              <span class="editsty" @click="handleEditVideo(row, '活动')">&nbsp;&nbsp;&nbsp;&nbsp;编辑活动</span>
+            </template>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <playDetails :playDetailsVisible.sync="playDetailsVisible" :playDetailsList.sync="playDetailsList" :tabActive="tabActive" />
+    <addVideoDlg :addEditdialogVisib.sync="addEditdialogVisib" :chartPermissionList="chartPermissionList" :playDetailsList.sync="editDetails" />
+    <atc-particulars :dialogVisible.sync="dialogVisible" :detailData.sync="detailData" />
+    <generation-ask :generaitondialogVisib.sync="generaitondialogVisib" :generaitonId="generaitonId" :generaitonType="generaitonType" :tabActiveRoadshow="tabActive" />
+    <release-audio :addEditdialogReleaseAudio.sync="addEditdialogReleaseAudio" :chartPermissionList="chartPermissionList" :playDetailsList.sync="editDetails" />
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiVideoApi } from "@/api/api.js";
+import { tableColums, TopTabs } from "./roadShow/tableTabs";
+import { PublishSelect } from "../components/apply/applyTableColums";
+import mPage from "@/components/mPage.vue";
+import playDetails from "./roadShow/components/playDetailsDlg.vue";
+import addVideoDlg from "./roadShow/components/addVideoDlg.vue";
+import moment from "moment";
+import AtcParticulars from "../components/atcParticulars.vue";
+import GenerationAsk from "../components/generationAsk.vue";
+import ReleaseAudio from "./roadShow/components/releaseAudio.vue";
+
+export default {
+  name: "",
+  components: { mPage, playDetails, addVideoDlg, AtcParticulars, GenerationAsk, ReleaseAudio },
+  props: {},
+  data() {
+    return {
+      tableColums: [],
+      dataList: [],
+      tabActive: 1, //tabs 选中
+      chartPermissionList: [], //行业的数组
+      chartPermissionId: "", //行业的id
+      issueTime: "", //活动时间
+      cactivityTypeVal: "", //活动类型
+      cactivityTypeList: [],
+      publishStatus: "", //发布状态
+      fileName: "", //文件名称
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      page_no: 1, //页码
+      playDetailsVisible: false, //播放详情的弹框
+      playDetailsList: {}, //播放详情的数据//编辑的详情
+      editDetails: {}, //播放详情的数据//编辑的详情
+      addEditdialogVisib: false, //添加视频的弹框
+      sortType: "",
+      detailData: [],
+      dialogVisible: false,
+      generaitondialogVisib: false, //代问的弹框
+      generaitonId: "",
+      generaitonType: "微路演",
+      addEditdialogReleaseAudio: false,
+    };
+  },
+  computed: {
+    topTabs() {
+      return TopTabs;
+    },
+    //发布状态
+    publishSelect() {
+      return PublishSelect;
+    },
+  },
+  watch: {},
+  created() {
+    if (sessionStorage.getItem("backRoadShowListPage")) {
+      let { page_no, fileName, chartPermissionId, cactivityTypeVal, issueTime, tabActive } = JSON.parse(sessionStorage.getItem("backRoadShowListPage"));
+      this.page_no = page_no;
+      this.fileName = fileName;
+      this.chartPermissionId = chartPermissionId;
+      this.cactivityTypeVal = cactivityTypeVal;
+      this.issueTime = issueTime;
+      this.tabActive = tabActive;
+    }
+  },
+  mounted() {
+    this.tableColums = tableColums(this.tabActive);
+    this.chartPermission();
+    this.activityType();
+    this.getVideoList();
+  },
+  methods: {
+    topTabsHandler(item) {
+      this.tabActive = item.value;
+      this.tableColums = tableColums(this.tabActive);
+      this.publishStatus = "";
+      this.cactivityTypeVal = "";
+      this.page_no = 1;
+      this.getVideoList();
+    },
+    //获取行业
+    async chartPermission() {
+      const res = await raiInterface.chartPermission();
+      if (res.Ret === 200) {
+        this.chartPermissionList = res.Data.List;
+      }
+    },
+    //活动类型
+    async activityType() {
+      const res = await raiInterface.getActivityType();
+      if (res.Ret === 200) {
+        this.cactivityTypeList = res.Data.List;
+      }
+    },
+    async getVideoList() {
+      // let SortParam = this.sortType && this.tabActive == 4 ? "videoCounts" : this.sortType && this.tabActive == 1 ? "voiceCounts" : "";
+      let params = {
+        PageSize: this.PageSize,
+        CurrentIndex: this.page_no,
+        KeyWord: this.fileName,
+        StartDate: this.issueTime ? this.issueTime[0] : "",
+        EndDate: this.issueTime ? this.issueTime[1] : "",
+        PublishStatus: this.publishStatus ? Number(this.publishStatus) : "",
+        ChartPermissionId: this.chartPermissionId,
+        ActivityTypeId: this.cactivityTypeVal,
+        SortType: this.sortType,
+        SortParam: "videoCounts",
+        SearchType: this.tabActive,
+      };
+      const res =
+        this.tabActive == 4
+          ? await raiVideoApi.videoList(params)
+          : this.tabActive == 1
+          ? await raiVideoApi.activityVoiceAndVideoList(params)
+          : this.tabActive == 3
+          ? await raiVideoApi.askserie_videoList(params)
+          : await raiVideoApi.activityVoiceAndVideoList(params);
+      if (res.Ret === 200) {
+        this.dataList = res.Data.List;
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    //select 筛选条件后的事件
+    selectChangeHandle() {
+      this.page_no = 1;
+      this.getVideoList();
+    },
+    //文件名称的搜索
+    fileNameHandle() {
+      this.issueTime = "";
+      this.publishStatus = "";
+      this.chartPermissionId = "";
+      this.page_no = 1;
+      this.getVideoList();
+    },
+    /* 点击表格的排序 */
+    sortChangeHandle({ prop, order }) {
+      this.sortType = order == "ascending" ? "asc" : order == "descending" ? "desc" : "";
+      this.getVideoList();
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getVideoList();
+    },
+    /*
+    表格三件套
+    */
+    handleRowContent(row, key) {
+      if (key == "PublishStatus") {
+        let status = row["PublishStatus"] == 1 ? "已发布" : row["PublishStatus"] == 3 ? "已取消" : "未发布";
+        return status;
+      } else if (key == "VideoDuration" || key == "VoicePlaySeconds") {
+        let m = parseInt(row[key] / 60);
+        let s = parseInt(row[key] % 60);
+        let ms = `${m > 9 ? m : "0" + m}分${s > 9 ? s : "0" + s}秒`;
+        return ms;
+      } else {
+        return row[key];
+      }
+    },
+    handleRowStyle(key) {
+      const style = {
+        VideoCounts: "color: #409eff; cursor: pointer",
+        VoiceCounts: "color: #409eff; cursor: pointer",
+        CommentNum: "color: #409eff; cursor: pointer",
+      };
+      return style[key] ? style[key] : "";
+    },
+    //
+    handleRowClick(row, key) {
+      if (key == "VideoCounts" || key == "VoiceCounts") {
+        this.playDetailsVisible = true;
+        this.playDetailsList = row;
+      } else if (key == "CommentNum") {
+        this.generaitondialogVisib = true;
+        this.generaitonId = this.tabActive == 1 || this.tabActive == 2 ? row.ActivityId : this.tabActive == 3 ? row.AskserieVideoId : row.VideoId;
+      }
+    },
+    /*
+    表格三件套
+    */
+    //点击标题的弹框
+    titleBtnClick(id) {
+      raiInterface.activityDetail({ ActivityId: Number(id) }).then((res) => {
+        if (res.Ret == 200) {
+          this.detailData = res.Data;
+        }
+      });
+      this.dialogVisible = true;
+    },
+    //发布或者取消发布
+    handlePublish(item) {
+      let str = this.tabActive == 3 ? "音频" : "视频";
+      this.$confirm(item.PublishStatus == 1 ? `确认取消发布该${str}吗？` : `确认发布该${str}吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          const res =
+            this.tabActive == 3
+              ? await raiVideoApi.askseriePublishAndcancel({
+                  AskserieVideoId: item.AskserieVideoId,
+                  PublishOrCancle: item.PublishStatus == 1 ? 0 : 1,
+                })
+              : await raiVideoApi.videoPublish({
+                  VideoId: item.VideoId,
+                  PublishOrCancle: item.PublishStatus == 1 ? 0 : 1,
+                });
+          if (res.Ret === 200) {
+            this.$message.success("操作成功！");
+            this.getVideoList();
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消",
+          });
+        });
+    },
+    //编辑
+    handleEditVideo(item, type) {
+      if (type == "活动") {
+        this.$router.push({
+          path: "/editActivity",
+          query: {
+            id: item.ActivityId,
+            isShow: 1,
+          },
+        });
+      } else {
+        this.editDetails = item;
+        if (this.tabActive == 3) {
+          this.addEditdialogReleaseAudio = true;
+        } else {
+          this.addEditdialogVisib = true;
+        }
+      }
+    },
+  },
+  // 进入
+  beforeRouteEnter(to, from, next) {
+    console.log(from);
+    if (from.path !== "/editActivity") {
+      sessionStorage.removeItem("backRoadShowListPage");
+    }
+    next();
+  },
+  // 离开
+  beforeRouteLeave(to, from, next) {
+    let backData = {
+      page_no: this.page_no,
+      fileName: this.fileName,
+      chartPermissionId: this.chartPermissionId,
+      cactivityTypeVal: this.cactivityTypeVal,
+      issueTime: this.issueTime,
+      tabActive: this.tabActive,
+    };
+    sessionStorage.setItem("backRoadShowListPage", JSON.stringify(backData));
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-road-show {
+  .top-wrap {
+    margin-bottom: 28px;
+    padding: 20px;
+    background: #fff;
+    border: 1px solid #ececec;
+    border-radius: 4px;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .item {
+      display: flex;
+      width: 100px;
+      height: 40px;
+      background: #ecf5ff;
+      border-radius: 4px;
+      border: 1px solid #b3d8ff;
+      color: #3385ff;
+      font-size: 16px;
+      align-items: center;
+      justify-content: center;
+      margin-right: 20px;
+      cursor: pointer;
+    }
+    .active {
+      border: none;
+      background-color: #409eff;
+      color: #fff;
+    }
+  }
+  .select-content {
+    display: flex;
+    justify-content: space-between;
+    .el-select {
+      width: 220px;
+      margin-right: 20px;
+    }
+    .mx-datepicker {
+      width: 220px !important;
+      margin-right: 20px !important;
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/specialResearch.vue

@@ -0,0 +1,465 @@
+<template>
+  <div class="container special-research">
+    <div class="top-wrap">
+      <div class="tabs-content">
+        <span @click="tabsHandle(item)" :class="['item', tabsActive == item.id && 'active-item']" v-for="item in tabsTop" :key="item.id">{{ item.name }}</span>
+      </div>
+    </div>
+    <div class="top-wrap">
+      <div>
+        <el-button v-if="tabsActive == 2" type="primary" style="margin-right: 20px" @click="addapply">新增报名</el-button>
+        <el-button v-if="tabsActive == 2" type="primary" @click="sendMessage" style="margin-right: 20px">发送模板消息</el-button>
+        <el-select placeholder="请选择行业" clearable v-model="industryValue" @change="changeHandel" style="margin: 0 20px 20px 0">
+          <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+        </el-select>
+        <el-select placeholder="发布状态" clearable v-model="status" @change="changeHandel" style="margin: 0 30px 20px 0">
+          <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
+        </el-select>
+        <template v-if="tabsActive == 1">
+          <el-button style="margin-bottom: 20px" type="primary" @click="$router.push('/addResearch')">添加活动</el-button>
+          <el-button style="margin-bottom: 20px" type="primary" @click="interestHandler">客户兴趣总览</el-button>
+        </template>
+      </div>
+      <div style="width: 520px">
+        <el-input v-model="themeVal" @input="themeInput" placeholder="请输入主题名称" clearable>
+          <i slot="prefix" class="el-input__icon el-icon-search"></i>
+        </el-input>
+      </div>
+    </div>
+    <el-card>
+      <el-table @selection-change="selectChange" :data="dataList" style="width: 100%; margin-top: 20px" border>
+        <el-table-column v-if="tabsActive == 2" align="center" type="selection" width="55"> </el-table-column>
+        <el-table-column v-for="item in tableColums" :key="item.label" :label="item.label" :width="item.widthsty" :min-width="item.minwidthsty" align="center">
+          <template slot-scope="{ row }">
+            <span @click="handleRowClick(row, item.key)" :style="handleRowStyle(item.key)">{{ handleRowContent(row, item.key) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column width="230" prop="" align="center" label="操作">
+          <template slot-scope="{ row }">
+            <div v-if="tabsActive == 1">
+              <template v-if="row.PublishStatus !== 4">
+                <span class="editsty" v-if="row.PublishStatus == 1" @click="applyHandleAllOperate(row.ActivityId, '下线')">下线 &nbsp;&nbsp;</span>
+                <span class="editsty" v-if="row.PublishStatus == 3" @click="applyHandleAllOperate(row.ActivityId, '重新发布')">重新发布 &nbsp;&nbsp;</span>
+                <span v-if="row.PublishStatus == 0" class="editsty" @click="applyHandleAllOperate(row.ActivityId, '发布')">发布 &nbsp;&nbsp;</span>
+                <span class="editsty" @click="editBtn(row.ActivityId, row.PublishStatus, '')">编辑 &nbsp;&nbsp;</span>
+                <span class="editsty" v-if="row.PublishStatus == 1" @click="editBtn(row.ActivityId, row.PublishStatus, '行程')">确定行程</span>
+                <span class="deletesty" v-if="row.PublishStatus == 0" @click="applyHandleAllOperate(row.ActivityId, '删除')">删除</span>
+              </template>
+            </div>
+            <div v-else>
+              <span class="editsty" v-if="row.PublishStatus == 1 && isStart(row.ActivityTime)" @click="applyHandleAllOperate(row.ActivityId, '取消发布')">取消发布 &nbsp;&nbsp;</span>
+              <span class="editsty" v-if="row.PublishStatus !== 1" @click="applyHandleAllOperate(row.ActivityId, '重新发布')">重新发布 &nbsp;&nbsp;</span>
+              <span class="editsty" @click="editBtn(row.ActivityId, row.PublishStatus, '行程')">编辑 &nbsp;&nbsp;</span>
+              <span class="editsty" v-if="row.IsShowUpdateMeeting" @click="particularsSubmit(row.ActivityId)"> 修改到会情况 </span>
+              <span class="editsty" v-if="row.IsShowSubmitMeeting" @click="particularsSubmit(row.ActivityId)"> 提交到会情况 </span>
+              <span class="editsty" v-if="row.IsShowAttendanceDetails" @click="particulars(row.ActivityId)">&nbsp;&nbsp;到会详情</span>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <special-research-dlg :specialDetailId="specialDetailId" :dialogVisibleActivity.sync="dialogVisibleActivity" :dialogTitle="dialogTitle" :tabsActive="tabsActive" />
+    <partical-dialog :offlineId="offlineId" :dialogVisiblepartica.sync="dialogVisiblepartica" :particlaDlg="particlaDlg" :submitDialog.sync="submitDialog" />
+    <apply-dialog :addDialogVisible.sync="addDialogVisible" :selectList="selectList" :signUpAdd="signUpAdd" :addDialogType="addDialogType" />
+    <particulars-all :particularsDialogVisible.sync="particularsDialogVisible" :dialogVisibleList="dialogVisibleList" />
+    <template-message :messageDialog.sync="messageDialogVisible" :selectionArr="selectionArr" typeMessage="确定行程"/>
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+import mPage from "@/components/mPage.vue";
+import { inAdvanceOptions, tableColums, TabsTop, ConfirmOptions } from "../components/special/optionsTabs";
+import ParticalDialog from "../components/particalDialog.vue";
+import ApplyDialog from "../components/apply/applyDialog.vue";
+import ParticularsAll from "./specialResearch/particularsAll.vue";
+import SpecialResearchDlg from "../components/special/specialResearchDlg.vue";
+import TemplateMessage from "../components/apply/templateMessage.vue";
+export default {
+  name: "",
+  components: { mPage, ParticalDialog, ApplyDialog, ParticularsAll, SpecialResearchDlg, TemplateMessage },
+  props: {},
+  data() {
+    return {
+      status: "",
+      industryValue: "",
+      chartPermissionList: [],
+      themeVal: "",
+      dataList: [],
+      page_no: 1,
+      total: 0,
+      dialogVisibleActivity: false,
+      dialogTitle: "",
+      activityDetail: {},
+      previewList: [],
+      interestData: [], //感兴趣人数
+      exportInterest: "",
+      tableColums: [],
+      tabsActive: 1,
+      offlineId: 0, //提交的ID
+      dialogVisiblepartica: false, //到会详情的隐现
+      particlaDlg: {
+        isSpecial: true,
+        title: "到会详情",
+      }, //提交的标题
+      submitDialog: false, //提交到会情况的隐现
+      addDialogVisible: false,
+      signUpAdd: "专项",
+      addDialogType: "新增报名",
+
+      particularsDialogVisible: false,
+      dialogVisibleList: {},
+      specialDetailId: 0,
+      selectList: [],
+      messageDialogVisible: false, // 发送模版消息
+      selectionArr: {},
+    };
+  },
+  computed: {
+    options() {
+      return this.tabsActive == 1 ? inAdvanceOptions : ConfirmOptions;
+    },
+    tabsTop() {
+      return TabsTop;
+    },
+  },
+  created() {},
+  mounted() {
+    if (sessionStorage.getItem("specialResearchListBack")) {
+      let { tabsActive, page, status, industryValue, themeVal } = JSON.parse(sessionStorage.getItem("specialResearchListBack"));
+      this.themeVal = themeVal;
+      this.page_no = page;
+      this.tabsActive = tabsActive;
+      this.status = status;
+      this.industryValue = industryValue;
+    }
+    this.chartPermission();
+    this.getsDataList();
+    this.tableColums = tableColums(this.tabsActive);
+  },
+  methods: {
+    //点击了头部切换
+    tabsHandle(item) {
+      this.tabsActive = item.id;
+      this.tableColums = tableColums(this.tabsActive);
+      this.status = "";
+      this.page_no = 1;
+      this.getsDataList();
+    },
+    //change 变化
+    changeHandel() {
+      this.page_no = 1;
+      this.getsDataList();
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getsDataList();
+    },
+    //获取表格
+    async getsDataList() {
+      const res = await raiSpecial.getSpecialList({
+        PageSize: 10,
+        CurrentIndex: this.page_no,
+        PublishStatus: this.status ? Number(this.status) : 2,
+        ChartPermissionId: this.industryValue,
+        IsTrip: this.tabsActive == 2,
+        KeyWord: this.themeVal,
+      });
+      if (res.Ret === 200) {
+        this.dataList = res.Data.List;
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    //获取行业
+    chartPermission() {
+      raiInterface.getActivitySpecial().then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    //获取调研主题详情
+    async themeDetails(id) {
+      this.specialDetailId = id;
+      this.dialogVisibleActivity = true;
+      this.dialogTitle = "活动详情";
+
+      return;
+      const res = await raiSpecial.specialDetail({ ActivityId: id });
+      if (res.Ret === 200) {
+        this.previewList = [];
+        this.activityDetail = res.Data;
+        this.previewList.push(this.tabsActive == 1 ? this.activityDetail.TripImgLink : this.activityDetail.TripImgLinkFix);
+      }
+    },
+    //感兴趣人数
+    async interestDetails(id) {
+      this.specialDetailId = id;
+      this.dialogTitle = "感兴趣人数";
+      this.dialogVisibleActivity = true;
+      return;
+      const res = await raiSpecial.specialInterested({ ActivityId: id });
+      if (res.Ret === 200) {
+        this.exportInterest = `${process.env.API_ROOT}/cygx/special/export?${localStorage.getItem("auth") || ""}&ActivityId=${id}`;
+        this.$nextTick(() => {
+          this.interestData = res.Data.List;
+        });
+      }
+    },
+    //发布、取消发布 、删除、下线、重新发布、取消发布
+    applyHandleAllOperate(id, value) {
+      this.$confirm(`确定${value}该活动吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          const res =
+            value == "删除"
+              ? await raiSpecial.specialDelete({
+                  ActivityId: id,
+                })
+              : value == "发布"
+              ? await raiSpecial.specialPublishAndCancel({
+                  ActivityId: id,
+                })
+              : value == "下线"
+              ? await await raiSpecial.postSpecialOffline({
+                  ActivityId: id,
+                })
+              : value == "取消发布"
+              ? await raiSpecial.specialPublishAndCancel({
+                  ActivityId: id,
+                })
+              : value == "重新发布" && this.tabsActive == 1
+              ? await await await raiSpecial.postSpecialOffline({
+                  ActivityId: id,
+                })
+              : await await raiSpecial.specialPublishAndCancel({
+                  ActivityId: id,
+                });
+
+          if (res.Ret !== 200) return;
+          this.$message.success(`${value}成功!`);
+          if (value == "删除") {
+            let page_num = Math.ceil((this.total - 1) / 10);
+            if (this.page_no > page_num) {
+              this.page_no = page_num;
+            }
+          }
+          this.getsDataList();
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消${value}`,
+          });
+        });
+    },
+    //点击了编辑
+    editBtn(id, show, type = "") {
+      type == ""
+        ? this.$router.push({
+            path: "/editResearch",
+            query: { id, isShow: show },
+          })
+        : this.$router.push({
+            path: "/determineTravel",
+            query: { id },
+          });
+    },
+    //提交到会情况
+    particularsSubmit(id) {
+      this.offlineId = id;
+      this.submitDialog = true;
+    },
+    //到会详情
+    particulars(id) {
+      this.offlineId = id;
+      this.dialogVisiblepartica = true;
+    },
+    handleCloseSubject() {
+      this.dialogTitle = "";
+      this.exportInterest = "";
+      this.activityDetail = {};
+      this.dialogVisibleActivity = false;
+    },
+    //感兴趣人数总览
+    interestHandler() {
+      let routeUrl = this.$router.resolve("/interestAllPreview");
+      window.open(routeUrl.href, "_blank");
+    },
+    applyNum(item) {
+      this.particularsDialogVisible = true;
+      this.dialogVisibleList = item;
+    },
+    /* 表格行的样式 */
+    handleRowStyle(key) {
+      const style = {
+        ResearchTheme: "color: #409eff; cursor: pointer",
+        InterestedNum: "color: #409eff; cursor: pointer",
+        SignupPeopleNum: "color: #409eff; cursor: pointer",
+      };
+      return style[key] ? style[key] : "";
+    },
+    /* 表格行的点击事件 */
+    handleRowClick(row, key) {
+      if (key === "ResearchTheme") {
+        this.themeDetails(row.ActivityId);
+      } else if (key === "InterestedNum") {
+        this.interestDetails(row.ActivityId);
+      } else if (key === "SignupPeopleNum") {
+        this.applyNum(row);
+      }
+    },
+    /* 表格行的数据处理 */
+    handleRowContent(row, key) {
+      if (key == "SpecialType") {
+        return row[key] == 1 ? "线上" : `线下(${row["City"]})`;
+      } else if (key == "PublishStatus") {
+        return row[key] == 1
+          ? "已发布"
+          : row[key] == 0 && this.tabsActive == 1
+          ? "未发布"
+          : row[key] == 0 && this.tabsActive == 2
+          ? "已取消"
+          : row[key] == 3
+          ? "已下线"
+          : row[key] == 4
+          ? "已确定行程"
+          : "";
+      } else if (key == "InterestedNum") {
+        return row[key] ? row[key] : "";
+      } else {
+        return row[key];
+      }
+    },
+    // 新增活动报名
+    addapply() {
+      if (!this.selectList) return this.$message.error("请先选择活动");
+      this.addDialogVisible = true;
+    },
+    // 新增活动报名的表格选择
+    selectChange(selection) {
+      this.selectionArr = selection;
+      let arr = [];
+      selection.forEach((item) => {
+        arr.push(item.ActivityId);
+      });
+      this.selectList = arr.join(",");
+    },
+    // 判断活动时间对比当前时间
+    isStart(val) {
+      return this.$moment().isBefore(val);
+    },
+    // 主题名称的输入框
+    themeInput() {
+      this.page_no = 1;
+      this.status = "";
+      this.industryValue = "";
+      this.getsDataList();
+    },
+    // 发送模版消息
+    sendMessage() {
+      if (this.selectList && this.selectList.split(",").length === 1) {
+        this.messageDialogVisible = true;
+      } else {
+        this.$message.error("请选择一个活动");
+      }
+    },
+  },
+  beforeRouteEnter(to, from, next) {
+    if (from.path !== "/addResearch" && from.path !== "/determineTravel" && from.path !== "/editResearch") {
+      sessionStorage.removeItem("specialResearchListBack");
+    }
+    next();
+  },
+  beforeRouteLeave(to, from, next) {
+    let obj = {
+      page: this.page_no,
+      tabsActive: this.tabsActive,
+      status: this.status,
+      industryValue: this.industryValue,
+      themeVal: this.themeVal,
+    };
+    sessionStorage.setItem("specialResearchListBack", JSON.stringify(obj));
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.special-research {
+  .top-wrap {
+    margin-bottom: 28px;
+    padding: 20px 30px 0;
+    background: #fff;
+    border: 1px solid #ececec;
+    border-radius: 4px;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+    display: flex;
+    justify-content: space-between;
+  }
+  .tabs-content {
+    display: flex;
+    padding-bottom: 20px;
+    .item {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      padding: 0 18px;
+      height: 40px;
+      background: #ecf5ff;
+      border-radius: 4px 4px 4px 4px;
+      border: 1px solid #b3d8ff;
+      margin-right: 20px;
+      color: #3385ff;
+      font-size: 16px;
+      cursor: pointer;
+    }
+    .active-item {
+      height: 40px;
+      background: #409eff;
+      color: #fff;
+    }
+  }
+  .rai-detail-wrap {
+    .activity-top {
+      width: 100%;
+      height: 55px;
+      background: #f4f4f4;
+      border-radius: 4px 4px 4px 4px;
+      opacity: 1;
+      line-height: 55px;
+      padding-left: 23px;
+      margin-bottom: 30px;
+    }
+    p {
+      margin-bottom: 20px;
+      padding-left: 10px;
+    }
+    .arrange {
+      margin: 50px auto 20px;
+      cursor: pointer;
+      text-align: center;
+      color: #3385ff;
+    }
+    .text-box {
+      display: flex;
+      padding-left: 10px;
+      span {
+        display: block;
+        margin-bottom: 10px;
+      }
+    }
+  }
+  .dialog-footer {
+    text-align: center;
+    margin-bottom: 20px;
+  }
+}
+</style>

src/views/rai_manage/activityManage/specialResearch/addResearch.vue

@@ -0,0 +1,486 @@
+<template>
+  <div class="container add-research">
+    <el-card>
+      <el-form :model="ruleForm" :rules="rules" ref="ruleFormList" label-width="100px" class="demo-ruleForm">
+        <el-form-item label="所属行业：" prop="industry">
+          <el-select placeholder="请选择行业" style="width: 396px" clearable v-model="ruleForm.industry" @change="changeHandel">
+            <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.PermissionName" :value="item.PermissionName"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="调研主题：" prop="theme">
+          <el-input style="width: 396px" v-model="ruleForm.theme" placeholder="请输入调研主题"></el-input>
+        </el-form-item>
+        <el-form-item label="预期时间：" prop="date">
+          <el-input v-model="ruleForm.date" style="width: 396px" placeholder="请输入预期活动时间"></el-input>
+        </el-form-item>
+        <el-form-item label="调研形式：" prop="modality">
+          <el-radio-group v-model="ruleForm.modality">
+            <el-radio v-for="item in modalityRadio" :key="item.id" :label="item.id">{{ item.name }}</el-radio>
+          </el-radio-group>
+          <el-input v-model="ruleForm.city" v-if="ruleForm.modality == 2" style="width: 248px; margin-left: 10px" placeholder="请输入调研城市,多个城市以','隔开"></el-input>
+        </el-form-item>
+        <el-form-item label="主题标签：">
+          <div style="display: flex; align-items: center; flex-wrap: wrap">
+            <el-form-item prop="property">
+              <el-cascader
+                key="multipleTrue"
+                style="margin: 0 15px 10px 0"
+                v-model="ruleForm.property"
+                :disabled="selectDisabled"
+                @change="propertyChange"
+                placeholder="请选择产业名称"
+                :show-all-levels="false"
+                :options="industryArr"
+                :props="{ ...defaultProps, multiple: true }"
+                filterable
+              >
+              </el-cascader>
+            </el-form-item>
+            <el-form-item>
+              <el-select style="margin: 0 15px 10px 0" v-model="ruleForm.mark" :disabled="selectDisabled" @focus="markSelectFocus" multiple placeholder="请选择关联标的">
+                <el-option v-for="item in markOptions" :key="item.IndustrialSubjectId" :value="item.IndustrialSubjectId" :label="item.SubjectName"> </el-option>
+              </el-select>
+            </el-form-item>
+            <div v-for="(item, index) in addSubjectData" :key="index" style="display: inline-block">
+              <el-input style="width: 220px; margin: 0 5px 10px 0" v-model="item.subjectVal" placeholder="请输入标的名称" type="text"> </el-input>
+              <img @click="deleteSubject(item, index)" style="width: 18px; margin-right: 20px; vertical-align: middle" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <el-tooltip class="item" effect="dark" content="添加标的" placement="top-start">
+              <img @click="addLabelClick" class="editsty" src="~@/assets/img/set_m/add_ico.png" style="margin: 0 10px 10px" />
+            </el-tooltip>
+          </div>
+          <div style="display: flex; align-items: center; margin-top: 10px">
+            <el-checkbox v-model="ruleForm.isMark">小程序内显示标的名称</el-checkbox>
+            <el-checkbox style="margin-left: 10px" v-model="radioTemporary">临时标签</el-checkbox>
+            <el-input style="width: 300px; margin: 0 10px" v-model="valTemporary" @focus="radioTemporary = true" placeholder="请输入标签名称" type="text"></el-input>
+            <div class="editsty" @click="dialogVisibleSubject = true">查询标的</div>
+          </div>
+        </el-form-item>
+        <el-form-item label="活动可见：" prop="checkedCities">
+          <div style="display: flex">
+            <span style="width: 70px" class="text-right"> 套餐类型： </span>
+            <el-checkbox :indeterminate="isIndeterminate" v-model="ruleForm.checkAll" @change="handleCheckAllChange" :disabled="checkAllIs" style="margin-right: 30px">全选</el-checkbox>
+            <el-checkbox-group v-model="ruleForm.checkedCities" @change="handleCheckedCitiesChange">
+              <el-checkbox v-for="item in cities" :label="item.CustomerTypeId" :key="item.CustomerTypeId">
+                {{ item.CustomerName }}
+                <el-tooltip :content="item.ExplainSpecial" placement="top-start" v-if="item.ExplainSpecial">
+                  <i class="el-icon-info" />
+                </el-tooltip>
+              </el-checkbox>
+            </el-checkbox-group>
+          </div>
+        </el-form-item>
+        <el-form-item label="行程安排：" prop="Poster">
+          <el-upload
+            :action="baseApi + '/resource/image/upload'"
+            list-type="picture-card"
+            :class="{ disabled: uploadDisabled }"
+            :on-preview="handlePictureCardPreview"
+            :on-success="handleUploadPosterSuccess"
+            :on-remove="handlePosterRemove"
+            :file-list="ruleForm.Poster"
+          >
+            <i class="el-icon-plus"></i>
+          </el-upload>
+          <el-dialog customClass="custom-addPoster" :visible.sync="dialogVisible" :modal-append-to-body="false">
+            <div class="addPoster-img">
+              <img width="100%" :src="dialogImageUrl" />
+            </div>
+          </el-dialog>
+        </el-form-item>
+        <div style="text-align: center; margin-top: 30px">
+          <el-button type="primary" @click="submitForm('保存')">保存</el-button>
+          <el-button type="primary" v-if="publishStatus" @click="submitForm('发布')">发布</el-button>
+          <el-button @click="cancelBtn">取消</el-button>
+        </div>
+      </el-form>
+    </el-card>
+    <el-dialog width="500px" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="查询标的" :visible.sync="dialogVisibleSubject" :before-close="handleCloseSubject">
+      <div>
+        <el-select style="width: 100%" v-model="addSubjectName" remote :remote-method="remoteMethod" clearable filterable @change="searchInfo" placeholder="请输入标的名称">
+          <el-option v-for="item in addSubjectOptions" :key="item.IndustrialSubjectId" :label="item.SubjectName" :value="item.SubjectName"> </el-option>
+        </el-select>
+      </div>
+      <p class="subject-text" v-if="isShowSubject">暂无数据</p>
+      <template v-else>
+        <p class="subject-text" v-for="(item, index) in nameSubjectOptions" :key="index">{{ item.Name }} : {{ item.value }}</p>
+      </template>
+      <p style="padding-bottom: 50px"></p>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+import CryptoJS from "@/api/crypto.js";
+export default {
+  name: "",
+  components: {},
+  props: {},
+  data() {
+    return {
+      baseApi: process.env.API_ROOT,
+      ruleForm: {
+        theme: "", //主题
+        industry: "", //行业
+        date: "", //时间
+        property: [], //产业
+        mark: [], //标的
+        checkAll: true, ////套餐类型
+        checkedCities: [], //套餐类型
+        Poster: [],
+        modality: "", //调研形式
+        city: "", //城市
+        isMark: false, //小程序内显示标的名称
+      },
+      rules: {
+        industry: [{ required: true, message: "请选择行业", trigger: "change" }],
+        theme: [{ required: true, message: "请输入调研主题", trigger: "blur" }],
+        date: [{ required: true, message: "请输入预期活动时间", trigger: "blur" }],
+        checkedCities: [{ required: true, message: "请选择套餐类型", trigger: "change" }],
+        property: [{ required: true, message: "请选择产业名称", trigger: "change" }],
+        modality: [{ required: true, message: "请选择调研形式", trigger: "change" }],
+        Poster: [{ required: true, message: "请上传行程", trigger: "change" }],
+      },
+      dialogImageUrl: "",
+      dialogVisible: false,
+      chartPermissionList: [],
+      defaultProps: {
+        label: "PermissionName",
+        children: "List",
+        value: "ChartPermissionId",
+      },
+      markOptions: [],
+      industryArr: [],
+      radioTemporary: false, //临时标签
+      valTemporary: "", //标签名称
+      cities: [],
+      isIndeterminate: false,
+      dialogVisibleSubject: false,
+      addSubjectName: "",
+      addSubjectOptions: "",
+      nameSubjectOptions: [],
+      isShowSubject: false,
+      ListSubject: [],
+      checkedCitiesTwo: "",
+      modalityRadio: [
+        { name: "线上", id: 1 },
+        { name: "线下", id: 2 },
+      ],
+      publishStatus: true,
+      addSubjectData: [],
+    };
+  },
+  computed: {
+    uploadDisabled: function () {
+      return this.ruleForm.Poster.length > 0;
+    },
+  },
+  watch: {
+    radioTemporary() {
+      if (this.radioTemporary) {
+        this.selectDisabled = true;
+      } else {
+        this.valTemporary = "";
+        this.selectDisabled = false;
+      }
+    },
+    "ruleForm.modality": {
+      handler(newval) {
+        if (newval == 1) {
+          this.ruleForm.city = "";
+        }
+      },
+      deep: true,
+    },
+  },
+  created() {},
+  mounted() {
+    this.customerTypelist();
+    this.chartPermission();
+    this.getIndustry();
+    if (this.$route.query.id) {
+      this.themeDetails(this.$route.query.id);
+    }
+    if (this.$route.query.isShow == 1) {
+      this.publishStatus = false;
+    }
+  },
+  methods: {
+    //获取行业
+    chartPermission() {
+      raiInterface.getActivitySpecial().then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    /* 获取全部的行业 */
+    getIndustry() {
+      raiInterface.getListIndustrial().then((res) => {
+        if (res.Ret === 200) {
+          this.industryArr = res.Data.List || [];
+        }
+      });
+    },
+    //点击添加标的的下拉选择框
+    markSelectFocus() {
+      if (!this.ruleForm.property.length) {
+        this.$message.error("请先选择产业");
+      } else {
+        let arr = [];
+        arr = this.ruleForm.property.map((item) => {
+          return item[1];
+        });
+        raiInterface
+          .getindustrialSubjectlistIds({
+            IndustrialManagementIdStr: arr.join(","),
+          })
+          .then((res) => {
+            if (res.Ret === 200) {
+              this.markOptions = res.Data.List || [];
+            }
+          });
+      }
+    },
+    //获取多选的客户列表
+    customerTypelist() {
+      raiInterface.customerTypelist({ IsZxdy: true }).then((res) => {
+        if (res.Ret === 200) {
+          this.ruleForm.checkedCities = res.Data.List && res.Data.List.map((item) => item.CustomerTypeId);
+          this.cities = res.Data.List;
+        }
+      });
+    },
+    // 上传成功回调
+    handleUploadPosterSuccess(response, file, fileList) {
+      let upload_list = [];
+      fileList.forEach((item) => {
+        let obj = {
+          ...item,
+          response: process.env.NODE_ENV === "production" ? JSON.parse(CryptoJS.Des3Decrypt(item.response)) : item.response,
+        };
+        upload_list.push(obj);
+      });
+      console.log(upload_list);
+      this.ruleForm.Poster = upload_list.map((item) => {
+        return { name: item.response.Data.ResourceName, ...item };
+      });
+    },
+    // 删除上传的
+    handlePosterRemove(file, fileList) {
+      this.ruleForm.Poster = fileList;
+    },
+    //预览查看
+    handlePictureCardPreview(file) {
+      this.dialogImageUrl = file.url;
+      this.dialogVisible = true;
+    },
+    //全选框
+    handleCheckAllChange(val) {
+      if (val) {
+        let newCodeList = this.cities.map((item) => item.CustomerTypeId);
+        this.ruleForm.checkedCities = newCodeList;
+      } else {
+        this.ruleForm.checkedCities = [];
+      }
+      this.checkedCitiesTwo = this.ruleForm.checkedCities.join(",");
+      this.isIndeterminate = false;
+    },
+    //全选框
+    handleCheckedCitiesChange(value) {
+      let checkedCount = value.length;
+      this.ruleForm.checkAll = checkedCount === this.cities.length;
+      this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
+    },
+    //弹框的删除标的
+    async remoteMethod(query) {
+      if (query !== "") {
+        const res = await raiInterface.industrialSubjectSearch({
+          KeyWord: query,
+        });
+        if (res.Ret === 200) {
+          this.addSubjectOptions = res.Data.List || [];
+        }
+      }
+    },
+    //弹框的表的 change 事件
+    async searchInfo(val) {
+      if (val !== "") {
+        const res = await raiInterface.industrialSubjectSearchInfo({
+          KeyWord: val,
+        });
+        if (res.Ret === 200) {
+          this.isShowSubject = res.Data.List ? false : true;
+          let arrList = [];
+          arrList = res.Data.List
+            ? res.Data.List.map((item) => {
+                let arr = [];
+                item.List.forEach((key) => {
+                  arr.push(key.Name);
+                });
+                return {
+                  ...item,
+                  value: arr.join(","),
+                };
+              })
+            : [];
+          this.nameSubjectOptions = arrList;
+        }
+      } else {
+        this.nameSubjectOptions = [];
+      }
+    },
+    //获取调研主题详情
+    async themeDetails(id) {
+      const res = await raiSpecial.specialDetail({ ActivityId: id });
+      if (res.Ret === 200) {
+        let { Data } = res;
+        let checkedCount = Data.CustomerTypeIds ? res.Data.CustomerTypeIds.split(",").length : "";
+        let checkAll = checkedCount === this.cities.length;
+        this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
+        this.ruleForm = {
+          theme: Data.ResearchTheme, //主题
+          industry: Data.ChartPermissionName, //行业
+          date: Data.ActivityTimeText, //时间
+          property: Data.ListIndustrial ? Data.ListIndustrial.map((item) => [item.ChartPermissionId, item.IndustrialManagementId]) : [], //产业
+          mark: Data.ListSubject ? Data.ListSubject.map((item) => item.IndustrialSubjectId) : [], //标的
+          checkAll, ////套餐类型
+          checkedCities: Data.CustomerTypeIds.split(",").map((item) => Number(item)), //套餐类型
+          Poster: [{ name: "xxx.jpeg", url: Data.TripImgLink }],
+          modality: Data.SpecialType,
+          city: Data.City,
+          isMark: Data.IsShowSubjectName == 1 ? true : false,
+        };
+        this.valTemporary = Data.TemporaryLabel;
+        this.radioTemporary = this.valTemporary ? true : false;
+        Data.TemporarySubject &&
+          Data.TemporarySubject.split(",").forEach((item) => {
+            this.addSubjectData.push({ subjectVal: item });
+          });
+        if (this.ruleForm.mark.length) {
+          this.markSelectFocus();
+        }
+      }
+    },
+    handleCloseSubject() {
+      this.nameSubjectOptions = [];
+      this.addSubjectName = "";
+      this.addSubjectOptions = [];
+      this.dialogVisibleSubject = false;
+    },
+    //保持或者发布
+    submitForm: _.debounce(function (type) {
+      if (this.selectDisabled) {
+        if (!this.valTemporary) return this.$message.error("请输入临时标签");
+        let validateFieldList = [];
+        this.$refs.ruleFormList.validateField(["industry", "theme", "date", "checkedCities", "Poster", "modality"], (valid) => {
+          validateFieldList.push(valid);
+        });
+        if (this.ruleForm.modality == 2 && !this.ruleForm.city) {
+          return this.$message.error("请输入调研城市");
+        }
+        let isPost = validateFieldList.every((item) => item === "");
+        if (isPost) {
+          this.postPublish(type);
+        }
+      } else {
+        this.$refs.ruleFormList.validate((valid) => {
+          if (valid) {
+            if (this.ruleForm.modality == 2 && !this.ruleForm.city) {
+              return this.$message.error("请输入调研城市");
+            }
+            this.postPublish(type);
+          } else {
+            return false;
+          }
+        });
+      }
+    }, 500),
+    async postPublish(type) {
+      let arr = this.ruleForm.property.map((item) => {
+        return item[1];
+      });
+      let PosterList = this.ruleForm.Poster.map((item) => {
+        if (item.response) {
+          return item.response.Data.ResourceUrl;
+        } else {
+          return item.url;
+        }
+      });
+      let subjectData = [];
+      this.addSubjectData.forEach((item) => subjectData.push(item.subjectVal));
+      const res = await raiSpecial.specialPreserveAndPublish({
+        ActivityId: Number(this.$route.query.id) || 0,
+        ActivityTimeText: this.ruleForm.date,
+        CustomerTypeIds: this.ruleForm.checkedCities.join(","),
+        TemporaryLabel: this.valTemporary,
+        TripImgLink: PosterList.join(","),
+        IndustrialSubjectIdS: this.ruleForm.mark.join(","),
+        IndustrialManagementIdS: arr.join(","),
+        DoType: type == "发布" ? 1 : 0,
+        PermissionName: this.ruleForm.industry,
+        ResearchTheme: this.ruleForm.theme,
+        SpecialType: this.ruleForm.modality,
+        City: this.ruleForm.city,
+        IsShowSubjectName: this.ruleForm.isMark ? 1 : 0,
+        TemporarySubject: subjectData.join(","),
+      });
+      if (res.Ret === 200) {
+        this.$message.success(type + "成功");
+        this.$router.back();
+      }
+    },
+    //点击取消的事件
+    cancelBtn() {
+      this.$router.back();
+    },
+    //点击添加标的
+    addLabelClick() {
+      this.addSubjectData.push({ subjectVal: "" });
+    },
+    //删除新增的主题标签
+    deleteSubject(index, item) {
+      this.addSubjectData.splice(index, 1);
+    },
+  },
+};
+</script>
+<style lang="scss">
+.el-form-item__label:before {
+  display: none;
+}
+.el-upload {
+  width: 100px;
+  height: 100px;
+  line-height: 100px;
+}
+.disabled .el-upload--picture-card {
+  display: none;
+}
+.custom-addPoster {
+  background-color: rgba(0, 0, 0, 0) !important;
+  box-shadow: none !important;
+  width: 70%;
+  .el-dialog__header {
+    display: none;
+  }
+  .el-dialog__body {
+    padding: 0 !important;
+  }
+}
+</style>
+<style scoped lang="scss">
+.add-research {
+  .subject-text {
+    padding-top: 20px;
+  }
+  .addPoster-img {
+    width: 100%;
+    height: 75vh;
+    img {
+      height: 100%;
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/specialResearch/determineTravel.vue

@@ -0,0 +1,656 @@
+<template>
+  <div class="container determine-travel">
+    <el-card>
+      <el-form :model="ruleForm" :rules="rules" ref="ruleFormList" label-width="100px" class="demo-ruleForm">
+        <el-form-item label="所属行业：" prop="industry">
+          <el-select placeholder="请选择行业" style="width: 396px" clearable v-model="ruleForm.industry" @change="changeHandel">
+            <el-option
+              v-for="item in chartPermissionList"
+              :label="item.PermissionName"
+              :key="item.PermissionName"
+              :value="item.PermissionName"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="调研主题：" prop="theme">
+          <el-input style="width: 396px" v-model="ruleForm.theme" placeholder="请输入调研主题"></el-input>
+        </el-form-item>
+        <el-form-item label="调研天数：" prop="dayNumber">
+          <el-select placeholder="请选择调研天数" style="width: 396px" clearable v-model="ruleForm.dayNumber" @change="dayChangeHandel">
+            <el-option v-for="item in isDayNumber" :label="item" :key="item" :value="item"></el-option>
+          </el-select>
+        </el-form-item>
+        <div class="day-content">
+          <div v-for="(item, num) in isDateTime" :key="num" class="day-item">
+            <span class="day-nub"> DAY {{ num + 1 }} : </span>
+            <div>
+              <el-date-picker
+                style="width: 186px; margin-right: 25px"
+                v-model="item.DateYmd"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="请选择日期"
+              >
+              </el-date-picker>
+            </div>
+            <div>
+              <div v-for="(key, index) in item.DateHmsList" :key="index">
+                <el-time-picker
+                  is-range
+                  v-model="key.DateHms"
+                  :key="index + 'time'"
+                  @change="dateHmsChange(key, index, item)"
+                  format="HH:mm"
+                  value-format="HH:mm"
+                  range-separator="至"
+                  start-placeholder="开始时间"
+                  end-placeholder="结束时间"
+                  placeholder="选择时间范围"
+                  style="width: 186px; margin-bottom: 10px"
+                >
+                </el-time-picker>
+                <img
+                  v-if="index != 0"
+                  @click="deleteDayList(item, index)"
+                  style="width: 18px; margin-left: 20px; vertical-align: middle"
+                  src="~@/assets/img/icons/delete-Item.png"
+                />
+              </div>
+              <img @click="addDayList(item, key)" class="editsty" src="~@/assets/img/set_m/add_ico.png" />
+            </div>
+          </div>
+        </div>
+        <el-form-item label="调研形式：" prop="modality">
+          <el-radio-group v-model="ruleForm.modality">
+            <el-radio v-for="item in modalityRadio" :key="item.id" :label="item.id">{{ item.name }}</el-radio>
+          </el-radio-group>
+          <el-input
+            v-model="ruleForm.city"
+            v-if="ruleForm.modality == 2"
+            style="width: 248px; margin-left: 10px"
+            placeholder="请输入调研城市,多个城市以','隔开"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="主持人：" prop="host">
+          <el-input style="width: 396px" v-model="ruleForm.host" placeholder="请输入主持人"></el-input>
+        </el-form-item>
+        <el-form-item label="纪要负责人：" prop="personCharge">
+          <el-input style="width: 396px" v-model="ruleForm.personCharge" placeholder="请输入纪要负责人"></el-input>
+        </el-form-item>
+        <el-form-item label="主题标签：">
+          <div style="display: flex; align-items: center; flex-wrap: wrap">
+            <el-form-item prop="property">
+              <el-cascader
+                key="multipleTrue"
+                style="margin: 0 15px 10px 0"
+                v-model="ruleForm.property"
+                :disabled="selectDisabled"
+                @change="propertyChange"
+                placeholder="请选择产业名称"
+                :show-all-levels="false"
+                :options="industryArr"
+                :props="{ ...defaultProps, multiple: true }"
+                filterable
+              >
+              </el-cascader>
+            </el-form-item>
+            <el-form-item>
+              <el-select
+                style="margin: 0 15px 10px 0"
+                v-model="ruleForm.mark"
+                :disabled="selectDisabled"
+                @focus="markSelectFocus"
+                multiple
+                placeholder="请选择关联标的"
+              >
+                <el-option v-for="item in markOptions" :key="item.IndustrialSubjectId" :value="item.IndustrialSubjectId" :label="item.SubjectName">
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <div v-for="(item, index) in addSubjectData" :key="index" style="display: inline-block">
+              <el-input style="width: 220px; margin: 0 5px 10px 0" v-model="item.subjectVal" placeholder="请输入标的名称" type="text"> </el-input>
+              <img
+                @click="deleteSubject(item, index)"
+                style="width: 18px; margin-right: 20px; vertical-align: middle"
+                src="~@/assets/img/icons/delete-Item.png"
+              />
+            </div>
+            <el-tooltip class="item" effect="dark" content="添加标的" placement="top-start">
+              <img @click="addLabelClick" class="editsty" src="~@/assets/img/set_m/add_ico.png" style="margin: 0 10px 10px" />
+            </el-tooltip>
+          </div>
+          <div style="display: flex; align-items: center; margin-top: 10px">
+            <el-checkbox v-model="ruleForm.isMark">小程序内显示标的名称</el-checkbox>
+            <el-checkbox style="margin-left: 10px" v-model="radioTemporary">临时标签</el-checkbox>
+            <el-input
+              style="width: 300px; margin: 0 10px"
+              v-model="valTemporary"
+              @focus="radioTemporary = true"
+              placeholder="请输入标签名称"
+              type="text"
+            ></el-input>
+            <div class="editsty" @click="dialogVisibleSubject = true">查询标的</div>
+          </div>
+        </el-form-item>
+        <el-form-item label="活动可见：" prop="checkedCities">
+          <div style="display: flex">
+            <span style="width: 70px; flex-shrink: 0" class="text-right"> 套餐类型： </span>
+            <el-checkbox
+              :indeterminate="isIndeterminate"
+              v-model="ruleForm.checkAll"
+              @change="handleCheckAllChange"
+              :disabled="checkAllIs"
+              style="margin-right: 30px"
+              >全选</el-checkbox
+            >
+            <el-checkbox-group v-model="ruleForm.checkedCities" @change="handleCheckedCitiesChange">
+              <el-checkbox v-for="item in cities" :label="item.CustomerTypeId" :key="item.CustomerTypeId">{{ item.CustomerName }} </el-checkbox>
+            </el-checkbox-group>
+          </div>
+        </el-form-item>
+        <el-form-item label="人数限制：" prop="restrictNum">
+          <el-input style="width: 396px" v-model="ruleForm.restrictNum" placeholder="请输入人数限制" type="text"></el-input>
+        </el-form-item>
+        <el-form-item label="行程安排：" prop="Poster">
+          <el-upload
+            :action="baseApi + '/resource/image/upload'"
+            list-type="picture-card"
+            :class="{ disabled: uploadDisabled }"
+            :on-preview="handlePictureCardPreview"
+            :on-success="handleUploadPosterSuccess"
+            :on-remove="handlePosterRemove"
+            :file-list="ruleForm.Poster"
+          >
+            <i class="el-icon-plus"></i>
+          </el-upload>
+          <el-dialog customClass="custom-addPoster" :visible.sync="dialogVisible" :modal-append-to-body="false">
+            <div class="addPoster-img">
+              <img width="100%" :src="dialogImageUrl" />
+            </div>
+          </el-dialog>
+        </el-form-item>
+        <div style="text-align: center; margin-top: 30px">
+          <el-button type="primary" @click="submitForm">确定</el-button>
+          <el-button @click="cancelBtn">取消</el-button>
+        </div>
+      </el-form>
+    </el-card>
+    <el-dialog
+      width="500px"
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      title="查询标的"
+      :visible.sync="dialogVisibleSubject"
+      :before-close="handleCloseSubject"
+    >
+      <div>
+        <el-select
+          style="width: 100%"
+          v-model="addSubjectName"
+          remote
+          :remote-method="remoteMethod"
+          clearable
+          filterable
+          @change="searchInfo"
+          placeholder="请输入标的名称"
+        >
+          <el-option v-for="item in addSubjectOptions" :key="item.IndustrialSubjectId" :label="item.SubjectName" :value="item.SubjectName">
+          </el-option>
+        </el-select>
+      </div>
+      <p class="subject-text" v-if="isShowSubject">暂无数据</p>
+      <template v-else>
+        <p class="subject-text" v-for="(item, index) in nameSubjectOptions" :key="index">{{ item.Name }} : {{ item.value }}</p>
+      </template>
+      <p style="padding-bottom: 50px"></p>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+import CryptoJS from "@/api/crypto.js";
+
+export default {
+  name: "",
+  components: {},
+  props: {},
+  data() {
+    return {
+      baseApi: process.env.API_ROOT,
+      ruleForm: {
+        theme: "", //主题
+        industry: "", //行业
+        property: [], //产业
+        mark: [], //标的
+        checkAll: true, ////套餐类型
+        checkedCities: [], //套餐类型
+        Poster: [],
+        modality: "", //调研形式
+        city: "", //城市
+        isMark: false, //小程序内显示标的名称
+        dayNumber: null, //调研天数
+        host: "", //主持人
+        personCharge: "", //负责人
+        restrictNum: "",
+      },
+      rules: {
+        industry: [{ required: true, message: "请选择行业", trigger: "change" }],
+        theme: [{ required: true, message: "请输入调研主题", trigger: "blur" }],
+        host: [{ required: true, message: "请输入主持人", trigger: "blur" }],
+        personCharge: [{ required: true, message: "请输入纪要负责人", trigger: "blur" }],
+        restrictNum: [{ required: true, message: "请输入人数限制", trigger: "blur" }],
+        checkedCities: [{ required: true, message: "请选择套餐类型", trigger: "change" }],
+        property: [{ required: true, message: "请选择产业名称", trigger: "change" }],
+        modality: [{ required: true, message: "请选择调研形式", trigger: "change" }],
+        dayNumber: [{ required: true, message: "请选择调研天数", trigger: "change" }],
+        Poster: [{ required: true, message: "请上传行程", trigger: "change" }],
+      },
+      dialogImageUrl: "",
+      dialogVisible: false,
+      chartPermissionList: [],
+      defaultProps: {
+        label: "PermissionName",
+        children: "List",
+        value: "ChartPermissionId",
+      },
+      markOptions: [],
+      industryArr: [],
+      radioTemporary: false, //临时标签
+      valTemporary: "", //标签名称
+      cities: [],
+      isIndeterminate: false,
+      dialogVisibleSubject: false,
+      addSubjectName: "",
+      addSubjectOptions: "",
+      nameSubjectOptions: [],
+      isShowSubject: false,
+      ListSubject: [],
+      checkedCitiesTwo: "",
+      modalityRadio: [
+        { name: "线上", id: 1 },
+        { name: "线下", id: 2 },
+      ],
+      publishStatus: true,
+      addSubjectData: [],
+      isDayNumber: [1, 2, 3, 4, 5],
+      isDateTime: [],
+    };
+  },
+  computed: {
+    uploadDisabled: function () {
+      return this.ruleForm.Poster.length > 0;
+    },
+  },
+  watch: {
+    radioTemporary() {
+      if (this.radioTemporary) {
+        this.selectDisabled = true;
+      } else {
+        this.valTemporary = "";
+        this.selectDisabled = false;
+      }
+    },
+    "ruleForm.modality": {
+      handler(newval) {
+        if (newval == 1) {
+          this.ruleForm.city = "";
+        }
+      },
+      deep: true,
+    },
+  },
+  created() {},
+  mounted() {
+    this.customerTypelist();
+    this.chartPermission();
+    this.getIndustry();
+    if (this.$route.query.id) {
+      this.themeDetails(this.$route.query.id);
+    }
+    if (this.$route.query.isShow == 1) {
+      this.publishStatus = false;
+    }
+  },
+  methods: {
+    //获取行业
+    chartPermission() {
+      raiInterface.getActivitySpecial().then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    /* 获取全部的行业 */
+    getIndustry() {
+      raiInterface.getListIndustrial().then((res) => {
+        if (res.Ret === 200) {
+          this.industryArr = res.Data.List || [];
+        }
+      });
+    },
+    //点击添加标的的下拉选择框
+    markSelectFocus() {
+      if (!this.ruleForm.property.length) {
+        this.$message.error("请先选择产业");
+      } else {
+        let arr = [];
+        arr = this.ruleForm.property.map((item) => {
+          return item[1];
+        });
+        raiInterface
+          .getindustrialSubjectlistIds({
+            IndustrialManagementIdStr: arr.join(","),
+          })
+          .then((res) => {
+            if (res.Ret === 200) {
+              this.markOptions = res.Data.List || [];
+            }
+          });
+      }
+    },
+    //获取多选的客户列表
+    customerTypelist() {
+      raiInterface.customerTypelist({ IsZxdy: true }).then((res) => {
+        if (res.Ret === 200) {
+          this.ruleForm.checkedCities = res.Data.List && res.Data.List.map((item) => item.CustomerTypeId);
+          this.cities = res.Data.List;
+        }
+      });
+    },
+    // 上传成功回调
+    handleUploadPosterSuccess(response, file, fileList) {
+      let upload_list = [];
+      fileList.forEach((item) => {
+        let obj = {
+          ...item,
+          response: process.env.NODE_ENV === "production" ? JSON.parse(CryptoJS.Des3Decrypt(item.response)) : item.response,
+        };
+        upload_list.push(obj);
+      });
+      this.ruleForm.Poster = upload_list.map((item) => {
+        return { name: item.response.Data.ResourceName, ...item };
+      });
+    },
+    // 删除上传的
+    handlePosterRemove(file, fileList) {
+      this.ruleForm.Poster = fileList;
+    },
+    //预览查看
+    handlePictureCardPreview(file) {
+      this.dialogImageUrl = file.url;
+      this.dialogVisible = true;
+    },
+    //全选框
+    handleCheckAllChange(val) {
+      if (val) {
+        let newCodeList = this.cities.map((item) => item.CustomerTypeId);
+        this.ruleForm.checkedCities = newCodeList;
+      } else {
+        this.ruleForm.checkedCities = [];
+      }
+      this.checkedCitiesTwo = this.ruleForm.checkedCities.join(",");
+      this.isIndeterminate = false;
+    },
+    //全选框
+    handleCheckedCitiesChange(value) {
+      let checkedCount = value.length;
+      this.ruleForm.checkAll = checkedCount === this.cities.length;
+      this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
+    },
+    //弹框的删除标的
+    async remoteMethod(query) {
+      if (query !== "") {
+        const res = await raiInterface.industrialSubjectSearch({
+          KeyWord: query,
+        });
+        if (res.Ret === 200) {
+          this.addSubjectOptions = res.Data.List || [];
+        }
+      }
+    },
+    //弹框的表的 change 事件
+    async searchInfo(val) {
+      if (val !== "") {
+        const res = await raiInterface.industrialSubjectSearchInfo({
+          KeyWord: val,
+        });
+        if (res.Ret === 200) {
+          this.isShowSubject = res.Data.List ? false : true;
+          let arrList = [];
+          arrList = res.Data.List
+            ? res.Data.List.map((item) => {
+                let arr = [];
+                item.List.forEach((key) => {
+                  arr.push(key.Name);
+                });
+                return {
+                  ...item,
+                  value: arr.join(","),
+                };
+              })
+            : [];
+          this.nameSubjectOptions = arrList;
+        }
+      } else {
+        this.nameSubjectOptions = [];
+      }
+    },
+    //获取调研主题详情
+    async themeDetails(id) {
+      const res = await raiSpecial.specialDetail({ ActivityId: id });
+      if (res.Ret === 200) {
+        let { Data } = res;
+        let checkedCount = Data.CustomerTypeIds ? res.Data.CustomerTypeIds.split(",").length : "";
+        this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
+        let checkAll = checkedCount === this.cities.length;
+        this.ruleForm = {
+          theme: Data.ResearchTheme, //主题
+          industry: Data.ChartPermissionName, //行业
+          property: Data.ListIndustrial ? Data.ListIndustrial.map((item) => [item.ChartPermissionId, item.IndustrialManagementId]) : [], //产业
+          mark: Data.ListSubject ? Data.ListSubject.map((item) => item.IndustrialSubjectId) : [], //标的
+          checkAll, ////套餐类型
+          checkedCities: Data.CustomerTypeIds.split(",").map((item) => Number(item)), //套餐类型
+          Poster: Data.TripImgLinkFix ? [{ name: "xxx.jpeg", url: Data.TripImgLinkFix }] : [],
+          modality: Data.SpecialType,
+          city: Data.City,
+          isMark: Data.IsShowSubjectName == 1 ? true : false,
+          dayNumber: Data.Days > 0 ? Data.Days : null,
+          host: Data.Host,
+          personCharge: Data.PersonInCharge,
+          restrictNum: Data.LimitPeopleNum > 0 ? Data.LimitPeopleNum : null,
+        };
+
+        this.isDateTime = Data.DateYmdList;
+        this.valTemporary = Data.TemporaryLabel;
+        this.radioTemporary = this.valTemporary ? true : false;
+        Data.TemporarySubject &&
+          Data.TemporarySubject.split(",").forEach((item) => {
+            this.addSubjectData.push({ subjectVal: item });
+          });
+        if (this.ruleForm.mark.length) {
+          this.markSelectFocus();
+        }
+      }
+    },
+    handleCloseSubject() {
+      this.nameSubjectOptions = [];
+      this.addSubjectName = "";
+      this.addSubjectOptions = [];
+      this.dialogVisibleSubject = false;
+    },
+    //保持或者发布
+    submitForm(type) {
+      let isTimeArr = [];
+      let isDate = false;
+      this.isDateTime &&
+        this.isDateTime.forEach((item) => {
+          if (!item.DateYmd) {
+            isDate = true;
+          }
+          let isTrue = item.DateHmsList.some((key) => !key.DateHms);
+          isTimeArr.push(isTrue);
+        });
+      if (isDate || isTimeArr.includes(true)) {
+        this.$message.error("请填写调研时间");
+        return;
+      }
+      if (this.selectDisabled) {
+        if (!this.valTemporary) return this.$message.error("请输入临时标签");
+        let validateFieldList = [];
+        this.$refs.ruleFormList.validateField(
+          ["industry", "personCharge", "host", "dayNumber", "theme", "checkedCities", "Poster", "modality", "restrictNum"],
+          (valid) => {
+            validateFieldList.push(valid);
+          }
+        );
+        if (this.ruleForm.modality == 2 && !this.ruleForm.city) {
+          return this.$message.error("请输入调研城市");
+        }
+        let isPost = validateFieldList.every((item) => item === "");
+        if (isPost) {
+          this.postPublish(type);
+        }
+      } else {
+        this.$refs.ruleFormList.validate((valid) => {
+          if (valid) {
+            if (this.ruleForm.modality == 2 && !this.ruleForm.city) {
+              return this.$message.error("请输入调研城市");
+            }
+            this.postPublish(type);
+          } else {
+            return false;
+          }
+        });
+      }
+    },
+    async postPublish(type) {
+      let arr = this.ruleForm.property.map((item) => {
+        return item[1];
+      });
+      let PosterList = this.ruleForm.Poster.map((item) => {
+        if (item.response) {
+          return item.response.Data.ResourceUrl;
+        } else {
+          return item.url;
+        }
+      });
+      let subjectData = [];
+      this.addSubjectData.forEach((item) => subjectData.push(item.subjectVal));
+      const res = await raiSpecial.postSpecialTripPreserveAndPublish({
+        ActivityId: Number(this.$route.query.id) || 0,
+        CustomerTypeIds: this.ruleForm.checkedCities.join(","),
+        TemporaryLabel: this.valTemporary,
+        TripImgLinkFix: PosterList.join(","),
+        IndustrialSubjectIdS: this.ruleForm.mark.join(","),
+        IndustrialManagementIdS: arr.join(","),
+        PermissionName: this.ruleForm.industry,
+        ResearchTheme: this.ruleForm.theme,
+        SpecialType: this.ruleForm.modality,
+        City: this.ruleForm.city,
+        IsShowSubjectName: this.ruleForm.isMark ? 1 : 0,
+        TemporarySubject: subjectData.join(","),
+        Days: this.ruleForm.dayNumber,
+        DateYmdList: this.isDateTime,
+        Host: this.ruleForm.host,
+        PersonInCharge: this.ruleForm.personCharge,
+        LimitPeopleNum: +this.ruleForm.restrictNum,
+      });
+      if (res.Ret === 200) {
+        this.$message.success("操作成功");
+        this.$router.back();
+      }
+    },
+    //点击取消的事件
+    cancelBtn() {
+      this.$router.back();
+    },
+    //点击添加标的
+    addLabelClick() {
+      this.addSubjectData.push({ subjectVal: "" });
+    },
+    //删除新增的主题标签
+    deleteSubject(index, item) {
+      this.addSubjectData.splice(index, 1);
+    },
+    dayChangeHandel() {
+      let arr = [];
+      if (this.ruleForm.dayNumber) {
+        for (let i = 0; i < this.ruleForm.dayNumber; i++)
+          arr.push({
+            DateYmd: "",
+            DateHmsList: [{ DateHms: "" }],
+          });
+      }
+      this.isDateTime = arr;
+    },
+    addDayList(item, key) {
+      item.DateHmsList.push({ DateHms: "" });
+    },
+    deleteDayList(item, index) {
+      item.DateHmsList.splice(index, 1);
+    },
+    dateHmsChange(key, index, item) {
+      if (index > 0) {
+        let onwTime = item.DateHmsList[index - 1].DateHms[1].replace(":", "");
+        let twoTime = key.DateHms && key.DateHms[0].replace(":", "");
+        if (onwTime && twoTime && onwTime >= twoTime) {
+          this.$message.error("下一个时间段必须晚于上一个时间段!");
+          key.DateHms = "";
+        }
+      }
+    },
+  },
+};
+</script>
+<style lang="scss">
+.el-form-item__label:before {
+  display: none;
+}
+.el-upload {
+  width: 100px;
+  height: 100px;
+  line-height: 100px;
+}
+.disabled .el-upload--picture-card {
+  display: none;
+}
+.custom-addPoster {
+  background-color: rgba(0, 0, 0, 0) !important;
+  box-shadow: none !important;
+  width: 70%;
+  .el-dialog__header {
+    display: none;
+  }
+  .el-dialog__body {
+    padding: 0 !important;
+  }
+}
+</style>
+<style scoped lang="scss">
+.determine-travel {
+  .subject-text {
+    padding-top: 20px;
+  }
+  .addPoster-img {
+    width: 100%;
+    height: 75vh;
+    img {
+      height: 100%;
+    }
+  }
+  .day-content {
+    padding-left: 30px;
+    .day-item {
+      margin-bottom: 10px;
+      display: flex;
+      .day-nub {
+        margin-right: 23px;
+        line-height: 40px;
+      }
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/specialResearch/interestAllPreview.vue

@@ -0,0 +1,157 @@
+<template>
+  <div class="container-interest">
+    <el-card>
+      <el-table :data="dataList" style="width: 100%; margin-top: 20px" border>
+        <el-table-column width="" prop="CompanyName" align="center" label="客户名称"> </el-table-column>
+        <el-table-column width="100" prop="SellerName" align="center" label="所属销售"> </el-table-column>
+        <el-table-column min-width="100" prop="RealName" align="center" label="姓名"> </el-table-column>
+        <el-table-column prop="ResearchTheme" align="center" label="调研主题">
+          <template slot-scope="{ row }">
+            <span class="editsty" @click="themeDetails(row.ActivityId)">{{ row.ResearchTheme }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column width="80" prop="ChartPermissionName" align="center" label="行业"> </el-table-column>
+        <el-table-column prop="Label" align="center" label="标签"> </el-table-column>
+        <el-table-column width="180" prop="PublishDate" align="center" label="发布时间"> </el-table-column>
+        <el-table-column width="180" prop="CreateTime" align="center" label="反馈时间"> </el-table-column>
+      </el-table>
+
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <el-dialog width="1000px" v-dialogDrag :modal-append-to-body="false" center :title="dialogTitle" :visible.sync="dialogVisibleActivity" :before-close="handleCloseSubject">
+      <div class="rai-detail-wrap" v-if="dialogTitle == '活动详情'">
+        <div class="activity-top">
+          {{ activityDetail.ResearchTheme }}
+        </div>
+        <p>所属行业： {{ activityDetail.ChartPermissionName }}</p>
+        <p>预期时间： {{ activityDetail.ActivityTimeText }}</p>
+        <p>调研形式： {{ activityDetail.SpecialType == 1 ? "线上" : "线下" }} {{ activityDetail.SpecialType == 2 && activityDetail.City ? "(" + activityDetail.City + ")" : "" }}</p>
+        <template v-if="!activityDetail.IndustrialName && !activityDetail.IndustrialSubjectName">
+          <p>相关主题： {{ activityDetail.Label }}</p>
+        </template>
+        <template v-else>
+          <p>产业名称： {{ activityDetail.IndustrialName }}</p>
+          <p>相关公司： {{ activityDetail.IndustrialSubjectName }}</p>
+        </template>
+        <div class="text-box">
+          <div style="flex-shrink: 0">活动可见：</div>
+          <div>
+            <span>{{ activityDetail.CustomerName }}</span>
+            <div>
+              <span v-if="activityDetail.Scale.includes('3')"> 100亿以上</span>
+              <span v-if="activityDetail.Scale.includes('2')"> 150~100亿</span>
+            </div>
+          </div>
+        </div>
+        <el-image style="width: 0px; height: 0px" :src="activityDetail.TripImgLink" id="TripImgLink" :preview-src-list="previewList"></el-image>
+        <div class="arrange" @click.stop="imgLink">
+          查看行程安排
+          <i class="el-icon-d-arrow-right"></i>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface, raiSpecial } from "@/api/api.js";
+
+export default {
+  name: "",
+  components: { mPage },
+  props: {},
+  data() {
+    return {
+      dataList: [],
+      page_no: 1,
+      total: "",
+      pageSize: 10,
+      previewList: [],
+      activityDetail: {},
+      dialogVisibleActivity: false,
+      dialogTitle: "",
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    this.getList();
+  },
+  methods: {
+    //获取数据
+    async getList() {
+      const res = await raiSpecial.getSpecialSpecialList({
+        PageSize: this.pageSize,
+        CurrentIndex: this.page_no,
+      });
+      if (res.Ret === 200) {
+        this.dataList = res.Data.List;
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getList();
+    },
+    //获取调研主题详情
+    async themeDetails(id) {
+      const res = await raiSpecial.specialDetail({ ActivityId: id });
+      if (res.Ret === 200) {
+        this.previewList = [];
+        this.activityDetail = res.Data;
+        this.dialogVisibleActivity = true;
+        this.dialogTitle = "活动详情";
+        this.previewList.push(this.activityDetail.TripImgLink);
+      }
+    },
+    //预览图片
+    imgLink() {
+      $("#TripImgLink").click();
+    },
+    //弹框的关闭
+    handleCloseSubject() {
+      this.dialogVisibleActivity = false;
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-interest {
+  .rai-detail-wrap {
+    .activity-top {
+      width: 100%;
+      height: 55px;
+      background: #f4f4f4;
+      border-radius: 4px 4px 4px 4px;
+      opacity: 1;
+      line-height: 55px;
+      padding-left: 23px;
+      margin-bottom: 30px;
+    }
+    p {
+      margin-bottom: 20px;
+      padding-left: 10px;
+    }
+    .arrange {
+      margin: 50px auto 20px;
+      cursor: pointer;
+      text-align: center;
+      color: #3385ff;
+    }
+    .text-box {
+      display: flex;
+      padding-left: 10px;
+      span {
+        display: block;
+        margin-bottom: 10px;
+      }
+    }
+  }
+}
+</style>

src/views/rai_manage/activityManage/specialResearch/particularsAll.vue

@@ -0,0 +1,190 @@
+<template>
+  <div class="container-particulars">
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      :append-to-body="true"
+      :visible.sync="particularsDialogVisible"
+      :before-close="okBtn"
+      :width="subscribe == '报名失败详情' ? '1000px' : '1100px'"
+    >
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.warntop" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">报名人数</span>
+      </div>
+      <div class="content-box">
+        <div class="top-text" style="margin-bottom: 20px">
+          <template v-if="memberType == 'Admin'"> 共有{{ total }}人报名</template>
+          <template v-else-if="memberType == 'Sale'"> 共有{{ total }}人报名，其中本人名下客户{{ myTotal }}人 </template>
+          <template v-else> 共有{{ total }}人报名，其中本组名下客户{{ myTotal }}人 </template>
+        </div>
+        <div class="table-box">
+          <el-table height="400px" :data="dataList" border style="width: 100%">
+            <el-table-column min-width="80" align="center" prop="RealName" key="name" label="姓名"></el-table-column>
+            <el-table-column v-if="dialogVisibleList.SpecialType == 1" min-width="115" align="center" prop="Mobile" key="mobile" label="手机号"></el-table-column>
+            <el-table-column v-if="dialogVisibleList.SpecialType == 1" min-width="140" align="center" key="outboundMobile" label="外呼号码">
+              <template slot-scope="scope">
+                <span>{{ scope.row.OutboundMobile }}</span>
+                <img @click="modification(scope.row.Id, scope.row.OutboundMobile)" :src="$icons.amend" style="color: #fff; width: 12px; height: 12px; margin-left: 5px; vertical-align: middle" />
+              </template>
+            </el-table-column>
+            <el-table-column min-width="135" align="center" prop="CompanyName" key="company" label="公司名称"></el-table-column>
+            <el-table-column min-width="110" align="center" prop="SellerName" key="seller" label="所属销售"></el-table-column>
+            <el-table-column min-width="160" align="center" prop="CreateTime" key="seller" label="报名时间"></el-table-column>
+            <el-table-column min-width="135" align="center" prop="" key="cz1" label="操作">
+              <template slot-scope="scope">
+                <span class="editsty" @click="cancelApply(scope.row)">取消报名</span>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <div style="margin: 10px 0">
+          <span style="margin-left: 30px">
+            <a :href="exportUser" download>
+              <el-button type="primary">下载名单</el-button>
+            </a>
+          </span>
+          <el-button style="margin-left: 30px" type="primary" plain @click="okBtn">知道了</el-button>
+        </div>
+      </div>
+    </el-dialog>
+    <edit-mobile :editMobileDialogVisible.sync="editMobileDialogVisible" :editMobileId="editMobileId" :outboundMobile="outboundMobile" isType="专项" />
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+import EditMobile from "../../components/editMobile.vue";
+export default {
+  name: "",
+  components: { EditMobile },
+  props: {
+    particularsDialogVisible: {
+      type: Boolean,
+      default: false,
+    },
+    subscribe: {
+      type: String,
+      default: "报名详情",
+    },
+    dialogVisibleList: {
+      type: Object,
+    },
+  },
+  data() {
+    return {
+      dataList: [], //表格
+      total: "",
+      myTotal: "",
+      memberType: "",
+      editMobileDialogVisible: false, //
+      editMobileId: "", //
+      outboundMobile: "",
+      isFullNum: false, //报名人数是否已满
+    };
+  },
+  computed: {
+    exportUser() {
+      let param_token = localStorage.getItem("auth") || "";
+      return process.env.API_ROOT + "/cygx/special/tripList?ActivityId=" + this.dialogVisibleList.ActivityId + "&IsExport=" + true + "&" + param_token;
+    },
+  },
+  watch: {
+    particularsDialogVisible: {
+      handler(newval) {
+        if (newval) {
+          this.getsDataList();
+        }
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    okBtn() {
+      this.$parent.particularsDialogVisible = false;
+    },
+    //列表表格
+    getsDataList() {
+      raiSpecial
+        .getSpecialtripList({
+          ActivityId: this.dialogVisibleList.ActivityId,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.$nextTick(() => {
+            this.dataList = res.Data.List;
+            this.total = res.Data.Total;
+            this.memberType = res.Data.MemberType;
+            this.myTotal = res.Data.MyTotal;
+          });
+        });
+    },
+
+    modification(id, value) {
+      this.editMobileDialogVisible = true;
+      this.editMobileId = id;
+      this.outboundMobile = value;
+    },
+    //取消报名
+    cancelApply(item) {
+      this.$confirm(`确定要取消该用户的报名吗？`, `取消报名`, {
+        confirmButtonText: "是",
+        cancelButtonText: "否",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = await raiSpecial.cancelSpecialtripList({
+            UserId: item.UserId,
+            ActivityId: item.ActivityId,
+          });
+          if (res.Ret !== 200) return;
+          this.$message({
+            type: "success",
+            message: `取消报名成功!`,
+          });
+          this.getsDataList();
+          this.$parent.getsDataList();
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消操作",
+          });
+        });
+    },
+  },
+};
+</script>
+<style lang="less">
+.container-particulars {
+  .table-box {
+    margin: 20px auto;
+  }
+  .top-text {
+    display: flex;
+    align-items: center;
+    div {
+      margin-left: 20px;
+    }
+  }
+  .el-radio {
+    margin-right: 15px !important;
+  }
+  .el-switch__label {
+    color: #606266;
+    font-size: 14px;
+    font-weight: 400;
+  }
+  .is-active {
+    color: #409eff !important;
+  }
+  .el-radio__label {
+    font-weight: 400;
+  }
+}
+</style>

src/views/rai_manage/activityManage/themeSurveyPage.vue

@@ -0,0 +1,105 @@
+<template>
+  <div class="container">
+    <el-card>
+      <div style="display: flex; justify-content: flex-end">
+        <el-button type="primary" @click="initiateVotingDlg = true">发起投票</el-button>
+      </div>
+    </el-card>
+    <el-card style="margin-top: 20px">
+      <div>
+        <el-table border :data="dataList">
+          <el-table-column align="center" prop="PublishTime" key="name" label="发布时间"></el-table-column>
+          <el-table-column align="center" prop="ActivityTypeName" key="name" label="活动类型"></el-table-column>
+          <el-table-column align="center" prop="EndTime" key="EndTime" label="投票截止时间"></el-table-column>
+          <el-table-column align="center" prop="ModifyTime" key="ModifyTime" label="更新时间"></el-table-column>
+          <el-table-column align="center" prop="State" key="State" label="状态">
+            <template slot-scope="{ row }">
+              <span :class="[row.State == '发布中' && 'editsty']">{{ row.State }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="RealName" key="name" label="投票结果">
+            <template slot-scope="{ row }">
+              <span class="editsty" @click="lookResultHandler(row, '查看')">查看</span>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="OtherThemeTotal" key="name" label="其余主题">
+            <template slot-scope="{ row }">
+              <span class="editsty" @click="lookResultHandler(row, '其余')">{{ row.OtherThemeTotal }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="RealName" key="name" label="操作">
+            <template slot-scope="{ row }">
+              <span v-if="row.State == '发布中'" class="editsty" @click="lookResultHandler(row, '编辑')">编辑</span>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <vote-dlg :initiateVotingDlg.sync="initiateVotingDlg" :rowForm.sync="rowForm" />
+    <voting-results-dlg :isVotinRgesultsDlg.sync="isVotinRgesultsDlg" :theRemainingThemeDlg.sync="theRemainingThemeDlg" :rowForm.sync="rowForm" />
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+import mPage from "@/components/mPage.vue";
+import VoteDlg from "./components/ThemeSurvey/voteDlg.vue";
+import VotingResultsDlg from "./components/ThemeSurvey/votingResultsDlg.vue";
+export default {
+  name: "",
+  components: { VoteDlg, VotingResultsDlg, mPage },
+  props: {},
+  data() {
+    return {
+      dataList: [],
+      page_no: 1,
+      total: 0,
+      initiateVotingDlg: false, // 发起投票的弹框
+      isVotinRgesultsDlg: false, // 投票结果的弹框
+      theRemainingThemeDlg: false, // 其余主题的弹框
+      rowForm: {},
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    this.getDataList();
+  },
+  methods: {
+    // 查看投票结果
+    lookResultHandler(item, type) {
+      this.rowForm = item;
+      console.log(this.rowForm, " this.rowForm");
+      if (type == "编辑") {
+        this.initiateVotingDlg = true;
+      } else if (type == "查看") {
+        this.isVotinRgesultsDlg = true;
+      } else {
+        this.theRemainingThemeDlg = true;
+      }
+    },
+    // 获取列表
+    async getDataList() {
+      const res = await raiInterface.questionnaireList({
+        PageSize: 10,
+        CurrentIndex: this.page_no,
+      });
+      if (res.Ret === 200) {
+        this.dataList = res.Data.List || [];
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getDataList();
+    },
+  },
+};
+</script>
+<style scoped lang="scss"></style>

src/views/rai_manage/components/addChoiceness.vue

@@ -0,0 +1,756 @@
+<template>
+  <!-- 报告精选添加/编辑 -->
+  <div class="add-choiceness">
+    <el-card>
+      <!-- 更新方式继承第几期 -->
+      <el-row :gutter="24">
+        <el-col :span="12">
+          <el-select v-model="updateMode" placeholder="请选择更新方式" clearable @change="updateModeChange">
+            <el-option label="重新编辑" value="重新编辑"></el-option>
+            <el-option label="继承往期" value="继承往期"></el-option>
+          </el-select>
+        </el-col>
+        <el-col :span="12">
+          <el-select v-if="updateMode == '继承往期'" v-model="inheritNum" placeholder="选择继承第几期" clearable @change="getDetail">
+            <el-option v-for="item in updateModeList" :key="item.Periods" :label="item.InheritPeriodsName" :value="item.Periods"></el-option>
+          </el-select>
+        </el-col>
+      </el-row>
+      <div v-show="updateMode">
+        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
+          <!-- 标题 / 作者 /发布时间 -->
+          <el-row :gutter="24" style="margin-top: 30px">
+            <el-col :span="12">
+              <el-form-item prop="title">
+                <el-input v-model="ruleForm.title" placeholder="请输入标题"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item prop="author">
+                <el-input v-model="ruleForm.author" placeholder="请输入作者"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item prop="time">
+                <el-date-picker type="date" placeholder="选择发布时间" value-format="yyyy-MM-dd" v-model="ruleForm.time"></el-date-picker>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <!-- 产品说明 -->
+          <el-form-item prop="explain" style="margin-top: 10px">
+            <el-input v-model="ruleForm.explain" placeholder="请输入产品说明"></el-input>
+          </el-form-item>
+          <!-- 变更说明 -->
+          <!-- 富文本 -->
+          <rich-text ref="oneRich" v-model="marketStrategy" :spareId="contentValue" :isText="contentText" />
+          <el-form-item prop="reportLink">
+            <div style="display: flex; align-items: center; margin-top: 10px">
+              <span style="flex-shrink: 0">详细报告链接：</span>
+              <el-input style="margin: 10px 0" v-model="ruleForm.reportLink" placeholder="请输入报告链接（弘则研报管理栏目下）"></el-input>
+            </div>
+          </el-form-item>
+        </el-form>
+        <!-- 产业/标的 模块 -->
+        <div class="content-module">
+          <draggable v-model="industryList" animation="300" @update="sortChange">
+            <div class="content-industry" v-for="(item, index) in industryList" :key="item.ChartPermissionId">
+              <div class="content-name" :class="industryIndex == index ? 'active' : ''" @click="industryBtn(item, index)">{{ item.ChartPermissionName }}</div>
+            </div>
+          </draggable>
+          <div v-for="(item, index) in industryList" :key="item.ChartPermissionId">
+            <div v-show="industryIndex == index">
+              <RichText v-model="item.BodyChartSummary" :ref="'logic' + index" :spareId="'logictest' + index" :isText="contentTextLogic" />
+              <draggable :list="item.List" animation="300" class="classification" filter=".addIndustrial" :move="onMove" @update="ificationSortChange">
+                <div v-for="(val, num) in item.List" :key="val.IndustrialSubjectId" class="industrial" @click="ificationIndustrialBtn(val, num)" :class="num == ificationIndustrial ? 'pitch' : ''">
+                  <span style="margin-right: 19px">{{ val.IndustrialSubjectName }}</span>
+                  <span v-if="num == ificationIndustrial">
+                    <img src="~@/assets/img/icons/edit1.png" style="width: 12px; height: 12px; marginright: 10px" @click="editText(val, num)" />
+                    <i class="el-icon-close" @click="deleteClassify(val, num)"></i>
+                  </span>
+                </div>
+                <div class="addIndustrial" @click="addMulti" v-if="industryIndex == index">
+                  <i class="el-icon-plus"></i>
+                  <span>添加标的</span>
+                </div>
+              </draggable>
+              <template v-for="(val, num) in item.List">
+                <div :key="val.IndustrialSubjectId" v-show="industryIndex == index">
+                  <div class="industrial-is-new" v-show="num == ificationIndustrial">
+                    <el-checkbox v-model="val.IsNew" :true-label="1" :false-label="0">显示new标签</el-checkbox>
+                  </div>
+                  <div style="margin-bottom: 20px; display: flex; align-items: center" v-show="num == ificationIndustrial">
+                    <div style="display: flex; align-items: center" v-for="(son, num) in val.CompanyLabel" :key="num">
+                      <el-input style="width: 260px; margin-right: 15px" v-model="son.name" placeholder="请输入公司标签"></el-input>
+                      <img class="delete-item-icon" v-if="num > 0" @click="deleteLabelItem(val, num)" src="~@/assets/img/icons/delete-Item.png" alt="" />
+                    </div>
+                    <el-tooltip class="item" effect="dark" content="添加标签" placement="top-start">
+                      <img @click="addLabelClick(val)" class="editsty" src="~@/assets/img/set_m/add_ico.png" />
+                    </el-tooltip>
+                  </div>
+                  <rich-text :ref="'twoRich' + num" v-model="val.Body" :spareId="contentValueTwo" :isText="contentTextTwo" v-show="num == ificationIndustrial" />
+                </div>
+              </template>
+            </div>
+          </div>
+        </div>
+
+        <div>
+          <div class="content-resource">
+            <span class="resource">产业资源包：</span>
+            <span class="show">{{ industrialSubjectName }}</span>
+          </div>
+          <div class="content-resource">
+            <span class="resource">综述报告：</span>
+            <span class="show">{{ overviewList.Title }}</span>
+            <div style="margin-left: 20px">
+              <el-switch @change="switchChangeHandler" v-model="overviewList.IsShowOverviewArticle" :active-value="1" :inactive-value="0" active-text="显示链接" inactive-text="不显示链接">
+              </el-switch>
+            </div>
+          </div>
+        </div>
+        <div class="content-bottom">
+          <el-button type="primary" @click="confirm('预览')">预览</el-button>
+          <el-button type="primary" @click="confirm('保存')">保存</el-button>
+          <el-button v-if="isShowStatus" type="primary" @click="confirm('发布')">发布</el-button>
+          <el-button type="" @click="cancel">取消</el-button>
+        </div>
+      </div>
+    </el-card>
+    <!-- 弹框部分 -->
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center :visible.sync="addDialogVisible" width="560px" :before-close="handleClose">
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="dialogText == '编辑' ? $icons.editicon : $icons.add" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">{{ dialogText }}</span>
+      </div>
+      <div class="dlg-content">
+        <el-autocomplete class="inline-input" v-model="stateValue" :trigger-on-focus="false" :fetch-suggestions="handleSearchResult" placeholder="请输入标的名称" clearable></el-autocomplete>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button v-if="dialogText == '编辑'" type="primary" @click="editconfirmPerson">确定</el-button>
+        <el-button v-else type="primary" @click="confirmPerson">确定</el-button>
+        <el-button @click="handleClose">取消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import RichText from "./richText.vue";
+import { raiInterface } from "@/api/api.js";
+import draggable from "vuedraggable";
+import TemplateMessage from "./apply/templateMessage.vue";
+
+export default {
+  name: "",
+  components: { RichText, draggable, TemplateMessage },
+  props: {},
+  data() {
+    return {
+      contentValue: "one",
+      contentText: "市场策略核心逻辑汇总",
+      contentValueTwo: "two",
+      contentTextTwo: "公司核心逻辑汇总",
+      contentTextLogic: "行业核心逻辑汇总",
+      updateMode: "", //更新方式
+      inheritNum: "", //继承第几
+      ruleForm: {
+        title: "", //标题
+        author: "", //作者
+        time: "", //时间
+        explain: "", //说明
+        reportLink: "", //变更
+      },
+      rules: {
+        title: [{ required: true, message: "请输入标题", trigger: "blur" }],
+      },
+      industryList: [], //行业
+      industryIndex: 0, //
+      ificationIndustrial: 0,
+      addDialogVisible: false,
+      dialogText: "",
+      stateValue: "",
+      companyList: [],
+      timeout: null,
+      isShowStatus: true,
+      industrialSubjectName: "",
+      chartPermissionId: "", //分类id
+      subjectList: [],
+      updateModeList: [], //期数的数组
+      editNum: "",
+      overviewList: {},
+      marketStrategy: "",
+      timeInterval: null, // 定时器
+    };
+  },
+  computed: {},
+  mounted() {
+    if (this.$route.query.id) {
+      this.isShowStatus = this.$route.query.status == 0;
+      this.getDetail();
+    } else {
+      this.getNoTacticsfirst();
+      this.dataInit();
+    }
+    this.getListPeriods();
+  },
+  methods: {
+    // 报告的缓存处理数据
+    dataInit() {
+      if (sessionStorage.getItem("addChoicenessQY")) {
+        let data = JSON.parse(sessionStorage.getItem("addChoicenessQY"));
+        setTimeout(async () => {
+          this.industryList = data.industryList;
+          this.industryIndex = data.industryIndex;
+          this.ificationIndustrial = data.ificationIndustrial;
+          this.updateMode = data.updateMode;
+          this.inheritNum = data.inheritNum;
+          this.companyList = data.companyList;
+          this.industrialSubjectName = data.industrialSubjectName;
+          this.chartPermissionId = data.chartPermissionId;
+          this.subjectList = data.subjectList;
+          this.updateModeList = data.updateModeList;
+          this.editNum = data.editNum;
+          this.overviewList = data.overviewList;
+          this.ruleForm = data.ruleForm;
+          this.marketStrategy = data.MarketStrategy;
+        }, 200);
+      }
+      this.timeInterval = setInterval(() => {
+        let params = {
+          industryList: this.industryList,
+          industryIndex: this.industryIndex,
+          ificationIndustrial: this.ificationIndustrial,
+          updateMode: this.updateMode,
+          inheritNum: this.inheritNum,
+          companyList: this.companyList,
+          industrialSubjectName: this.industrialSubjectName,
+          chartPermissionId: this.chartPermissionId,
+          subjectList: this.subjectList,
+          updateModeList: this.updateModeList,
+          editNum: this.editNum,
+          overviewList: this.overviewList,
+          ruleForm: this.ruleForm,
+          MarketStrategy: this.marketStrategy,
+        };
+        sessionStorage.setItem("addChoicenessQY", JSON.stringify(params));
+      }, 120000);
+    },
+    updateModeChange() {
+      if (this.updateMode == "重新编辑") {
+        this.init();
+        this.industryList = [];
+        this.getNoTacticsfirst();
+      }
+    },
+    //获取编辑详情
+    async getDetail() {
+      const res = await raiInterface.reportSelectionDetail({ ArticleId: this.$route.query.id || "", Periods: this.inheritNum || "" });
+      if (res.Ret === 200) {
+        res.Data.List.forEach((item) => {
+          if (!item.List || !item.List.length > 0) {
+            item.List = [];
+          }
+        });
+        this.updateMode = this.inheritNum ? this.updateMode : res.Data.AddType == "1" ? "重新编辑" : "继承往期";
+        this.ruleForm = {
+          title: res.Data.Title, //标题
+          author: res.Data.Department, //作者
+          time: res.Data.PublishDate, //时间
+          explain: res.Data.ProductDescription, //说明
+          reportLink: res.Data.ReportLink, //变更
+        };
+        this.marketStrategy = res.Data.MarketStrategy;
+        this.inheritNum = this.inheritNum ? this.inheritNum : res.Data.InheritPeriods;
+        this.industryList = res.Data.List;
+        setTimeout(() => {
+          res.Data.List.forEach((item, index) => {
+            item.List.forEach((key, i) => {
+              key.CompanyLabel = key.CompanyLabel
+                ? key.CompanyLabel.map((val, i) => {
+                    let obj = {
+                      name: val,
+                      value: i + 1,
+                    };
+                    return obj;
+                  })
+                : [
+                    {
+                      name: "",
+                      value: 1,
+                    },
+                  ];
+            });
+          });
+        }, 300);
+        this.chartPermissionId = res.Data.List[0].ChartPermissionId;
+        this.industrialSubjectName = res.Data.List[0].List ? res.Data.List[0].List[0].IndustrialManagementName : "";
+        this.overviewList = {
+          ArticleId: res.Data.List[0].List && res.Data.List[0].List[0].OverviewArticleId,
+          Title: res.Data.List[0].List && res.Data.List[0].List[0].OverviewArticleTitle,
+          IsShowOverviewArticle: res.Data.List[0].List && res.Data.List[0].List[0].IsShowOverviewArticle,
+        };
+      }
+    },
+    //获取模版
+    async getNoTacticsfirst() {
+      const res = await raiInterface.reportSereportSelectiondDetailTemplate();
+      if (res.Ret === 200) {
+        this.industryList = res.Data.List;
+        this.chartPermissionId = res.Data.List[0].ChartPermissionId;
+      }
+    },
+    //点击产业的事件
+    industryBtn(item, index) {
+      if (index !== this.industryIndex) {
+        this.industryIndex = index;
+        this.chartPermissionId = item.ChartPermissionId;
+        this.ificationIndustrial = 0;
+      }
+    },
+    //标的的点击事件 处理
+    ificationIndustrialBtn(item, index) {
+      if (index !== this.ificationIndustrial) {
+        this.ificationIndustrial = index;
+        this.industrialSubjectName = item.IndustrialManagementName || "";
+        this.overviewList = {
+          ArticleId: item.OverviewArticleId,
+          Title: item.OverviewArticleTitle,
+          IsShowOverviewArticle: item.IsShowOverviewArticle,
+        };
+      }
+    },
+    //编辑标的
+    editText(item, index) {
+      this.dialogText = "编辑";
+      this.chartPermissionId = item.ChartPermissionId;
+      this.stateValue = item.IndustrialSubjectName;
+      this.addDialogVisible = true;
+      this.editNum = index;
+    },
+    //删除标的
+    deleteClassify(item, index) {
+      this.$confirm("确定要删除该标的吗？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.industryList[this.industryIndex].List.splice(index, 1);
+          this.ificationIndustrial = 0;
+          this.$message({
+            type: "success",
+            message: "删除成功!",
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+    //添加产业
+    addMulti() {
+      this.dialogText = "添加标的";
+      this.addDialogVisible = true;
+    },
+    //弹框的取消事件
+    handleClose() {
+      this.stateValue = "";
+      this.addDialogVisible = false;
+    },
+    //弹框的确认事件
+    async confirmPerson() {
+      if (this.stateValue) {
+        const arr = this.subjectList.find((item) => item.SubjectName === this.stateValue);
+        if (!arr) {
+          this.$message.error("输入正确的标的");
+          return;
+        }
+        let overviewList = {};
+        const res = await raiInterface.getReportSelectionArticle({
+          IndustrialSubjectId: arr.IndustrialSubjectId,
+        });
+        if (res.Ret === 200) {
+          overviewList = res.Data;
+        }
+        this.industryList.forEach((item) => {
+          if (item.ChartPermissionId == this.chartPermissionId) {
+            if (item.List.length > 0) {
+              var isNext = item.List.some((item) => item.IndustrialSubjectName == arr.SubjectName);
+            }
+            if (isNext) return this.$message.error("标的重复！");
+            item.List.push({
+              Body: "",
+              ChartPermissionId: this.chartPermissionId,
+              IndustrialManagementId: arr.IndustrialManagementId + "",
+              IndustrialManagementName: arr.IndustryName,
+              IndustrialSubjectId: arr.IndustrialSubjectId + "",
+              IndustrialSubjectName: arr.SubjectName,
+              CompanyLabel: [{ name: "", value: item.List.length + 1 }],
+              OverviewArticleId: overviewList.ArticleId,
+              OverviewArticleTitle: overviewList.Title,
+              IsShowOverviewArticle: overviewList.IsShowOverviewArticle,
+            });
+          }
+        });
+      }
+      this.stateValue = "";
+      this.addDialogVisible = false;
+    },
+    async editconfirmPerson() {
+      if (this.stateValue) {
+        const arr = this.subjectList.find((item) => item.SubjectName === this.stateValue);
+        if (!arr) {
+          this.$message.error("输入正确的标的");
+          return;
+        }
+        let overviewList = {};
+        const res = await raiInterface.getReportSelectionArticle({
+          IndustrialSubjectId: arr.IndustrialSubjectId,
+        });
+        if (res.Ret === 200) {
+          overviewList = res.Data;
+        }
+        this.industryList.forEach((item) => {
+          if (item.ChartPermissionId == this.chartPermissionId) {
+            if (item.List.length > 0) {
+              var isNext = item.List.some((item) => item.IndustrialSubjectName == arr.SubjectName);
+            }
+            if (isNext) return this.$message.error("标的重复！");
+            const obj = {
+              Body: this.$refs.twoRich.value || "",
+              ChartPermissionId: this.chartPermissionId,
+              IndustrialManagementId: arr.IndustrialManagementId + "",
+              IndustrialManagementName: arr.IndustryName,
+              IndustrialSubjectId: arr.IndustrialSubjectId + "",
+              IndustrialSubjectName: arr.SubjectName,
+              CompanyLabel:
+                item.List[this.editNum].CompanyLabel && item.List[this.editNum].CompanyLabel.length > 0 ? item.List[this.editNum].CompanyLabel : [{ name: "", value: item.List.length + 1 }],
+              OverviewArticleId: overviewList.ArticleId,
+              OverviewArticleTitle: overviewList.Title,
+              IsShowOverviewArticle: overviewList.IsShowOverviewArticle,
+            };
+            item.List.splice(this.editNum, 1, obj);
+          }
+        });
+      }
+      this.stateValue = "";
+      this.addDialogVisible = false;
+    },
+    // 申请内容搜索
+    async handleSearchResult(data, cb) {
+      if (data) {
+        cb([]);
+        let res = await raiInterface.industrialSubjectSearch({ KeyWord: data, ChartPermissionId: this.chartPermissionId });
+        if (res.Ret === 200) {
+          if (res.Data.List && res.Data.List.length > 0) {
+            let arr = res.Data.List.map((item) => {
+              return { value: item.SubjectName, ...item };
+            });
+            this.subjectList = arr;
+            cb(arr);
+          }
+        }
+      }
+    },
+    //保存 发布
+    confirm: _.debounce(function (type) {
+      this.$refs.ruleForm.validate(async (val) => {
+        if (val) {
+          let isText = [];
+          this.industryList.forEach((item) => {
+            item.List.forEach((key) => {
+              key.CompanyLabel && key.CompanyLabel.length > 0 && isText.push(key.CompanyLabel.some((val) => val.name));
+            });
+          });
+          if (isText && isText.includes(false)) {
+            return this.$message.error("请输入公司标签");
+          }
+          let params = this.dataHandle(type);
+          if (type == "预览") {
+            sessionStorage.setItem("choicenessPre", JSON.stringify(params));
+            let { href } = this.$router.resolve({ name: "预览报告精选" });
+            window.open(href, "_blank");
+          } else {
+            const res = await raiInterface.industrialSubjectPreserveAndPublish(params);
+            if (res.Ret === 200) {
+              clearInterval(this.timeInterval);
+              sessionStorage.removeItem("addChoicenessQY");
+              this.$message.success("操作成功!");
+              this.init();
+              this.$router.back();
+            }
+          }
+        }
+      });
+    }, 500),
+    //取消
+    cancel() {
+      clearInterval(this.timeInterval);
+      sessionStorage.removeItem("addChoicenessQY");
+      this.$refs["ruleForm"].resetFields();
+      this.$router.back();
+    },
+    async getListPeriods() {
+      const res = await raiInterface.industrialSubjectListPeriods();
+      if (res.Ret === 200) {
+        this.updateModeList = res.Data.List || [];
+      }
+    },
+    init() {
+      this.ruleForm = {
+        title: "", //标题
+        author: "", //作者
+        time: "", //时间
+        explain: "", //说明
+        reportLink: "", //变更
+      };
+      this.$refs["ruleForm"].resetFields();
+      this.marketStrategy = "";
+    },
+    // 标的下添加公司标签
+    addLabelClick(item) {
+      item.CompanyLabel.push({ name: "", value: item.CompanyLabel.length + 1 });
+    },
+    // 处理保存的数据
+    dataHandle(type) {
+      let industryList = _.cloneDeep(this.industryList);
+      const arr = [];
+      let ListChartSummary = [];
+      industryList.forEach((item) => {
+        item.List.forEach((key) => {
+          key.CompanyLabel && (key.CompanyLabel = key.CompanyLabel.map((val) => val.name));
+          arr.push(key);
+        });
+        ListChartSummary.push({
+          ChartPermissionId: item.ChartPermissionId,
+          BodyChartSummary: item.BodyChartSummary,
+          ChartPermissionName: item.ChartPermissionName,
+          ListSubject: [...item.List],
+        });
+      });
+      if (this.marketStrategy == "") {
+        this.$message.error("市场策略核心逻辑汇总不能为空");
+      }
+      let params = {
+        AddType: this.updateMode == "重新编辑" ? "1" : "2",
+        ArticleId: this.$route.query.id ? Number(this.$route.query.id) : 0,
+        Department: this.ruleForm.author,
+        Title: this.ruleForm.title,
+        DoType: type == "发布" ? 1 : 0,
+        MarketStrategy: this.marketStrategy,
+        InheritPeriods: this.inheritNum,
+        List: arr,
+        ProductDescription: this.ruleForm.explain,
+        PublishDate: this.ruleForm.time,
+        ReportLink: this.ruleForm.reportLink,
+        ListChartSummary,
+      };
+      return params;
+    },
+    deleteLabelItem(item, index) {
+      item.CompanyLabel.splice(index, 1);
+    },
+    switchChangeHandler(e) {
+      this.industryList.forEach((_) => {
+        _.List.forEach((item) => {
+          if (item.OverviewArticleId === this.overviewList.ArticleId) {
+            item.IsShowOverviewArticle = e;
+          }
+        });
+      });
+    },
+    // 拖拽排序更新
+    sortChange({ oldIndex, newIndex }) {
+      this.industryIndex = this.sortChangeFun(this.industryIndex, oldIndex, newIndex);
+    },
+    //标的拖拽排序更新
+    ificationSortChange({ oldIndex, newIndex }) {
+      this.ificationIndustrial = this.sortChangeFun(this.ificationIndustrial, oldIndex, newIndex);
+    },
+    // 排序更新后的逻辑
+    sortChangeFun(currentIndex, oldIndex, newIndex) {
+      let bigger, smaller;
+      if (oldIndex > newIndex) {
+        bigger = oldIndex;
+        smaller = newIndex;
+      } else {
+        bigger = newIndex;
+        smaller = oldIndex;
+      }
+      // 当前算中tab的排序 小于较小的 大于较大的 则不用做变动
+      if (currentIndex < smaller || currentIndex > bigger) return currentIndex;
+      // 移动的是当前选中的
+      if (currentIndex == oldIndex) return newIndex;
+      if (oldIndex > newIndex) {
+        // 向左移 加加
+        currentIndex++;
+      } else if (oldIndex < newIndex) {
+        // 向右移 减减
+        currentIndex--;
+      }
+      return currentIndex;
+    },
+    onMove(e) {
+      // 返回false表示不允许停靠
+      return !!e.relatedContext.element;
+    },
+  },
+  // 路由离开了 清除定时器
+  beforeRouteLeave(to, from, next) {
+    clearInterval(this.timeInterval);
+    next();
+  },
+};
+</script>
+<style lang="scss">
+.add-choiceness {
+  .el-date-editor.el-input,
+  .el-select {
+    width: 100%;
+  }
+  .content-resource {
+    margin: 30px 0 60px;
+    display: flex;
+    line-height: 40px;
+    .resource {
+      width: 105px;
+    }
+    .show {
+      flex: 1;
+      height: 40px;
+      border: 1px solid #aab4cc;
+      border-radius: 4px;
+      padding-left: 20px;
+    }
+  }
+  .content-bottom {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    .el-button {
+      padding: 0 30px;
+      height: 40px;
+      margin-left: 30px;
+    }
+  }
+  .dlg-content {
+    width: 100%;
+    margin: 40px 0 70px;
+    .inline-input {
+      width: 100% !important;
+    }
+    .el-input {
+      width: 100% !important;
+    }
+  }
+
+  .content-module {
+    margin-top: 30px;
+    .content-industry {
+      display: inline-block;
+      margin: 30px 0;
+      .content-name {
+        display: inline-block;
+        box-sizing: border-box;
+        padding: 0 24px;
+        line-height: 38px;
+        height: 40px;
+        background: #ecf5ff;
+        border: 1px solid #b3d8ff;
+        opacity: 1;
+        font-weight: 500;
+        font-size: 16px;
+        color: #409eff;
+        border-radius: 4px;
+        margin-right: 30px;
+      }
+      .active {
+        background-color: #409eff;
+        color: #fff;
+      }
+    }
+    .addIndustrial {
+      box-sizing: border-box;
+      width: 96px;
+      height: 60px;
+      padding-top: 10px;
+      text-align: center;
+      background: #ecf5ff;
+      border: 1px solid #b3d8ff;
+      opacity: 1;
+      border-radius: 4px;
+      color: #409eff;
+      i {
+        color: #409eff;
+        font-weight: 700;
+        padding-bottom: 5px;
+      }
+      span {
+        display: inline-block;
+        width: 100%;
+      }
+    }
+  }
+  .classification {
+    display: flex;
+    flex-wrap: wrap;
+    margin-top: 20px;
+    .industrial {
+      position: relative;
+      box-sizing: border-box;
+      margin-bottom: 15px;
+      width: 290px;
+      height: 60px;
+      line-height: 60px;
+      text-align: center;
+      background: #ecf5ff;
+      font-size: 14px;
+      margin-right: 30px;
+      color: #409eff;
+      border-radius: 4px;
+      border: 1px solid #b3d8ff;
+    }
+
+    .pitch {
+      display: flex;
+      padding: 0 20px;
+      justify-content: space-between;
+      background-color: #409eff;
+      border: none;
+      color: #fff !important;
+    }
+    .addIndustrial {
+      box-sizing: border-box;
+      width: 96px;
+      height: 60px;
+      padding-top: 10px;
+      text-align: center;
+      background: #ecf5ff;
+      border: 1px solid #b3d8ff;
+      opacity: 1;
+      border-radius: 4px;
+      color: #409eff;
+      margin-bottom: 15px;
+      i {
+        color: #409eff;
+        font-weight: 700;
+        padding-bottom: 5px;
+      }
+      span {
+        display: inline-block;
+        width: 100%;
+      }
+    }
+  }
+  .industrial-is-new {
+    margin-bottom: 20px;
+  }
+  .delete-item-icon {
+    width: 20px;
+    height: 20px;
+    margin-right: 20px;
+  }
+}
+</style>

src/views/rai_manage/components/addIndustryMark.vue

@@ -0,0 +1,215 @@
+<template>
+  <div class="industry-mark">
+    <!-- 添加行业 -->
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      title="添加产业"
+      :visible.sync="addIndustryDlg"
+      customClass="custom-addIndustryMark"
+      :before-close="confirmIndustry"
+    >
+      <div v-if="optionFormregion === '研选'">
+        <p>所属行业：{{ optionFormregion }}</p>
+        <el-input v-model="inputIndustry" maxlength="10" placeholder="请输入产业名称（最多输入10个字）"></el-input>
+      </div>
+      <div v-else>
+        <el-form :model="addIndustryForm" :rules="industryAdd" ref="addIndustryRef">
+          <el-form-item prop="tradeValue">
+            <el-select placeholder="请选择行业" style="width: 100%" clearable v-model="addIndustryForm.tradeValue" @change="changeHandel" @focus="chartPermission">
+              <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item prop="industryName">
+            <el-input style="width: 100%" placeholder="请输入产业名称（最多输入10个字）" v-model="addIndustryForm.industryName" maxlength="10"></el-input>
+          </el-form-item>
+          <el-form-item prop="recommendedIndex">
+            <el-input style="width: 100%; margin-top: 20px" placeholder="请设置推荐指数（0-100）" v-model="addIndustryForm.recommendedIndex"></el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="commitIndustry">确定</el-button>
+        <el-button @click="confirmIndustry">取消</el-button>
+      </span>
+    </el-dialog>
+
+    <!-- 添加标的 -->
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      title="添加标的"
+      :visible.sync="addMarkDlg"
+      customClass="custom-addIndustryMark"
+      :before-close="confirmMark"
+    >
+      <div>
+        <p>所属产业：{{ addMarkUpVal.industrialName }}</p>
+        <div v-for="(item, index) in mark" :key="index">
+          <el-input v-model="item.name" maxlength="6" placeholder="请输入标的名称（最多输入6个字）"></el-input>
+        </div>
+        <div class="add-mark" @click="addMarkInput"><img src="~@/assets/img/set_m/add_ico.png" /> 继续添加</div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="commitMark">确定</el-button>
+        <el-button @click="confirmMark">取消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    addIndustryDlg: {
+      type: Boolean,
+      default: false,
+    },
+    addMarkDlg: {
+      type: Boolean,
+      default: false,
+    },
+    optionFormregion: {
+      type: String,
+    },
+    addMarkUpVal: {
+      type: Object,
+      default: {},
+    },
+    source: {
+      type: Number,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      inputIndustry: "",
+      mark: [{ name: "" }],
+      chartPermissionList: [],
+      addIndustryForm: {
+        //添加产业分类
+        tradeValue: "",
+        industryName: "",
+        recommendedIndex: null,
+      },
+      industryAdd: {
+        industryName: [{ required: true, message: "请输入产业名称（最多输入10个字）", trigger: "blur" }],
+        recommendedIndex: [{ required: true, message: "请输入推荐指数", trigger: "blur" }],
+        tradeValue: [{ required: true, message: "请选择行业", trigger: "change" }],
+      },
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {},
+  methods: {
+    //获取行业
+    chartPermission() {
+      raiInterface.chartPermissionFirstHaveIco().then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    //添加行业的确定事件
+    async commitIndustry() {
+      if (this.optionFormregion != "研选") {
+        this.$refs.addIndustryRef.validate(async (val) => {
+          if (val) {
+            //添加产业
+            const res = await raiInterface.industrialManagement({
+              IndustryName: this.addIndustryForm.industryName,
+              RecommendedIndex: this.addIndustryForm.recommendedIndex - 0,
+              ChartPermissionId: this.addIndustryForm.tradeValue,
+            });
+            if (!res.Success) return;
+            this.$emit("commitIndustryDlg", res.Data);
+            this.$message.success("添加成功！");
+            this.confirmIndustry();
+          }
+        });
+      } else {
+        if (this.inputIndustry) {
+          const res = await raiInterface.industrialManagement({
+            Source: this.source,
+            IndustryName: this.inputIndustry,
+            PermissionName: this.optionFormregion,
+          });
+          if (res.Ret === 200) {
+            this.$emit("commitIndustryDlg", res.Data);
+            this.$message.success("添加成功！");
+            this.confirmIndustry();
+          }
+        } else {
+          this.$message.error("请输入产业！");
+        }
+      }
+    },
+    //添加行业的取消事件
+    confirmIndustry() {
+      this.inputIndustry = "";
+      this.$emit("update:addIndustryDlg", false);
+    },
+    //添加标的的确定事件
+    async commitMark() {
+      let arr = [];
+      this.mark.forEach((item) => {
+        if (item.name) {
+          arr.push(item.name);
+        }
+      });
+      if (!arr.length) return this.$message.error("请输入标的！");
+      const res = await raiInterface.industrialSubjectAdd({
+        IndustrialManagementId: this.addMarkUpVal.industrialId,
+        Source: this.source,
+        SubjectName: arr.join(",").replace(/,/g, "{|}"),
+      });
+      if (res.Ret === 200) {
+        this.$emit("commitMarkDlg", res.Data.NewId);
+        this.$message.success("添加成功！");
+        this.confirmMark();
+      }
+    },
+    //添加标的的取消事件
+    confirmMark() {
+      this.mark = [{ name: "" }];
+      this.$emit("update:addMarkDlg", false);
+    },
+    //添加标的的输入框
+    addMarkInput() {
+      this.mark.push({ name: "" });
+    },
+  },
+};
+</script>
+<style lang="scss">
+.industry-mark {
+  .custom-addIndustryMark {
+    width: 500px;
+    .el-dialog__footer {
+      margin-top: 20px;
+    }
+  }
+  .el-input {
+    width: 100%;
+    margin-top: 20px;
+  }
+  .add-mark {
+    display: flex;
+    align-items: center;
+    margin-top: 20px;
+    color: #409eff;
+    img {
+      margin-right: 15px;
+    }
+  }
+}
+</style>

src/views/rai_manage/components/addLabelDialog.vue

@@ -0,0 +1,214 @@
+<template>
+ <div class="container-addLabel">
+     <el-dialog
+      v-dialogDrag 
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      top="5vh"
+      :visible.sync="addLabeldialogVisib"
+      customClass="custom-addLabel"
+      :before-close="confirmPerson"
+    >
+    <div slot="title" style="display: flex; align-items: center">
+        <img
+          :src="$icons.add"
+          style="color: #fff; width: 16px; height: 16px; margin-right: 5px"
+        />
+        <span style="font-size: 16px">
+         {{addLabelType=='活动'?'活动标签':'快捷检索标签'}}   
+            </span>
+      </div>
+     <div  class="inline"  v-for="(item, index) in dynamicItem"  :key="index" >
+        <div class="inline-content">
+        <span>{{index+1}}</span>
+          <el-input
+          class="inline-input"
+          v-model="item.KeyWord"
+          placeholder="请输入标签名称"
+          clearable
+        ></el-input>
+         <img @click="deleteItem(index)" src="~@/assets/img/icons/delete-Item.png"  :class="index == 0 ? 'defaultyi' : ''" alt="">
+      </div>
+      <div class="children-item">
+        <div class="children-item" v-for="(key, indexs) in item.ListWords"  :key="indexs">
+         <el-input
+          class="inline-input"
+          v-model="key.MirrorWord"
+          placeholder="请输入标签名称"
+          clearable
+        ></el-input>
+         <img @click="deleteChildren(index,indexs)" src="~@/assets/img/icons/delete-Item.png"  :class="indexs == 0 ? 'defaultyi' : ''" alt="">
+      </div>
+       <div class="children-box">
+          <img  @click="addChildren(index)" :src="$icons.addblue">
+          <span @click="addChildren(index)" >添加相关公司</span>
+      </div>
+      </div>
+     </div>
+    <div class="add-box">
+          <img  @click="addItem" :src="$icons.addblue">
+          <span @click="addItem" >添加</span>
+      </div>
+       <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmSubmit">确定</el-button>
+        <el-button @click="confirmPerson">取消</el-button>
+      </span>
+    </el-dialog>
+ </div>
+</template>
+
+<script>
+import { raiInterface } from '@/api/api.js'
+export default {
+  name: '',
+  components: {},
+  props: {
+      addLabeldialogVisib:{
+          type: Boolean,
+          default: false
+      },
+      addLabelType:{
+          type:String,
+          required: true,
+      }
+  },
+  data () {
+    return {
+        dynamicItem:[]
+    }
+  },
+  computed: {},
+  watch: {
+    addLabeldialogVisib(){
+      if(this.addLabeldialogVisib){
+        this.getList()
+      }
+    }
+  },
+  created () {},
+  mounted () {},
+  methods: {
+    getList(){
+      raiInterface.activityFastSearchKeWord().then(res=>{
+        if(res.Ret === 200){
+          this.dynamicItem= res.Data.List
+        }
+      })
+    },
+      //弹框取消事件
+      confirmPerson(){
+          this.dynamicItem=[]
+          this.$emit('update:addLabeldialogVisib',false);
+      },
+      //弹框确认事件
+      confirmSubmit(){
+        this.dynamicItem=[]
+        this.$emit('update:addLabeldialogVisib',false);
+      },
+      //添加活动标签
+      addItem(){
+          if(this.dynamicItem.length == 20) return 
+          this.dynamicItem.push({KeyWord: "",ListWords:[]})
+      },
+      //删除活动标签
+      deleteItem(index){
+          this.dynamicItem.splice(index,1)
+      },
+      //添加标签下的相关公司
+      addChildren(index){
+         this.dynamicItem[index].ListWords.push({MirrorWord: ""})
+      },
+      //删除标签下的相关公司
+      deleteChildren(index,indexs){
+        this.dynamicItem[index].ListWords.splice(indexs,1)
+      }
+  }
+}
+</script>
+<style  lang="less">
+.container-addLabel {
+ .custom-addLabel {
+    width: 600px;  
+  }
+  .add-box {
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    color: #5882EF;
+    margin-top: 30px;
+    margin-bottom: 17px;
+    img {   
+    width: 16px;
+    height: 16px;
+    margin-right: 10px;
+    }
+  }
+    .inline {
+    margin-bottom: 20px;
+    width: 440px;
+    .inline-input {
+     width: 370px !important;
+    }
+  p{
+      padding-top: 5px;
+      font-size: 14px;
+      font-family: PingFang SC;
+      font-weight: 500;
+      line-height: 20px;
+      color: #EF5858;
+      opacity: 1;
+    }
+    .children-item {
+
+      .children-item {
+      margin-top: 20px;
+      padding-right:20px;
+      padding-left: 25px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      img { 
+        width: 14px;
+        height: 14px;
+      }
+      }
+      .children-box {
+        margin-top: 15px;
+        padding-left: 25px;
+        display: flex;
+        align-items: center;
+        color: #5882EF;
+        img { 
+          margin-right: 10px;
+        }
+      }
+    }
+  }
+  .inline-content {
+    padding-right:20px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    img { 
+      width: 14px;
+      height: 14px;
+    }
+  }
+   .el-input {
+    width: 360px !important;
+  }
+  .el-switch__label  {
+    color: #606266 ;
+   font-size: 14px;
+   font-weight:400;
+  }
+   .is-active {
+    color: #409EFF !important;
+  }
+  .el-radio__label {
+    font-weight:400;
+  }
+}
+
+</style>

src/views/rai_manage/components/addMorningMeeting.vue

@@ -0,0 +1,397 @@
+<template>
+  <!-- 添加/编辑 晨会精华 -->
+  <div class="add-morning-meeting-wrap" v-loading="dataLoading">
+    <div class="date-pick-wrap">
+      <el-date-picker v-model="meettingDate" type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="请选择晨会日期"> </el-date-picker>
+    </div>
+    <div class="content-wrap">
+      <div class="meeting-content-wrap">
+        <div class="meeting-content" v-for="(item, index) in sectionData" :key="item.index">
+          <div class="content">
+            <div class="title">
+              <h3>段落{{ index + 1 }}：</h3>
+              <span class="dele" v-if="index !== 0" @click="deleteSection(index)"> <img src="~@/assets/img/icons/delete-Item.png" /></span>
+            </div>
+            <div>
+              <el-checkbox v-model="item.isJumpNot">可跳转报告详情</el-checkbox>
+              <template v-if="item.isJumpNot">
+                <el-input style="margin: 20px 0" v-model="item.reportLink" placeholder="请输入报告链接"></el-input>
+                <el-input v-model="item.headTitle" placeholder="请输入首行标题"></el-input>
+              </template>
+            </div>
+            <div class="fr-wrapper">
+              <froala :id="`froala-editor-${index}`" :ref="`froalaEditor${index}`" :tag="'textarea'" :config="froalaConfig" v-model="item.content"></froala>
+            </div>
+          </div>
+          <div class="classify-box">
+            <el-select placeholder="请选择行业" v-model="item.industry" value-key="ChartPermissionId" @change="handleSelectChange(item, index, 'industry')">
+              <el-option
+                v-for="industry in industryData"
+                :key="industry.ChartPermissionId"
+                :label="industry.PermissionName"
+                :value="{ ChartPermissionId: industry.ChartPermissionId, PermissionName: industry.PermissionName }"
+              />
+            </el-select>
+            <el-select placeholder="请选择产业" filterable v-model="item.property" value-key="ChartPermissionId" @change="handleSelectChange(item, index, 'property')">
+              <el-option v-for="property in getPropertyData(item.industry)" :key="property.ChartPermissionId" :label="property.PermissionName" :value="property" />
+            </el-select>
+            <el-select multiple placeholder="请选择标的" v-model="item.subject" @focus="getSubjectData(item.property)">
+              <el-option v-for="subject in subjectData" :key="subject.IndustrialSubjectId" :label="subject.SubjectName" :value="subject.IndustrialSubjectId" />
+            </el-select>
+          </div>
+        </div>
+        <div class="add-content-box" @click="addSection"><img src="~@/assets/img/set_m/add.png" /> 添加段落</div>
+      </div>
+
+      <div class="form-btn">
+        <el-button type="primary" @click="comfirm('save')">保存</el-button>
+        <el-button type="primary" @click="comfirm('pub')" v-if="isPublishShow">发布</el-button>
+        <el-button @click="comfirm('cancel')">取消</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  data() {
+    var that = this;
+    return {
+      meettingDate: "",
+      meetingId: 0,
+      froalaConfig: {
+        toolbarButtons: ["bold", "italic", "underline", "strikeThrough", "insertHR", "fontSize", "align", "undo", "redo"],
+        height: 260,
+        fontSizeDefaultSelection: "16",
+        quickInsertEnabled: false,
+        theme: "dark", //主题
+        placeholderText: "请输入晨会内容",
+        language: "zh_cn",
+        events: {
+          initialized: function () {
+            that.editor = this;
+            that.editor.toolbar.hide();
+          },
+        },
+      },
+      sectionData: [
+        {
+          isJumpNot: false, //是否跳转
+          reportLink: "", //报告链接
+          headTitle: "", //报告标题
+          content: "", //晨会内容
+          industry: "", //行业
+          property: "", //行业
+          subject: "", //标的
+        },
+      ],
+      industryData: [],
+      allPropertyData: [], //总的产业数据
+      PropertyData: [], //单个行业下的产业数据
+      subjectData: [],
+      isGoBack: true, //点击底部按钮时,是否进行页面跳转
+      isPublishShow: false, //是否显示发布按钮
+      dataLoading: false,
+    };
+  },
+  methods: {
+    //添加段落
+    addSection() {
+      const section = {
+        content: "",
+        industry: "",
+        property: "",
+        subject: "",
+        isJumpNot: false, //是否跳转
+        reportLink: "", //报告链接
+        headTitle: "", //报告标题
+      };
+      this.sectionData.push(section);
+    },
+    //删除段落
+    deleteSection(index) {
+      this.sectionData.splice(index, 1);
+    },
+    //获取行业数据
+    async getIndustryData() {
+      const res = await raiInterface.chartPermissionFirstHaveIco();
+      if (res.Ret !== 200) return;
+      this.industryData = res.Data.List || [];
+    },
+    //根据行业获取产业数据
+    getPropertyData(industry) {
+      const industryId = industry.ChartPermissionId;
+      if (!industryId) return [];
+      let propertyData = [];
+      this.allPropertyData.forEach((item) => {
+        if (item.ChartPermissionId === industryId) {
+          propertyData = item.List || [];
+        }
+      });
+      return propertyData;
+    },
+    //根据产业获取标的数据
+    async getSubjectData(property) {
+      const propertyId = property.ChartPermissionId;
+      if (!propertyId) {
+        this.subjectData = [];
+        return;
+      }
+      const res = await raiInterface.getindustrialSubjectlistIds({ IndustrialManagementIdStr: propertyId });
+      if (res.Ret !== 200) return;
+      this.subjectData = res.Data.List || [];
+    },
+    //获取全部产业数据
+    async getAllPropertyData() {
+      const res = await raiInterface.getListIndustrial();
+      if (res.Ret !== 200) return;
+      this.allPropertyData = res.Data.List || [];
+    },
+    //行业 产业 选择框改变时触发
+    handleSelectChange(data, index, prop) {
+      if (prop === "industry") {
+        data.property = "";
+        data.subject = [];
+      }
+      if (prop === "property") {
+        data.subject = [];
+      }
+      this.sectionData.splice(index, 1, data);
+    },
+    //晨会详情
+    async getMeetingDetail(id) {
+      //获取晨会详情
+      const res = await raiInterface.getMorningMeetingDetail({
+        MeetingId: this.meetingId || id,
+      });
+      if (res.Ret !== 200) return;
+      //处理数据
+      const data = res.Data.List || [];
+      this.meettingDate = res.Data.MeetingTime;
+      this.isPublishShow = res.Data.Status === 1 ? false : true;
+      this.sectionData = data.map((item) => {
+        let temp = {
+          id: item.Id,
+          content: item.content,
+          industry: { ChartPermissionId: item.chartPermissionId, PermissionName: item.chartPermissionName },
+          property: { ChartPermissionId: item.industryId, PermissionName: item.industryName },
+          reportLink: item.reportLink,
+          headTitle: item.title,
+          isJumpNot: item.reportLink ? true : false,
+        };
+        let subject = [];
+        let industrialSubjectList = item.industrialSubjectList || [];
+        industrialSubjectList.map((i) => {
+          subject.push(i.IndustrialSubjectId);
+        });
+        temp.subject = subject;
+        this.getSubjectData(temp.property);
+        return temp;
+      });
+      this.dataLoading = false;
+    },
+    //保存 发布 取消 操作
+    comfirm: _.debounce(async function (type) {
+      if (type === "cancel") {
+        this.$router.back();
+        return;
+      }
+      if (!this.checkContent()) return;
+      if (type === "pub") {
+        this.pubMeeting();
+      }
+      if (type === "save") {
+        this.meetingId && this.editMeeting();
+        !this.meetingId && this.addMeeting();
+      }
+      /* if(type==="cancel"){} */
+
+      this.isGoBack && this.$router.back();
+    }, 500),
+    async pubMeeting() {
+      const list = this.getSectionData();
+      const res = await raiInterface.publishMorningMeeting({
+        MeetingId: Number(this.meetingId),
+        MeetingTime: this.meettingDate,
+        List: list,
+      });
+      if (res.Ret !== 200) {
+        this.isGoBack = false;
+        return;
+      }
+      this.$message.success("发布成功");
+    },
+    async addMeeting() {
+      const list = this.getSectionData();
+      const res = await raiInterface.editMorningMeeting({
+        MeetingId: 0,
+        MeetingTime: this.meettingDate,
+        List: list,
+      });
+      if (res.Ret !== 200) {
+        this.isGoBack = false;
+        return;
+      }
+      await this.getMeetingDetail(res.Data);
+      this.meetingId = res.Data;
+      this.$message.success("添加成功");
+    },
+    async editMeeting() {
+      const list = this.getSectionData();
+      const res = await raiInterface.editMorningMeeting({
+        MeetingId: Number(this.meetingId),
+        MeetingTime: this.meettingDate,
+        List: list,
+      });
+      if (res.Ret !== 200) {
+        this.isGoBack = false;
+        return;
+      }
+      this.$message.success("保存成功");
+    },
+    //转换页面段落的内容为接口的格式
+    getSectionData() {
+      //item.content做处理，把<p data-f-id=\"pbf\"....></p>替换成''
+      this.sectionData = this.sectionData.map((item) => {
+        item.content = item.content.replace(/<p data-f-id=\"pbf\".*?<\/p>/g, "");
+        return item;
+      });
+      let list = [];
+      this.sectionData.forEach((item) => {
+        let temp = {
+          ChapterId: item.id || 0,
+          Content: item.content,
+          ChartPermissionId: item.industry.ChartPermissionId,
+          ChartPermissionName: item.industry.PermissionName,
+          IndustryId: item.property.ChartPermissionId,
+          IndustryName: item.property.PermissionName,
+          IndustrialSubjectIds: item.subject.join(),
+          ReportLink: item.reportLink,
+          Title: item.headTitle,
+        };
+        list.push(temp);
+      });
+      return list;
+    },
+    //检查晨会内容
+    checkContent() {
+      for (let i = 0; i < this.sectionData.length; i++) {
+        if (this.sectionData[i].isJumpNot && this.sectionData[i].reportLink.length === 0) {
+          this.$message.warning(`请输入段落${i + 1}报告链接`);
+          return false;
+        }
+        if (this.sectionData[i].isJumpNot && this.sectionData[i].headTitle.length === 0) {
+          this.$message.warning(`请输入段落${i + 1}报告标题`);
+          return false;
+        }
+        //所有的段落有值
+        if (this.sectionData[i].content.length === 0) {
+          this.$message.warning(`请输入段落${i + 1}的内容`);
+          return false;
+        }
+        //所有的段落 有产业,行业
+        if (!(this.sectionData[i].industry instanceof Object)) {
+          this.$message.warning(`请选择段落${i + 1}的行业`);
+          return false;
+        }
+        if (!(this.sectionData[i].property instanceof Object)) {
+          this.$message.warning(`请选择段落${i + 1}的产业`);
+          return false;
+        }
+      }
+      return true;
+    },
+  },
+  mounted() {
+    this.getIndustryData();
+    this.getAllPropertyData();
+    if (this.$route.query.id) {
+      this.meetingId = this.$route.query.id;
+      this.dataLoading = true;
+      this.getMeetingDetail();
+    } else {
+      this.meettingDate = this.$moment().format("yyyy-MM-DD");
+      this.isPublishShow = true;
+    }
+    //console.log('meetingId',this.meetingId,!this.meetingId)
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.add-morning-meeting-wrap {
+  .date-pick-wrap {
+    background-color: #fff;
+    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
+    border-radius: 4px;
+    padding: 20px;
+    box-sizing: border-box;
+  }
+  .content-wrap {
+    margin-top: 20px;
+    background-color: #fff;
+    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
+    border-radius: 4px;
+    padding: 20px;
+    box-sizing: border-box;
+    /* height: calc(100vh - 120px - 120px); */
+    display: flex;
+    flex-direction: column;
+    .meeting-content-wrap {
+      flex: 1;
+      .meeting-content {
+        margin-bottom: 20px;
+        .content {
+          .title {
+            display: flex;
+            align-items: center;
+            margin-bottom: 10px;
+            h3 {
+              margin-left: 2px;
+              margin-right: 10px;
+            }
+            .dele {
+              display: flex;
+              cursor: pointer;
+              img {
+                width: 24px;
+                height: 24px;
+              }
+            }
+          }
+        }
+      }
+      .classify-box {
+        margin-top: 10px;
+      }
+      .add-content-box {
+        cursor: pointer;
+        color: #3385ff;
+        display: flex;
+        align-items: center;
+        font-size: 16px;
+        width: 100px;
+        img {
+          width: 15px;
+          height: 15px;
+          border: 1px solid #3385ff;
+          padding: 2px;
+          box-sizing: border-box;
+          margin-right: 10px;
+        }
+      }
+    }
+    .form-btn {
+      display: flex;
+      justify-content: center;
+      /*  height:50px; */
+    }
+  }
+  .fr-wrapper {
+    margin-top: 20px;
+    border-top: 1px solid #cccccc !important;
+    border-bottom: 1px solid #cccccc !important;
+  }
+}
+</style>

src/views/rai_manage/components/addRoadshow.vue

@@ -0,0 +1,292 @@
+<template>
+  <!-- 路演精华添加/编辑 -->
+  <div class="add-roadshow">
+    <el-card>
+      <el-form :model="listForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item prop="title">
+              <el-input placeholder="请输入标题" v-model="listForm.title" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item prop="author">
+              <el-input placeholder="请输入作者" v-model="listForm.author" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item prop="time">
+              <el-date-picker v-model="listForm.time" type="date" placeholder="请选择日期" value-format="yyyy-MM-dd"> </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row style="margin-top: 10px" :gutter="24">
+          <el-col :span="12">
+            <el-form-item prop="industry">
+              <el-select v-model="listForm.industry" value-key="ChartPermissionId" clearable placeholder="请选择行业" @change="industryClear" @clear="industryClear">
+                <el-option v-for="item in optionsIndustry" :key="item.ChartPermissionId" :label="item.PermissionName" :value="item.ChartPermissionId"> </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item prop="property">
+              <el-select v-model="listForm.property" value-key="IndustrialManagementId" multiple placeholder="请选择所属产业" @focus="getPropertyList" @remove-tag="propertyClear">
+                <el-option v-for="item in optionsProperty" :key="item.IndustrialManagementId" :label="item.IndustryName" :value="item.IndustrialManagementId"> </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item prop="property">
+              <el-select v-model="listForm.target" multiple placeholder="请选择关联标的" @focus="getTargetList">
+                <el-option v-for="item in optionsTarget" :key="item.IndustrialSubjectId" :label="item.SubjectName" :value="item.IndustrialSubjectId"> </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <div style="margin-top: 10px">
+          <el-input type="textarea" :rows="4" placeholder="请输入摘要" v-model="listForm.abstract"> </el-input>
+        </div>
+        <div style="margin: 30px 0">
+          <RichText ref="twoRich" :isText="contentValue" />
+        </div>
+        <div class="content-link">
+          <div class="txt">报告链接：</div>
+          <div class="input">
+            <el-input placeholder="请输入报告链接" v-model="listForm.reportLink" />
+          </div>
+        </div>
+      </el-form>
+      <div class="more-button">
+        <el-button type="primary" @click="confirm('预览')">预览</el-button>
+        <el-button type="primary" @click="confirm('保存')">保存</el-button>
+        <el-button v-if="isShowStatus" type="primary" @click="confirm('发布')">发布</el-button>
+        <el-button type="" @click="cancel">取消</el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import RichText from "./richText.vue";
+
+import { raiInterface } from "@/api/api.js";
+import { async } from "@antv/x6/lib/registry/marker/main";
+export default {
+  name: "",
+  components: { RichText },
+  props: {},
+  data() {
+    return {
+      listForm: {
+        title: "", //标题
+        author: "", //作者
+        time: "", //时间
+        industry: "", //行业
+        property: [], //产业
+        target: [], //标的
+        abstract: "",
+        reportLink: "",
+      },
+      property: [],
+      rules: {
+        title: [{ required: true, message: "请输入标题", trigger: "blur" }],
+        author: [{ required: true, message: "请输入作者", trigger: "blur" }],
+        time: [{ required: true, message: "请输入标题", trigger: "change" }],
+        industry: [{ required: true, message: "请选择行业", trigger: "change" }],
+        property: [{ required: true, message: "请选择所属产业", trigger: "change" }],
+        target: [{ required: true, message: "请选择关联标的", trigger: "change" }],
+      },
+      optionsIndustry: [],
+      optionsProperty: [],
+      optionsTarget: [],
+      contentValue: "请输入内容",
+      propertyDetai: [],
+      isShowStatus: true,
+      timeInterval: null,
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    this.getIndustryList();
+    if (this.$route.query.id) {
+      this.getDetail();
+    } else {
+      this.dataInit();
+    }
+  },
+  methods: {
+    // 报告的缓存处理数据
+    dataInit() {
+      if (sessionStorage.getItem("addRoadshowReportQY")) {
+        let data = JSON.parse(sessionStorage.getItem("addRoadshowReportQY"));
+        setTimeout(async () => {
+          this.listForm = {
+            title: data.Title, //标题
+            author: data.SellerAndMobile, //作者
+            time: data.PublishDate, //时间
+            industry: data.ChartPermissionId, //行业
+            abstract: data.Abstract,
+            reportLink: data.ReportLink,
+            property: data.IndustrialManagementId,
+            target: data.IndustrialSubjectIdStr,
+          };
+          this.$refs.twoRich.value = data.Body;
+          if (this.listForm.industry) {
+            await this.getPropertyList();
+            await this.getTargetList();
+          }
+        }, 200);
+      }
+      this.timeInterval = setInterval(() => {
+        let params = {
+          Abstract: this.listForm.abstract,
+          Body: this.$refs.twoRich.value,
+          ChartPermissionId: this.listForm.industry,
+          IndustrialManagementId: this.listForm.property,
+          IndustrialSubjectIdStr: this.listForm.target,
+          ReportLink: this.listForm.reportLink,
+          PublishDate: this.listForm.time,
+          SellerAndMobile: this.listForm.author,
+          Title: this.listForm.title,
+        };
+        sessionStorage.setItem("addRoadshowReportQY", JSON.stringify(params));
+      }, 120000);
+    },
+    // 获取数据
+    async getDetail() {
+      const res = await raiInterface.roadshowEssenceDetail({ ArticleId: Number(this.$route.query.id) });
+      if (res.Ret === 200) {
+        this.isShowStatus = res.Data.PublishStatus == 0;
+        this.listForm = {
+          title: res.Data.Title, //标题
+          author: res.Data.SellerAndMobile, //作者
+          time: res.Data.PublishDate, //时间
+          industry: res.Data.ChartPermissionId > 0 ? res.Data.ChartPermissionId : "", //行业
+          abstract: res.Data.Abstract,
+          reportLink: res.Data.ReportLink,
+          property: res.Data.IndustrialManagementId ? res.Data.IndustrialManagementId.split(",").map((item) => Number(item)) : [],
+          target: res.Data.IndustrialSubjectIdStr ? res.Data.IndustrialSubjectIdStr.split(",").map((item) => Number(item)) : [],
+        };
+        this.$refs.twoRich.value = res.Data.Body;
+        if (this.listForm.industry) {
+          await this.getPropertyList();
+          await this.getTargetList();
+        }
+      }
+    },
+    //获取行业
+    async getIndustryList() {
+      const res = await raiInterface.chartPermissionFirstHaveIco();
+      if (res.Ret === 200) {
+        this.optionsIndustry = res.Data.List || [];
+      }
+    },
+    //获取产业
+    async getPropertyList() {
+      const str = this.listForm.industry;
+      if (!str) return;
+      const res = await raiInterface.getIndustrialManagement({ ChartPermissionId: str });
+      if (res.Ret === 200) {
+        this.optionsProperty = res.Data.List || [];
+      }
+    },
+    //获取标的
+    async getTargetList() {
+      const str = this.listForm.property.join(",");
+      if (!str) return;
+      const res = await raiInterface.getindustrialSubjectlistIds({ IndustrialManagementIdStr: str });
+      if (res.Ret === 200) {
+        this.optionsTarget = res.Data.List || [];
+      }
+    },
+    //保存 / 发布
+    confirm: _.debounce(function (type) {
+      this.$refs.ruleForm.validate(async (value) => {
+        if (value) {
+          let params = {
+            Abstract: this.listForm.abstract,
+            Body: this.$refs.twoRich.value,
+            ChartPermissionId: this.listForm.industry,
+            IndustrialManagementId: this.listForm.property.join(","),
+            IndustrialSubjectIdStr: this.listForm.target.join(","),
+            ReportLink: this.listForm.reportLink,
+            PublishDate: this.listForm.time,
+            SellerAndMobile: this.listForm.author,
+            Title: this.listForm.title,
+            DoType: type == "发布" ? 1 : 0,
+            ArticleId: this.$route.query.id ? Number(this.$route.query.id) : 0,
+          };
+          if (type == "预览") {
+            sessionStorage.setItem("roadShowPre", JSON.stringify(params));
+            let { href } = this.$router.resolve({ name: "预览路演精华" });
+            window.open(href, "_blank");
+          } else {
+            const res = await raiInterface.roadshowEssencePreserveAndPublish(params);
+            if (res.Ret === 200) {
+              this.$message.success(`${type}成功!`);
+              this.$refs.ruleForm.resetFields();
+              clearInterval(this.timeInterval);
+              sessionStorage.removeItem("addRoadshowReportQY");
+              this.$router.back();
+            }
+          }
+        }
+      });
+    }, 500),
+    industryClear() {
+      this.listForm.property = [];
+      this.optionsProperty = [];
+      this.listForm.target = [];
+      this.optionsTarget = [];
+    },
+    propertyClear() {
+      this.listForm.target = [];
+      this.optionsTarget = [];
+    },
+    //取消事件
+    cancel() {
+      clearInterval(this.timeInterval);
+      sessionStorage.removeItem("addRoadshowReportQY");
+      this.$refs.ruleForm.resetFields();
+      this.$router.back();
+    },
+  },
+  // 路由离开了 清除定时器
+  beforeRouteLeave(to, from, next) {
+    clearInterval(this.timeInterval);
+    next();
+  },
+};
+</script>
+<style lang="scss">
+.add-roadshow {
+  .el-date-editor.el-input,
+  .el-select {
+    width: 100%;
+  }
+  .content-link {
+    display: flex;
+    align-items: center;
+    .txt {
+      width: 92px;
+      color: #333333;
+      font-size: 16px;
+    }
+    .input {
+      flex: 1;
+    }
+  }
+  .more-button {
+    width: 100%;
+    text-align: center;
+    margin: 60px 0 80px;
+    .el-button {
+      height: 40px;
+      padding: 0 30px;
+      margin-right: 20px;
+    }
+  }
+}
+</style>

src/views/rai_manage/components/addSummarizing.vue

@@ -0,0 +1,272 @@
+<template>
+  <!-- 上周研究汇总添加/编辑 -->
+  <div class="add-summarizing">
+    <el-card>
+      <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item prop="title">
+              <el-input v-model="ruleForm.title" placeholder="请输入标题"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item prop="author">
+              <el-input v-model="ruleForm.author" placeholder="请输入作者"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item prop="time">
+              <el-date-picker type="date" placeholder="选择发布时间" value-format="yyyy-MM-dd" v-model="ruleForm.time"></el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item prop="explain">
+          <el-input v-model="ruleForm.explain" placeholder="请输入摘要"></el-input>
+        </el-form-item>
+      </el-form>
+      <!-- //产业调研纪要篇 -->
+      <div class="content-list">
+        <div class="list-top">
+          <span>产业调研纪要篇</span>
+          <input maxlength="1" :class="isSortCydyjyShow ? '' : 'red'" v-model="SortCydyjy" placeholder="序号" onkeyup="value=value.replace(/[^A-Z]/g,'')" />
+          <el-tooltip style="margin-left: 5px" class="item" placement="top-start">
+            <div slot="content">
+              一级分类的序号请以大写字母A\B\C\D...排序 <br />
+              二级分类请以1\2\3\4...排序
+            </div>
+            <i class="el-icon-info"></i>
+          </el-tooltip>
+        </div>
+        <div class="list-ul" v-for="(item, index) in ListCydyjy" :key="item.ChartPermissionId">
+          <div class="list-title">
+            <img :src="item.IcoLink" alt="" />
+            <span>{{ item.ChartPermissionName }}</span>
+            <input maxlength="1" placeholder="序号" :class="item.isShow ? 'red' : ''" v-model="item.ChartPermissionSort" onkeyup="value=value.replace(/[^\d]/g,'')" />
+          </div>
+          <div class="list-li">
+            <div v-for="(val, num) in item.List" :key="num" class="list-children">
+              <div class="box">
+                <froala :id="num + 'froalaCy'" :ref="num + 'froalaCy'" :tag="'textarea'" :config="froalaConfig" v-model="val.Body"></froala>
+                <el-input v-model="val.ReportLink" placeholder="请输入报告链接"></el-input>
+              </div>
+              <img @click="deleteListSdbg(item, num, index, '产业调研纪要篇')" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <p @click="addListSdbg(item, index, '产业调研纪要篇')" :class="item.List && item.List.length > 0 ? 'active' : ''">+添加栏目</p>
+          </div>
+        </div>
+      </div>
+      <!-- //上市公司调研纪要篇 -->
+      <div class="content-list">
+        <div class="list-top">
+          <span>上市公司调研纪要篇</span>
+          <input maxlength="1" :class="isSortSsgsShow ? '' : 'red'" v-model="SortSsgs" placeholder="序号" onkeyup="value=value.replace(/[^A-Z]/g,'')" />
+        </div>
+        <div class="list-ul" v-for="(item, index) in ListSsgs" :key="item.ChartPermissionId">
+          <div class="list-title">
+            <img :src="item.IcoLink" alt="" />
+            <span>{{ item.ChartPermissionName }}</span>
+            <input maxlength="1" placeholder="序号" :class="item.isShow ? 'red' : ''" v-model="item.ChartPermissionSort" onkeyup="value=value.replace(/[^\d]/g,'')" />
+          </div>
+          <div class="list-li">
+            <div v-for="(val, num) in item.List" :key="num" class="list-children">
+              <div class="box">
+                <froala :id="num + 'froalaCy'" :ref="num + 'froalaCy'" :tag="'textarea'" :config="froalaConfig" v-model="val.Body"></froala>
+                <el-input v-model="val.ReportLink" placeholder="请输入报告链接"></el-input>
+              </div>
+              <img @click="deleteListSdbg(item, num, index, '上市公司调研纪要篇')" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <p @click="addListSdbg(item, index, '上市公司调研纪要篇')" :class="item.List && item.List.length > 0 ? 'active' : ''">+添加栏目</p>
+          </div>
+        </div>
+      </div>
+      <!-- 研选纪要
+      <div class="content-list">
+        <div class="list-top">
+          <span>买方研选纪要</span>
+          <input maxlength="1" :class="isSortSummaryShow ? '' : 'red'" v-model="SortYanx" placeholder="序号" onkeyup="value=value.replace(/[^A-Z]/g,'')" />
+        </div>
+        <div class="list-ul">
+          <div class="list-li">
+            <div v-for="(item, index) in ListYanx" :key="index" class="list-children">
+              <div class="box">
+                <froala :id="item + 'froalaDp'" :ref="item + 'froalaDp'" :tag="'textarea'" :config="froalaConfig" v-model="item.Body"></froala>
+                <el-input v-model="item.ReportLink" :class="item.isShow ? 'red' : ''" placeholder="请输入报告链接"></el-input>
+              </div>
+              <img @click="deleteList(item, index)" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <p @click="addList" :class="ListYanx && ListYanx.length > 0 ? 'active' : ''">+添加栏目</p>
+          </div>
+        </div>
+      </div> --> 
+      <div class="more-button">
+        <el-button type="primary" @click="confirm('预览')">预览</el-button>
+        <el-button type="primary" @click="confirm('保存')">保存</el-button>
+        <el-button v-if="isShowStatus" type="primary" @click="confirm('发布')">发布</el-button>
+        <el-button type="" @click="cancel">取消</el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import mixinsRichText from "./selection/mixins";
+export default {
+  name: "",
+  components: {},
+  props: {},
+  data() {
+    var that = this;
+    return {
+      // ListYanx: [],
+      isShowStatus: true,
+      // isSortSummaryShow: true,
+      // SortYanx: "",
+    };
+  },
+  mixins: [mixinsRichText],
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    // window.addEventListener('beforeunload', e => {
+    //   window.event.returnValue = "刷新/关闭"
+    // })
+    window.addEventListener("beforeunload", this.beforeunloadFn);
+    if (this.$route.query.id) {
+      this.getDetail();
+    } else {
+      this.getList();
+    }
+  },
+  destroyed() {
+    window.removeEventListener("beforeunload", this.beforeunloadFn);
+  },
+  methods: {
+    beforeunloadFn(e) {
+      e = e || window.event;
+      if (e) {
+        e.returnValue = "关闭提示";
+      }
+      return "关闭提示";
+    },
+    async getList() {
+      const res = await raiInterface.chartPermissiondetailTemplate();
+      if (res.Ret === 200) {
+        this.ListCydyjy = res.Data.ListCydyjy;
+        this.SortCydyjy = res.Data.SortCydyjy;
+        this.ListSsgs = res.Data.ListSsgs;
+        this.SortSsgs = res.Data.SortSsgs;
+        // this.ListYanx.forEach(item => item.isShow = true);
+      }
+    },
+    //删除 list
+    // deleteList(item, num, index) {
+    //   this.ListYanx.splice(num, 1);
+    // },
+    //添加 list
+    // addList() {
+    //   this.ListYanx.push({ Body: "", ReportLink: "" });
+    // },
+    //获取详情
+    async getDetail() {
+      const res = await raiInterface.minutesSummaryDetail({
+        ArticleId: this.$route.query.id,
+      });
+      if (res.Ret === 200) {
+        this.initGetList(res.Data.ListCydyjy);
+        this.initGetList(res.Data.ListSsgs);
+        this.ListCydyjy = res.Data.ListCydyjy;
+        this.SortCydyjy = res.Data.SortCydyjy;
+        this.ListSsgs = res.Data.ListSsgs;
+        this.SortSsgs = res.Data.SortSsgs;
+        // this.ListYanx = res.Data.ListYanx || [];
+        // this.SortYanx = res.Data.SortYanx;
+        this.isShowStatus = res.Data.PublishStatus == 0;
+        this.ruleForm = {
+          title: res.Data.Title, //标题
+          author: res.Data.Department, //作者
+          time: res.Data.PublishDate, //时间
+          explain: res.Data.Abstract, //说明
+        };
+      }
+    },
+    //保存 发布
+    confirm: _.debounce(function (type) {
+      this.$refs.ruleForm.validate(async (val) => {
+        if (!val) return;
+        const isFlag = await this.fnConFirm();
+        if (isFlag) return;
+        let params = {
+          Abstract: this.ruleForm.explain,
+          ArticleId: this.$route.query.id ? Number(this.$route.query.id) : 0,
+          Department: this.ruleForm.author,
+          DoType: type == "发布" ? 1 : 0,
+          PublishDate: this.ruleForm.time.replace(/\./g, "-"),
+          Title: this.ruleForm.title,
+          List: this.dataList,
+          Content: {
+            ListCydyjy: this.ListCydyjy,
+            ListSsgs: this.ListSsgs,
+            // ListYanx: this.ListYanx,
+            SortCydyjy: this.SortCydyjy,
+            SortSsgs: this.SortSsgs,
+            // SortYanx: this.SortYanx,
+          },
+        };
+        if (type == "预览") {
+          sessionStorage.setItem("lastWeekPre", JSON.stringify(params));
+          let { href } = this.$router.resolve({ name: "预览上周汇总" });
+          window.open(href, "_blank");
+        } else {
+          const res = await raiInterface.minutesSummaryPreserveAndPublish(params);
+          if (res.Ret === 200) {
+            this.$message.success(`${type}成功!`);
+            this.$refs["ruleForm"].resetFields();
+            this.$router.back();
+          }
+        }
+      });
+    }, 500),
+    fnConFirm() {
+      let flag = false;
+      let isCydyjy = this.ListCydyjy.some((item) => item.List.length > 0);
+      let Ssgs = this.ListSsgs.some((item) => item.List.length > 0);
+
+      this.isSortCydyjyShow = !(isCydyjy && !this.SortCydyjy);
+      this.isSortSsgsShow = !(Ssgs && !this.SortSsgs);
+      // this.isSortSummaryShow = !(this.ListYanx.length !== 0 && !this.SortYanx);
+      // || (!this.SortYanx && this.ListYanx.length > 0)
+      if ((isCydyjy && !this.SortCydyjy) || (Ssgs && !this.SortSsgs) ) {
+        this.$message.warning("有内容的报告分类和行业分类，序号不能为空");
+        return (flag = true);
+      }
+      // , this.SortYanx
+      let str = new Array(this.SortCydyjy, this.SortSsgs);
+      let isStr = str.sort();
+      for (var i = 0; i < isStr.length - 1; i++) {
+        if (isStr[i] == isStr[i + 1] && (isStr[i] || isStr[i + 1])) {
+          this.$message.warning("请勿填写重复的序号!");
+          return (flag = true);
+        }
+      }
+      let chidrenCydyjy = this.chidrenList(this.ListCydyjy);
+      let chidrenSsgs = this.chidrenList(this.ListSsgs);
+      if (chidrenCydyjy || chidrenSsgs) {
+        this.$message.warning("有内容行业分类，序号不能为空");
+        return (flag = true);
+      }
+    },
+    //取消
+    cancel() {
+      this.$refs["ruleForm"].resetFields();
+      this.$router.back();
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.add-summarizing {
+  @import "./selection/strictSelection.scss";
+}
+</style>

src/views/rai_manage/components/addSummary.vue

@@ -0,0 +1,605 @@
+<template>
+  <div class="container-summary">
+    <el-form :model="addOfEditForm" :rules="rulesOption" ref="addOfEditForm">
+      <el-card class="card-top">
+        <el-form-item prop="industry" v-if="isSource === 'HZ'">
+          <el-select placeholder="请选择行业" clearable v-model="addOfEditForm.industry" style="width: 360px; margin-right: 20px">
+            <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="regions" v-else>
+          <el-select placeholder="请选择报告类型" clearable @change="regionsChange" v-model="addOfEditForm.regions" style="width: 360px; margin-right: 20px">
+            <el-option v-for="item in chartPermissionList" :label="item.ArticleTypeName" :key="item.ArticleTypeId" :value="item.ArticleTypeId"></el-option>
+            <div class="add-report-type" @click="addRepotrTypeHandel">
+              <img src="~@/assets/img/set_m/add.png" alt="" />
+              添加报告类型
+            </div>
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="property">
+          <el-cascader
+            v-model="addOfEditForm.property"
+            placeholder="请选择产业名称"
+            :show-all-levels="false"
+            :options="industryArr"
+            clearable
+            @visible-change="industrySelectFocus"
+            @change="propertyChange"
+            :props="{ ...defaultProps, multiple: true }"
+            filterable
+          >
+          </el-cascader>
+        </el-form-item>
+        <img v-if="!isSource" src="~@/assets/img/set_m/add_ico.png" style="margin: 0 20px 0 0" @click="addIndustryDlgIsShow" />
+        <el-select v-model="markValue" @focus="markSelectFocus" multiple placeholder="请选择关联标的">
+          <el-option v-for="item in markOptions" :key="item.IndustrialSubjectId" :value="item.IndustrialSubjectId" :label="item.SubjectName"> </el-option>
+        </el-select>
+        <img v-if="!isSource" src="~@/assets/img/set_m/add_ico.png" style="margin: 0 0 0 10px" @click="isAddMarketDlg" />
+        <el-form-item prop="publishTime">
+          <el-date-picker style="margin-left: 30px" v-model="addOfEditForm.publishTime" type="date" placeholder="请选择发布时间" format="yyyy-MM-dd" value-format="yyyy-MM-dd"> </el-date-picker>
+        </el-form-item>
+      </el-card>
+
+      <el-card style="margin-top: 30px">
+        <div class="box">
+          <div>
+            <el-form-item prop="title" style="display: inline-block">
+              <el-input style="width: 360px; margin-right: 30px" v-model="addOfEditForm.title" placeholder="请输入报告标题"></el-input>
+            </el-form-item>
+            <el-form-item prop="synopsis" style="display: inline-block; margin-right: 30px">
+              <el-input style="width: 360px" v-model="addOfEditForm.synopsis" placeholder="请输入摘要"></el-input>
+            </el-form-item>
+            <el-form-item prop="mobile" style="display: inline-block">
+              <el-input v-if="isSource === 'HZ'" style="width: 360px" v-model="addOfEditForm.mobile" placeholder="请输入作者"></el-input>
+
+              <el-autocomplete
+                v-else
+                style="width: 380px"
+                class="inline-input"
+                v-model="addOfEditForm.mobile"
+                :fetch-suggestions="authorCallbackHandle"
+                placeholder="请输入作者（昵称+“-”+备注，例：阿银-xxxxxxxxxx）"
+                :trigger-on-focus="false"
+                @select="authorSelectHandle"
+                clearable
+              >
+              </el-autocomplete>
+            </el-form-item>
+          </div>
+          <div style="display: inline-block; margin-bottom: 20px" v-if="addOfEditForm.regions == 1">
+            <el-button type="primary" @click="dialogVisible = true">纪要内容输入模板</el-button>
+          </div>
+        </div>
+        <el-form-item prop="content">
+          <froala id="froala-editor" ref="froalaEditor" :tag="'textarea'" :config="froalaConfig" v-model="addOfEditForm.content"></froala>
+        </el-form-item>
+        <el-form-item>
+          <div class="report-link" v-if="articleTypeName === '路演精华'">
+            <span class="report-word">报告链接：</span>
+            <el-input placeholder="请输入报告链接" v-model="addOfEditForm.reportLink"></el-input>
+          </div>
+        </el-form-item>
+        <el-form-item class="form-item-bootm">
+          <div style="color: #f00; font-size: 16px" v-if="isSource !== 'HZ'">*报告发布前，请在核心观点/核心结论下加分割线</div>
+          <el-button type="primary" @click="submitForm('预览')">预览</el-button>
+          <el-button type="primary" @click="submitForm('保存')">保存</el-button>
+          <el-button type="primary" @click="submitForm('发布')" v-if="isShowStatus">发布</el-button>
+          <el-button @click="cancelBtn">取消</el-button>
+        </el-form-item>
+      </el-card>
+    </el-form>
+
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="纪要内容模板" :visible.sync="dialogVisible" width="35%" :before-close="handleClose">
+      <div id="dialog" v-html="copyText"></div>
+      <div style="margin-bottom: 60px">
+        <p class="no-cv" style="color: #f00">注：多场调研访谈时，请插入水平线分隔</p>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取消</el-button>
+        <el-button id="copy_text" type="primary" :data-clipboard-text="copyTxt" @click="handleCopyFun">复制模版</el-button>
+      </span>
+    </el-dialog>
+    <add-industry-mark
+      optionFormregion="研选"
+      :source="2"
+      :addIndustryDlg.sync="addIndustryDlg"
+      :addMarkDlg.sync="addMarkDlg"
+      @commitIndustryDlg="commitIndustryDlg"
+      @commitMarkDlg="commitMarkDlg"
+      :addMarkUpVal="addMarkUpVal"
+    />
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      title="添加报告类型"
+      :visible.sync="addReportDialogVisible"
+      width="500px"
+      :before-close="reportHandleClose"
+      append-to-body
+    >
+      <div>
+        <el-input style="width: 100%; margin-bottom: 20px" placeholder="请输入类型名称" clear v-model.trim="reportTypeVal"></el-input>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="reportHandleClose">取消</el-button>
+        <el-button type="primary" @click="addReportConfirm">确定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import VueFroala from "vue-froala-wysiwyg";
+import Clipboard from "clipboard";
+import chartDialogVue from "../../dataEntry_manage/components/chartDialog.vue";
+import AddIndustryMark from "../components/addIndustryMark.vue";
+import RichTextMixins from "./reportComponents/RichTextMixins";
+export default {
+  name: "",
+  components: { AddIndustryMark },
+  mixins: [RichTextMixins],
+  data() {
+    var that = this;
+    return {
+      copyText:
+        " <div><p>#核心观点：</p> <p>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</p></div><div><p>#访谈时间：</p><p>2021.01.01</p></div><div><p>#纪要详情：</p><p>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</p></div><div><p>#专家评价：</p><p>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</p></div>",
+      copyTxt: `#核心观点：
+XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
+
+#访谈时间：
+2021.01.01
+
+#纪要详情：
+XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
+
+#专家评价：
+XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX`,
+      defaultProps: {
+        label: "PermissionName",
+        children: "List",
+        value: "ChartPermissionId",
+      },
+      industryArr: [], //
+      markValue: "",
+      markOptions: [],
+      addOfEditFormregion: "", //行业选择
+      addIndustryDlg: false, //
+      addMarkDlg: false,
+      addMarkUpVal: {
+        industrialName: "",
+        industrialId: "",
+      }, //弹框里的
+      articleId: 0,
+      addOfEditForm: {
+        content: "",
+        title: "",
+        synopsis: "",
+        mobile: "", // 预览的作者 用的 mobile 。。。。
+        // 头像
+        ImgUrl: "",
+        // 昵称
+        nickName: "",
+        reportLink: "",
+        regions: "",
+        property: "",
+        indication: "",
+        publishTime: "",
+        industry: "", //行业
+      },
+      rulesOption: {
+        regions: [{ required: true, message: "请选择报告类型", trigger: "change" }],
+        property: [{ required: true, message: "请选择产业", trigger: "change" }],
+        publishTime: [{ required: true, message: "请选择发布时间", trigger: "change" }],
+        title: [{ required: true, message: "请输入报告标题", trigger: "blur" }],
+        synopsis: [{ required: true, message: "请输入摘要", trigger: "blur" }],
+        mobile: [{ required: true, message: "请输入作者", trigger: "blur" }],
+        industry: [{ required: true, message: "请选择行业", trigger: "change" }],
+      },
+      chartPermissionList: [], //行业的数组
+      dialogVisible: false,
+      isShowStatus: true,
+      ummary: 0,
+      indicationPostOptins: [], //标的数组v-model
+      indicationOption: [], //行业数组
+      propertyOption: [], //产业数组
+      addReportDialogVisible: false, //添加报告类型
+      reportTypeVal: "", //添加报告类型的输入框
+      synopsisText: [], //
+      articleTypeName: "", //报告类型的名称
+      isSource: "",
+      numNum: 0,
+      timeInterval: null,
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    this.isSource = this.$route.query.type;
+    this.addOfEditForm.mobile = this.isSource === "HZ" ? "弘则内容组" : "";
+    this.chartPermission(); //获取基础的报告类型数据
+    this.getIndustry();
+    if (this.$route.query.id) {
+      // 编辑进来的
+      this.getsummaryManagedetail();
+    } else {
+      this.dataInit();
+    }
+  },
+  methods: {
+    // 报告的缓存处理数据
+    dataInit() {
+      if (sessionStorage.getItem(this.isSource == "HZ" ? "addSummaryParamsHZ" : "addSummaryParamsQY")) {
+        let data = JSON.parse(sessionStorage.getItem(this.isSource == "HZ" ? "addSummaryParamsHZ" : "addSummaryParamsQY"));
+        setTimeout(() => {
+          this.addOfEditForm = {
+            industry: data.ChartPermissionId, //HZ  行业
+            regions: data.ArticleTypeId,
+            title: data.Title,
+            content: data.Body,
+            synopsis: data.Abstract,
+            mobile: data.SellerAndMobile,
+            ImgUrl: data.ImgUrl,
+            nickName: data.NickName,
+            reportLink: data.ReportLink,
+            publishTime: data.PublishDate,
+            property: data.IndustrialManagementIds,
+          };
+          this.articleTypeName = data.ArticleTypeName;
+          this.markValue = data.IndustrialSubjectIds;
+          data.IndustrialManagementIds && this.markSelectFocus();
+        }, 200);
+      }
+      this.timeInterval = setInterval(() => {
+        let params = {
+          Abstract: this.addOfEditForm.synopsis,
+          Body: this.addOfEditForm.content,
+          SellerAndMobile: this.addOfEditForm.mobile,
+          NickName: this.addOfEditForm.nickName,
+          ImgUrl: this.addOfEditForm.ImgUrl,
+          Title: this.addOfEditForm.title,
+          ArticleTypeId: this.addOfEditForm.regions,
+          IndustrialSubjectIds: this.markValue,
+          IndustrialManagementIds: this.addOfEditForm.property, //产业
+          PublishDate: this.addOfEditForm.publishTime,
+          ReportLink: this.addOfEditForm.reportLink,
+          ChartPermissionId: this.addOfEditForm.industry,
+        };
+        sessionStorage.setItem(this.isSource == "HZ" ? "addSummaryParamsHZ" : "addSummaryParamsQY", JSON.stringify(params));
+        this.numNum++;
+      }, 120000);
+    },
+    //点击了添加产业
+    addIndustryDlgIsShow() {
+      if (this.addOfEditForm.regions) {
+        this.addIndustryDlg = true;
+      } else {
+        this.addIndustryDlg = false;
+        this.$message.error("请选选择报告类型");
+      }
+    },
+    //报告类型的选择事件
+    regionsChange(e) {
+      this.articleTypeName = this.chartPermissionList.find((item) => item.ArticleTypeId == e).ArticleTypeName;
+      let str = this.synopsisText.find((item) => item.ArticleTypeId == e);
+    },
+    //进来编辑的 获取内容的事件
+    async getsummaryManagedetail() {
+      const res =
+        this.isSource === "HZ"
+          ? await raiInterface.reportArticleDetail({ ArticleId: this.$route.query.id })
+          : await raiInterface.getsummaryManagedetail({
+              ArticleId: this.$route.query.id,
+            });
+      if (res.Ret !== 200) return;
+      this.addOfEditForm = {
+        industry: res.Data.ChartPermissionId, //HZ  行业
+        regions: res.Data.ArticleTypeId,
+        content: res.Data.Body,
+        title: res.Data.Title,
+        synopsis: res.Data.Abstract,
+        mobile: res.Data.SellerAndMobile,
+        ImgUrl: res.Data.ImgUrl,
+        nickName: res.Data.NickName,
+        reportLink: res.Data.ReportLink,
+        publishTime: res.Data.PublishDate,
+        property: res.Data.ListIndustrial ? res.Data.ListIndustrial.map((item) => [item.ChartPermissionId, item.IndustrialManagementId]) : "",
+      };
+      this.articleId = res.Data.ArticleId;
+      this.articleTypeName = res.Data.ArticleTypeName;
+      this.markValue = res.Data.ListSubject ? res.Data.ListSubject.map((item) => item.IndustrialSubjectId) : [];
+      this.isShowStatus = res.Data.PublishStatus == 0;
+      this.markSelectFocus();
+    },
+    //表单保存发布事件
+    submitForm: _.debounce(async function (type) {
+      let validateFieldList = [];
+      this.$refs.addOfEditForm.validateField([this.isSource === "HZ" ? "industry" : "regions", "property", "publishTime", "title", "synopsis", "mobile"], (valid) => {
+        validateFieldList.push(valid);
+      });
+      let industrialManagementIds = this.addOfEditForm.property && this.addOfEditForm.property.map((item) => item[1]);
+      if (validateFieldList.every((item) => item === "")) {
+        let params = {
+          Abstract: this.addOfEditForm.synopsis,
+          Body: this.addOfEditForm.content,
+          SellerAndMobile: this.addOfEditForm.mobile,
+          NickName: this.addOfEditForm.nickName,
+          ImgUrl: this.addOfEditForm.ImgUrl,
+          DoType: type == "保存" ? 0 : 1,
+          Title: this.addOfEditForm.title,
+          ArticleTypeId: this.addOfEditForm.regions,
+          ArticleId: this.$route.query.id ? Number(this.$route.query.id) : 0,
+          IndustrialSubjectIds: this.markValue.length ? this.markValue.join(",") : "",
+          IndustrialManagementIds: industrialManagementIds.join(","), //产业
+          PublishDate: this.addOfEditForm.publishTime,
+          ReportLink: this.addOfEditForm.reportLink,
+          ChartPermissionId: this.addOfEditForm.industry,
+        };
+        if (type == "预览") {
+          if (!this.isShowStatus) {
+            let href = `${process.env.CYGX_WEB}/material/info/${this.$route.query.id}`;
+            window.open(href, "_blank");
+          } else {
+            sessionStorage.setItem("summaryPre", JSON.stringify(params));
+            let { href } = this.$router.resolve({ name: "预览研选报告" });
+            window.open(href, "_blank");
+          }
+          return;
+        } else {
+          const res = this.isSource === "HZ" ? await raiInterface.reportPreserveAndPublish(params) : await raiInterface.preserveAndPublish(params);
+          if (res.Ret === 200) {
+            clearInterval(this.timeInterval);
+            this.$message.success("操作成功！");
+            sessionStorage.removeItem(this.isSource == "HZ" ? "addSummaryParamsHZ" : "addSummaryParamsQY");
+            this.$refs.addOfEditForm.resetFields();
+            this.$router.back();
+          }
+        }
+      }
+    }, 500),
+    //表单取消事件
+    cancelBtn() {
+      clearInterval(this.timeInterval);
+      this.$refs.addOfEditForm.resetFields();
+      sessionStorage.removeItem(this.isSource == "HZ" ? "addSummaryParamsHZ" : "addSummaryParamsQY");
+      this.$router.back();
+    },
+    //获取行业
+    async chartPermission() {
+      const res = this.isSource === "HZ" ? await raiInterface.getNoTacticsfirst() : await raiInterface.summaryManageArticleType();
+      if (res.Ret === 200) {
+        this.chartPermissionList = res.Data.List || [];
+        this.synopsisText = res.Data.AbstractList || [];
+      }
+    },
+    // 操作：点击了复制按钮
+    handleCopyFun() {
+      let clipboard = new Clipboard("#copy_text");
+      clipboard.on("success", (e) => {
+        this.$message({
+          type: "success",
+          message: "复制成功!",
+        });
+        this.dialogVisible = false;
+        clipboard.destroy(); // 释放内存
+      });
+      clipboard.on("error", (e) => {
+        // 不支持复制
+        this.$Message.info("该浏览器不支持自动复制");
+        clipboard.destroy(); // 释放内存
+      });
+    },
+    //作者的联想事件，单个 回调
+    async authorCallbackHandle(data, cb) {
+      const res = await raiInterface.departmentList({ KeyWord: data });
+      this.addOfEditForm.ImgUrl = "";
+      this.addOfEditForm.nickName = "";
+      if (res.Ret === 200) {
+        let arr = res.Data.List
+          ? res.Data.List.map((item) => {
+              return { ...item, value: item.Content };
+            })
+          : [];
+        cb(arr);
+      } else {
+        cb([]);
+      }
+    },
+    // 作者选择事件
+    authorSelectHandle(e) {
+      // 同步头像
+      this.addOfEditForm.ImgUrl = e.ImgUrl;
+      this.addOfEditForm.nickName = e.NickName;
+      // console.log(e);
+    },
+    //添加报告类型的事件
+    addRepotrTypeHandel() {
+      this.reportTypeVal = "";
+      this.addReportDialogVisible = true;
+    },
+    //添加报告类型弹框的取消事件
+    reportHandleClose() {
+      this.reportTypeVal = "";
+      this.addReportDialogVisible = false;
+    },
+    //添加报告类型弹框的确定事件
+    async addReportConfirm() {
+      if (!this.reportTypeVal) return this.$message.error("输入内容不能为空");
+      const res = await raiInterface.addSummaryManageArticleType({ ArticleTypeName: this.reportTypeVal });
+      if (res.Ret === 200) {
+        this.reportTypeVal = "";
+        this.addReportDialogVisible = false;
+        this.$message.success("添加成功");
+        this.chartPermission();
+      }
+    },
+    propertyChange() {
+      this.markOptions = [];
+      this.markValue = "";
+    },
+    // 选择报告类型
+    industrySelectFocus(value) {
+      if (!value) return;
+      if (this.addOfEditForm.industry || this.addOfEditForm.regions) {
+        this.getIndustry();
+      } else {
+        this.industryArr = [];
+        this.$message.error(this.isSource === "HZ" ? "请先选择行业" : "请先选择报告类型");
+      }
+    },
+    //添加标的的点击事件
+    isAddMarketDlg() {
+      if (this.addOfEditForm.property.length) {
+        let arr = this.addOfEditForm.property.flat(Infinity);
+        this.addMarkUpVal.industrialId = arr[1];
+        this.industryArr.forEach((item) => {
+          if (item.ChartPermissionId == arr[0]) {
+            item.List.forEach((key) => {
+              if (key.ChartPermissionId == arr[1]) {
+                this.addMarkUpVal.industrialName = key.PermissionName;
+              }
+            });
+          }
+        });
+        if (this.addOfEditForm.property.length > 1) {
+          this.$message.error("已选多个产业，无法添加标的");
+        } else {
+          this.addMarkDlg = true;
+        }
+      } else {
+        this.$message.error("未选择产业，无法添加标的");
+      }
+    },
+    //点击添加标的的下拉选择框
+    markSelectFocus() {
+      if (!this.addOfEditForm.property.length) {
+        this.$message.error("请先选择产业");
+      } else {
+        let arr = this.addOfEditForm.property.map((item) => item[1]);
+        raiInterface
+          .getindustrialSubjectlistIds({
+            IndustrialManagementIdStr: arr.join(","),
+            ArticleId: this.articleId,
+          })
+          .then((res) => {
+            if (res.Ret === 200) {
+              this.markOptions = res.Data.List || [];
+            }
+          });
+      }
+    },
+    // 子组件来的事件 产业
+    commitIndustryDlg(data) {
+      this.getIndustry();
+      this.addOfEditForm.property.push([Number(data.ChartPermissionId), Number(data.NewId)]);
+      this.$refs["addOfEditForm"].clearValidate();
+    },
+    // 子组件来的事件 标的
+    commitMarkDlg(data) {
+      raiInterface
+        .getindustrialSubjectlistIds({
+          IndustrialManagementIdStr: this.addMarkUpVal.industrialId,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.markOptions = res.Data.List || [];
+          }
+        });
+      this.markValue = data.split(",").map((item) => Number(item));
+    },
+    /* 获取全部的行业 */
+    getIndustry() {
+      raiInterface.getListIndustrial().then((res) => {
+        if (res.Ret === 200) {
+          this.industryArr = res.Data.List || [];
+        }
+      });
+    },
+  },
+  // 路由离开了 清除定时器
+  beforeRouteLeave(to, from, next) {
+    clearInterval(this.timeInterval);
+    next();
+  },
+};
+</script>
+<style lang="scss">
+.add-report-type {
+  padding-left: 20px;
+  display: flex;
+  align-items: center;
+  height: 34px;
+  color: #409eff;
+  cursor: pointer;
+  img {
+    margin-right: 5px;
+  }
+}
+.container-summary {
+  .card-top {
+    .el-card__body {
+      padding-bottom: 0 !important;
+    }
+    .el-form-item {
+      display: inline-block;
+      margin-right: 10px;
+    }
+    .inline-input {
+      margin-right: 10px;
+    }
+    .el-input {
+      width: 360px;
+    }
+  }
+  .fr-second-toolbar {
+    display: none;
+  }
+  .report-link {
+    display: flex;
+    align-items: center;
+    .report-word {
+      flex-shrink: 0;
+    }
+    .el-input {
+      display: inline-block;
+    }
+  }
+  #dialog {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    color: #333;
+    font-size: 14px;
+    div {
+      margin-bottom: 40px;
+    }
+  }
+  .box {
+    display: flex;
+    justify-content: space-between;
+  }
+  .form-item-bootm {
+    margin-top: 50px;
+    text-align: center;
+    .el-button {
+      margin-right: 20px;
+    }
+  }
+  .no-cv {
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+}
+.fr-visible {
+  display: none !important;
+}
+</style>

src/views/rai_manage/components/addThisWeek.vue

@@ -0,0 +1,386 @@
+<template>
+  <!-- 本周研究汇总添加/编辑 -->
+  <div class="add-summarizing">
+    <el-card>
+      <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item prop="title">
+              <el-input v-model="ruleForm.title" placeholder="请输入标题"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item prop="author">
+              <el-input v-model="ruleForm.author" placeholder="请输入作者"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item prop="time">
+              <el-date-picker type="date" placeholder="选择发布时间" value-format="yyyy-MM-dd" v-model="ruleForm.time"></el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item prop="explain">
+          <el-input v-model="ruleForm.explain" placeholder="请输入摘要"></el-input>
+        </el-form-item>
+      </el-form>
+      <!-- //深度报告篇 -->
+      <div class="content-list">
+        <div class="list-top">
+          <span>深度报告篇</span>
+          <input maxlength="1" :class="isSortSdbgShow ? '' : 'red'" v-model="SortSdbg" placeholder="序号" onkeyup="value=value.replace(/[^A-Z]/g,'')" />
+          <el-tooltip class="item" placement="top-start">
+            <div slot="content">
+              一级分类的序号请以大写字母A\B\C\D...排序 <br />
+              二级分类请以1\2\3\4...排序
+            </div>
+            <i class="el-icon-info"></i>
+          </el-tooltip>
+        </div>
+        <div class="list-ul" v-for="(item, index) in ListSdbg" :key="item.ChartPermissionId">
+          <div class="list-title">
+            <img :src="item.IcoLink" alt="" />
+            <span>{{ item.ChartPermissionName }}</span>
+            <input maxlength="1" :class="item.isShow ? 'red' : ''" placeholder="序号" v-model="item.ChartPermissionSort" onkeyup="value=value.replace(/[^\d]/g,'')" />
+          </div>
+          <div class="list-li">
+            <div v-for="(val, num) in item.List" :key="num" class="list-children">
+              <div class="box">
+                <!-- <el-input type="textarea" :rows="4" placeholder="请输入文字描述" v-model="val.Body"></el-input> -->
+                <froala :id="num + 'froala'" :ref="num + 'froala'" :tag="'textarea'" :config="froalaConfig" v-model="val.Body"></froala>
+                <el-input v-model="val.ReportLink" placeholder="请输入报告链接"></el-input>
+              </div>
+              <img @click="deleteListSdbg(item, num, index, '深度报告篇')" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <p @click="addListSdbg(item, index, '深度报告篇')" :class="item.List && item.List.length > 0 ? 'active' : ''">+添加栏目</p>
+          </div>
+        </div>
+      </div>
+      <!-- //产业调研纪要篇 -->
+      <div class="content-list">
+        <div class="list-top">
+          <span>产业调研纪要篇</span>
+          <input maxlength="1" :class="isSortCydyjyShow ? '' : 'red'" v-model="SortCydyjy" placeholder="序号" onkeyup="value=value.replace(/[^A-Z]/g,'')" />
+        </div>
+        <div class="list-ul" v-for="(item, index) in ListCydyjy" :key="item.ChartPermissionId">
+          <div class="list-title">
+            <img :src="item.IcoLink" alt="" />
+            <span>{{ item.ChartPermissionName }}</span>
+            <input maxlength="1" placeholder="序号" :class="item.isShow ? 'red' : ''" v-model="item.ChartPermissionSort" onkeyup="value=value.replace(/[^\d]/g,'')" />
+          </div>
+          <div class="list-li">
+            <div v-for="(val, num) in item.List" :key="num" class="list-children">
+              <div class="box">
+                <!-- <el-input type="textarea" :rows="4" placeholder="请输入文字描述" v-model="val.Body"></el-input> -->
+                <froala :id="num + 'froalaCy'" :ref="num + 'froalaCy'" :tag="'textarea'" :config="froalaConfig" v-model="val.Body"></froala>
+                <el-input v-model="val.ReportLink" placeholder="请输入报告链接"></el-input>
+              </div>
+              <img @click="deleteListSdbg(item, num, index, '产业调研纪要篇')" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <p @click="addListSdbg(item, index, '产业调研纪要篇')" :class="item.List && item.List.length > 0 ? 'active' : ''">+添加栏目</p>
+          </div>
+        </div>
+      </div>
+      <!-- //上市公司调研纪要篇 -->
+      <div class="content-list">
+        <div class="list-top">
+          <span>上市公司调研纪要篇</span>
+          <input maxlength="1" :class="isSortSsgsShow ? '' : 'red'" v-model="SortSsgs" placeholder="序号" onkeyup="value=value.replace(/[^A-Z]/g,'')" />
+        </div>
+        <div class="list-ul" v-for="(item, index) in ListSsgs" :key="item.ChartPermissionId">
+          <div class="list-title">
+            <img :src="item.IcoLink" alt="" />
+            <span>{{ item.ChartPermissionName }}</span>
+            <input maxlength="1" placeholder="序号" :class="item.isShow ? 'red' : ''" v-model="item.ChartPermissionSort" onkeyup="value=value.replace(/[^\d]/g,'')" />
+          </div>
+          <div class="list-li">
+            <div v-for="(val, num) in item.List" :key="num" class="list-children">
+              <div class="box">
+                <!-- <el-input type="textarea" :rows="4" placeholder="请输入文字描述" v-model="val.Body"></el-input> -->
+                <froala :id="num + 'froalaCy'" :ref="num + 'froalaCy'" :tag="'textarea'" :config="froalaConfig" v-model="val.Body"></froala>
+                <el-input v-model="val.ReportLink" placeholder="请输入报告链接"></el-input>
+              </div>
+              <img @click="deleteListSdbg(item, num, index, '上市公司调研纪要篇')" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <p @click="addListSdbg(item, index, '上市公司调研纪要篇')" :class="item.List && item.List.length > 0 ? 'active' : ''">+添加栏目</p>
+          </div>
+        </div>
+      </div>
+      <!-- //事件点评 -->
+      <div class="content-list">
+        <div class="list-top">
+          <span>市场QA汇总</span>
+          <input maxlength="1" :class="isSortSjdpShow ? '' : 'red'" v-model="SortSjdp" placeholder="序号" onkeyup="value=value.replace(/[^A-Z]/g,'')" />
+        </div>
+        <div class="list-ul">
+          <div class="list-li">
+            <div v-for="(item, index) in ListSjdp" :key="index" class="list-children">
+              <div class="box">
+                <froala :id="item + 'froalaDp'" :ref="item + 'froalaDp'" :tag="'textarea'" :config="froalaConfig" v-model="item.Body"></froala>
+                <el-input v-model="item.ReportLink" :class="item.isShow ? 'red' : ''" placeholder="请输入报告链接"></el-input>
+              </div>
+              <img @click="deleteListSjdp(item, index)" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <p @click="addListSjdp(item, index)" :class="ListSjdp && ListSjdp.length > 0 ? 'active' : ''">+添加栏目</p>
+          </div>
+        </div>
+      </div>
+      <!-- //本周晨会精华 -->
+      <div class="content-list">
+        <div class="list-top">
+          <span>本周晨会精华</span>
+          <input maxlength="1" :class="isSortBzchjhShow ? '' : 'red'" v-model="SortBzchjh" placeholder="序号" onkeyup="value=value.replace(/[^A-Z]/g,'')" />
+        </div>
+        <div class="list-ul" v-for="(item, index) in ListBzchjh" :key="item.ChartPermissionId">
+          <div class="list-title">
+            <img :src="item.IcoLink" alt="" />
+            <span>{{ item.ChartPermissionName }}</span>
+            <input maxlength="1" placeholder="序号" :class="item.isShow ? 'red' : ''" v-model="item.ChartPermissionSort" onkeyup="value=value.replace(/[^\d]/g,'')" />
+          </div>
+          <div class="list-li">
+            <div v-for="(val, num) in item.List" :key="num" class="list-children">
+              <div class="box">
+                <froala :id="num + 'froalaJh'" :ref="num + 'froalaJh'" :tag="'textarea'" :config="froalaConfig" v-model="val.Body"></froala>
+                <el-input v-model="val.ReportLink" placeholder="请输入报告链接"></el-input>
+              </div>
+              <img @click="deleteListSdbg(item, num, index, '本周晨会精华')" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <p @click="addListSdbg(item, index, '本周晨会精华')" :class="item.List && item.List.length > 0 ? 'active' : ''">+添加栏目</p>
+          </div>
+        </div>
+      </div>
+      <!-- //严选 -->
+      <!-- <div class="content-list">
+        <div class="list-top">
+          <span>买方研选</span>
+          <input maxlength="1" :class="isSortYanxShow ? '' : 'red'" v-model="SortYanx" placeholder="序号" onkeyup="value=value.replace(/[^A-Z]/g,'')" />
+        </div>
+        <div class="list-ul" v-for="(item, index) in ListYanx" :key="item.ChartPermissionId">
+          <div class="list-title">
+            <img :src="item.IcoLink" alt="" />
+            <span>{{ item.ChartPermissionName }}</span>
+            <input maxlength="1" placeholder="序号" :class="item.isShow ? 'red' : ''" v-model="item.ChartPermissionSort" onkeyup="value=value.replace(/[^\d]/g,'')" />
+          </div>
+          <div class="list-li">
+            <div v-for="(val, num) in item.List" :key="num" class="list-children">
+              <div class="box">
+                <froala :id="num + 'froalaJh'" :ref="num + 'froalaJh'" :tag="'textarea'" :config="froalaConfig" v-model="val.Body"></froala>
+                <el-input v-model="val.ReportLink" placeholder="请输入报告链接"></el-input>
+              </div>
+              <img @click="deleteListSdbg(item, num, index, '研选')" src="~@/assets/img/icons/delete-Item.png" />
+            </div>
+            <p @click="addListSdbg(item, index, '研选')" :class="item.List && item.List.length > 0 ? 'active' : ''">+添加栏目</p>
+          </div>
+        </div>
+      </div> -->
+      <div class="more-button">
+        <el-button type="primary" @click="confirm('预览')">预览</el-button>
+        <el-button type="primary" @click="confirm('保存')">保存</el-button>
+        <el-button v-if="isShowStatus" type="primary" @click="confirm('发布')">发布</el-button>
+        <el-button type="" @click="cancel">取消</el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import mixinsRichText from "./selection/mixins";
+export default {
+  name: "",
+  components: {},
+  props: {},
+  data() {
+    var that = this;
+    return {
+      //深度报告篇
+      ListSdbg: [],
+      SortSdbg: "",
+      //本周晨会精华
+      ListBzchjh: [],
+      SortBzchjh: "",
+      //事件点评
+      ListSjdp: [],
+      SortSjdp: "",
+      // //研选
+      // ListYanx: [],
+      // SortYanx: "",
+      isShowStatus: true,
+      isSortSdbgShow: true,
+      isSortBzchjhShow: true,
+      isSortSjdpShow: true,
+      // isSortYanxShow: true,
+    };
+  },
+  mixins: [mixinsRichText],
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    window.addEventListener("beforeunload", this.beforeunloadFn);
+    if (this.$route.query.id) {
+      this.getDetail();
+    } else {
+      this.getList();
+    }
+  },
+  destroyed() {
+    window.removeEventListener("beforeunload", this.beforeunloadFn);
+  },
+  methods: {
+    beforeunloadFn(e) {
+      e = e || window.event;
+      if (e) {
+        e.returnValue = "关闭提示";
+      }
+      return "关闭提示";
+    },
+    //获取模板
+    async getList() {
+      const res = await raiInterface.chartPermissiondetailTemplate();
+      if (res.Ret === 200) {
+        this.ListSdbg = res.Data.ListSdbg;
+        this.ListCydyjy = res.Data.ListCydyjy;
+        this.ListBzchjh = res.Data.ListBzchjh;
+        this.ListSsgs = res.Data.ListSsgs;
+        this.SortBzchjh = res.Data.SortBzchjh;
+        this.SortCydyjy = res.Data.SortCydyjy;
+        this.SortSdbg = res.Data.SortSdbg;
+        this.SortSsgs = res.Data.SortSsgs;
+        //研选
+        // this.ListYanx = res.Data.ListYanx;
+        // this.SortYanx = res.Data.SortYanx;
+      }
+    },
+
+    //事件点评 添加
+    addListSjdp(item, indx) {
+      this.ListSjdp.push({ Body: "", ReportLink: "" });
+    },
+    //事件点评 删除
+    deleteListSjdp(item, index) {
+      this.ListSjdp.splice(index, 1);
+    },
+    //获取详情
+    async getDetail() {
+      const res = await raiInterface.researchSummaryDetail({
+        ArticleId: this.$route.query.id,
+      });
+      if (res.Ret === 200) {
+        this.isShowStatus = res.Data.PublishStatus == 0;
+        this.initGetList(res.Data.ListSdbg);
+        this.initGetList(res.Data.ListCydyjy);
+        this.initGetList(res.Data.ListBzchjh);
+        this.initGetList(res.Data.ListSsgs);
+        // this.initGetList(res.Data.ListYanx);
+        //研选
+        // this.ListYanx = res.Data.ListYanx;
+        this.ListSdbg = res.Data.ListSdbg;
+        this.ListCydyjy = res.Data.ListCydyjy;
+        this.ListBzchjh = res.Data.ListBzchjh;
+        this.ListSsgs = res.Data.ListSsgs;
+        this.ListSjdp = res.Data.ListSjdp || [];
+        this.SortBzchjh = res.Data.SortBzchjh;
+        this.SortCydyjy = res.Data.SortCydyjy;
+        this.SortSdbg = res.Data.SortSdbg;
+        this.SortSjdp = res.Data.SortSjdp;
+        this.SortSsgs = res.Data.SortSsgs;
+        // this.SortYanx = res.Data.SortYanx;
+        this.ruleForm = {
+          title: res.Data.Title, //标题
+          author: res.Data.Department, //作者
+          time: res.Data.PublishDate, //时间
+          explain: res.Data.Abstract, //说明
+        };
+      }
+    },
+    //保存 发布
+    confirm: _.debounce(function (type) {
+      this.$refs.ruleForm.validate(async (val) => {
+        if (!val) return;
+        const isFlag = await this.fnConFirm();
+        if (isFlag) return;
+        let params = {
+          Abstract: this.ruleForm.explain,
+          ArticleId: this.$route.query.id ? Number(this.$route.query.id) : 0,
+          Department: this.ruleForm.author,
+          DoType: type == "发布" ? 1 : 0,
+          PublishDate: this.ruleForm.time.replace(/\./g, "-"),
+          Title: this.ruleForm.title,
+          Content: {
+            ListBzchjh: this.ListBzchjh,
+            ListCydyjy: this.ListCydyjy,
+            ListSdbg: this.ListSdbg,
+            ListSjdp: this.ListSjdp,
+            ListSsgs: this.ListSsgs,
+            SortBzchjh: this.SortBzchjh,
+            SortCydyjy: this.SortCydyjy,
+            SortSdbg: this.SortSdbg,
+            SortSjdp: this.SortSjdp,
+            SortSsgs: this.SortSsgs,
+            // ListYanx: this.ListYanx,
+            // SortYanx: this.SortYanx,
+          },
+        };
+        if (type == "预览") {
+          sessionStorage.setItem("thisWeekPre", JSON.stringify(params));
+          let { href } = this.$router.resolve({ name: "预览本周汇总" });
+          window.open(href, "_blank");
+        } else {
+          const res = await raiInterface.researchSummaryPreserveAndPublish(params);
+          if (res.Ret === 200) {
+            this.$message.success(`${type}成功!`);
+            this.$refs["ruleForm"].resetFields();
+            this.$router.back();
+          }
+        }
+      });
+    }, 500),
+    fnConFirm() {
+      let flag = false;
+      let isSdbg = this.ListSdbg.some((item) => item.List.length > 0); //深度报告篇
+      let isCydyjy = this.ListCydyjy.some((item) => item.List.length > 0); //产业调研
+      let Bzchjh = this.ListBzchjh.some((item) => item.List.length > 0); //本周晨选
+      let Ssgs = this.ListSsgs.some((item) => item.List.length > 0); //上司公司
+      // let Yanx = this.ListYanx.some((item) => item.List.length > 0); //严选
+      this.isSortSdbgShow = !(isSdbg && !this.SortSdbg);
+      this.isSortCydyjyShow = !(isCydyjy && !this.SortCydyjy);
+      this.isSortBzchjhShow = !(Bzchjh && !this.SortBzchjh);
+      this.isSortSsgsShow = !(Ssgs && !this.SortSsgs); //上司公司
+      // this.isSortYanxShow = !(Yanx && !this.SortYanx); //严选 输入框
+      this.isSortSjdpShow = !(this.ListSjdp.length !== 0 && !this.SortSjdp);
+      if ((isSdbg && !this.SortSdbg) || (isCydyjy && !this.SortCydyjy) || (Bzchjh && !this.SortBzchjh) || (this.ListSjdp.length !== 0 && !this.SortSjdp)) {
+        this.$message.warning("有内容的报告分类和行业分类，序号不能为空");
+        return (flag = true);
+      }
+      let str = new Array(this.SortSdbg, this.SortCydyjy, this.SortBzchjh, this.SortSjdp, this.SortSsgs);
+      let isStr = str.sort();
+      for (var i = 0; i < isStr.length - 1; i++) {
+        if (isStr[i] == isStr[i + 1] && (isStr[i] || isStr[i + 1])) {
+          this.$message.warning("请勿填写重复的序号!");
+          return (flag = true);
+        }
+      }
+      let chidrenSdbg = this.chidrenList(this.ListSdbg);
+      let chidrenCydyjy = this.chidrenList(this.ListCydyjy);
+      let chidrenBzchjh = this.chidrenList(this.ListBzchjh);
+      let chidrenSsgs = this.chidrenList(this.ListSsgs);
+      if (chidrenSdbg || chidrenCydyjy || chidrenBzchjh || chidrenSsgs) {
+        this.$message.warning("有内容行业分类，序号不能为空");
+        return (flag = true);
+      }
+    },
+
+    //取消
+    cancel() {
+      this.$refs["ruleForm"].resetFields();
+      this.$router.back();
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.add-summarizing {
+  @import "./selection/strictSelection.scss";
+}
+</style>

src/views/rai_manage/components/apply/RichTextMixins.js

@@ -0,0 +1,64 @@
+export default {
+  data() {
+    var that = this;
+    return {
+      froalaConfig: {
+        toolbarButtons: [
+          "textColor",
+          "bold",
+          "italic",
+          "underline",
+          "strikeThrough",
+          "fontFamily",
+          "fontSize",
+          "color",
+          "paragraphStyle",
+          "lineHeight",
+          "paragraphFormat",
+          "align",
+          "insertHR",
+          "undo",
+          "redo",
+        ],
+        height: 450,
+        fontSize: ["12", "14", "16", "18", "20", "24", "28", "32", "36", "40"],
+        fontSizeDefaultSelection: "16",
+        theme: "dark", //主题
+        placeholderText: "请输入活动内容",
+        language: "zh_cn", //国际化
+        imageUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url
+        videoUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url
+        fileUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url 更多上传介绍 请访问https://www.froala.com/wysiwyg-editor/docs/options
+        imageDefaultWidth: false,
+        quickInsertButtons: ["image", "table", "ul", "ol", "hr"], //快速插入项
+        toolbarVisibleWithoutSelection: true, //是否开启 不选中模式
+        toolbarSticky: false, //操作栏是否自动吸顶
+        saveInterval: 0,
+        events: {
+          initialized: function () {
+            that.editor = this;
+          },
+          keyup: function (e, editor) {
+            //添加事件，在每次按键按下时，都记录一下最后停留位置
+            that.$nextTick(function () {
+              that.lastEditRange = getSelection().getRangeAt(0);
+            });
+          },
+          click: function (e, editor) {
+            //添加事件，在每次鼠标点击时，都记录一下最后停留位置
+            that.$nextTick(function () {
+              that.lastEditRange = getSelection().getRangeAt(0);
+            });
+          },
+        },
+        charCounterCount: false,
+        reportloadding: false,
+        lastsavetime: "",
+        isAddEnter: false, //是否已经添加过
+        timer: null,
+        ischange: false,
+        isPublishloading: false,
+      },
+    };
+  },
+};

src/views/rai_manage/components/apply/applyDialog.vue

@@ -0,0 +1,336 @@
+<template>
+  <div class="container-applydialog">
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      :visible.sync="addDialogVisible"
+      :customClass="[isType && addDialogType !== '新增预约纪要' ? 'container-applydial' : 'container-custom']"
+      :before-close="handleClose"
+    >
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.add" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">{{ addDialogType }}</span>
+      </div>
+      <div class="inline" v-for="(item, index) in dynamicItem" :key="index">
+        <div class="inline-content">
+          <el-autocomplete
+            class="inline-input"
+            v-model="item.name"
+            :fetch-suggestions="callbackHandle"
+            placeholder="请输入姓名"
+            @input="getCompany(item.name)"
+            @select="selectCompany(item, index)"
+            @blur="focusCompany(item.name)"
+            :trigger-on-focus="false"
+            clearable
+          ></el-autocomplete>
+          <template v-if="selectionArr && selectionArr.length && selectionArr[0].ActivityTypeName == '公司调研电话会'">
+            <div class="radio-content" v-if="selectionArr[0].IsResearchPoints != 1">
+              <el-radio v-model="item.radio" label="1">预约外呼</el-radio>
+              <el-radio v-model="item.radio" label="2" v-if="selectionArr[0].LimitPeopleNum > 0">自主拨入</el-radio>
+            </div>
+            <div style="margin: 0 20px" v-if="selectionArr[0].IsCanAppointmentMinutes > 0">
+              <el-checkbox v-model="item.checked">同时预约纪要</el-checkbox>
+            </div>
+          </template>
+          <template v-else>
+            <div v-if="isType && addDialogType !== '新增预约纪要'" class="radio-content">
+              <el-radio v-model="item.radio" label="1">预约外呼</el-radio>
+              <el-radio v-model="item.radio" label="2">自主拨入</el-radio>
+            </div>
+            <div style="margin: 0 20px" v-if="isShowSummary && signUpAdd !== '易董' && signUpAdd !== '专项'">
+              <el-checkbox v-model="item.checked">同时预约纪要</el-checkbox>
+            </div>
+          </template>
+          <div style="width: 20px"><img @click="deleteItem(item, index)" src="~@/assets/img/icons/delete-Item.png" :class="index == 0 ? 'defaultyi' : ''" alt="" /></div>
+        </div>
+        <p v-if="item.isShow">系统中无此人，请先将其添加到对应公司的联系人列表下</p>
+      </div>
+      <div class="add-box">
+        <img @click="addItem" :src="$icons.addblue" alt="" />
+        <span @click="addItem">添加</span>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmPerson">确定</el-button>
+        <el-button @click="handleClose">取消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    addDialogVisible: {
+      type: Boolean,
+      default: false,
+    },
+    dialogVisibleId: {
+      type: Number,
+    },
+    selectList: {
+      type: String,
+    },
+    signUpAdd: {
+      type: String,
+    },
+    minimumSummation: {
+      type: Number,
+    },
+    tabsPitchonType: {
+      type: Number,
+    },
+    selectionArr: {
+      type: Array,
+      required: true,
+      default: [],
+    },
+    addDialogType: {
+      type: String,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      dynamicItem: [{ name: "", isShow: false, radio: "1", checked: false }],
+      companyList: [], //客户名称的数组
+      timeout: null, //
+      isShow: "",
+      warningIsShow: false,
+      userId: "",
+      userTyepa: [],
+    };
+  },
+  computed: {
+    isType() {
+      if (this.selectionArr.length > 0) {
+        return this.selectionArr.some(
+          (item) => item.ActivityTypeName == "公司调研电话会" || item.ActivityTypeName == "专家电话会" || item.ActivityTypeName == "分析师电话会" || item.IsYidongConduct == 1
+        );
+      }
+    },
+    isShowSummary() {
+      return (this.addDialogType == "新增外呼人员" || this.addDialogType == "新增报名") && !this.selectionArr.some((item) => item.ActivityTypeName == "公司调研电话会" && item.LimitPeopleNum !== 0);
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    async confirmPerson() {
+      let addSignuUser = this.addSignuUser();
+      this.measurement();
+      const is = this.dynamicItem.some((item) => item.isShow == true);
+      if (is) return this.$message.error("姓名有误");
+      if (!this.userId) return this.$message.error("请输入姓名！");
+      const res =
+        (this.isType && this.addDialogType != "新增预约纪要") || this.signUpAdd == "报名" || this.signUpAdd == "易董" || this.signUpAdd == "c类"
+          ? await raiInterface.activitySignupAddSignuUser({
+              ActivityIds: this.selectList,
+              List: addSignuUser,
+            })
+          : this.signUpAdd == "专项"
+          ? await raiSpecial.addUserSpecial({
+              ActivityIds: this.selectList,
+              List: addSignuUser,
+            })
+          : this.addDialogType == "新增预约纪要"
+          ? await raiInterface.activityAddSummaryUser({
+              ActivityIds: this.selectList,
+              UserIds: this.userId,
+            })
+          : await raiInterface.activitySignupAddUser({
+              ActivityIds: this.selectList,
+              List: addSignuUser,
+            });
+
+      if (res.Ret === 200) {
+        this.$message.success("添加成功");
+        this.$parent.getsDataList();
+      }
+      this.userId = "";
+      this.userTyep = [];
+      (this.dynamicItem = [{ name: "", isShow: false, radio: "1", checked: false }]), this.$emit("update:addDialogVisible", false);
+    },
+    addSignuUser() {
+      let arr = [];
+      this.dynamicItem.forEach((item) => {
+        if (item.name) {
+          arr.push({
+            IsAppointment: item.checked ? 1 : 0,
+            UserId: item.id,
+            SignupType: this.isType ? +item.radio : 0,
+          });
+        }
+      });
+      return arr;
+    },
+    // 添加数组
+    addItem() {
+      if (this.signUpAdd == "报名" && this.minimumSummation == this.dynamicItem.length) return this.$message.warning(`所选活动最多还能添加${this.minimumSummation}人`);
+      this.dynamicItem.push({
+        name: "",
+        isShow: false,
+        radio: "1",
+        checked: false,
+      });
+    },
+    // 删除数组的某一项
+    deleteItem(item, index) {
+      this.dynamicItem.splice(index, 1);
+    },
+    /* 获取客户名称 */
+    getCompany(query) {
+      if (query.includes(",")) return;
+      if (query) {
+        raiInterface
+          .activitySignupUserList({
+            KeyWord: query,
+          })
+          .then((res) => {
+            if (res.Ret === 200) {
+              let arr = [];
+              res.Data.List &&
+                res.Data.List.forEach((item) => {
+                  let obj = {
+                    ...item,
+                    value: item.RealName + " , " + item.Mobile + " , " + item.CompanyName,
+                  };
+                  arr.push(obj);
+                });
+              this.companyList = arr;
+            }
+          });
+      } else {
+        this.companyList = [];
+      }
+    },
+    callbackHandle(data, cb) {
+      let results = data
+        ? this.companyList.filter((item) => {
+            return item.value.includes(data);
+          })
+        : this.companyList;
+      clearTimeout(this.timeout);
+      this.timeout = setTimeout(() => {
+        cb(results);
+      }, 300);
+      if (results.length == 0) {
+        this.warningIsShow = true;
+      } else {
+        this.warningIsShow = false;
+      }
+    },
+    //退出弹框
+    handleClose() {
+      this.userId = "";
+      this.userTyep = [];
+      this.dynamicItem = [{ name: "", isShow: false, radio: "1", checked: false }];
+      this.$parent.addDialogVisible = false;
+    },
+    //失去焦点
+    focusCompany(name) {
+      if ((name.length && this.companyList.length == 0) || this.warningIsShow) {
+        this.dynamicItem.forEach((item) => {
+          if (item.name == name) {
+            item.isShow = true;
+          }
+        });
+      } else {
+        this.dynamicItem.forEach((item) => {
+          if (item.name == name) {
+            item.isShow = false;
+          }
+        });
+      }
+    },
+    //联想选择后
+
+    selectCompany(val, index) {
+      this.companyList.forEach((item) => {
+        if (item.value == val.name) {
+          this.dynamicItem.splice(index, 1, { name: val.name, isShow: false, radio: val.radio, id: item.UserId, checked: this.dynamicItem[index].checked });
+        }
+      });
+    },
+    //最后的确定 遍历
+    measurement() {
+      const arr = [];
+      const userIds = [];
+      this.dynamicItem.forEach((item) => {
+        if (item.name) {
+          let obj = {
+            Uid: item.id,
+            Type: item.radio,
+          };
+          userIds.push(item.id);
+          arr.push(obj);
+        }
+      });
+      this.userId = userIds.length ? userIds.join(",") : "";
+      this.userTyep = JSON.stringify(arr);
+    },
+  },
+};
+</script>
+<style lang="scss">
+.container-applydialog {
+  .container-custom {
+    width: 700px;
+  }
+  .container-applydial {
+    width: 900px;
+  }
+  .inline {
+    margin-bottom: 20px;
+    width: 100%;
+    .inline-input {
+      width: 392px !important;
+    }
+    p {
+      padding-top: 5px;
+      font-size: 14px;
+      font-family: PingFang SC;
+      font-weight: 500;
+      line-height: 20px;
+      color: #ef5858;
+      opacity: 1;
+    }
+  }
+  .inline-content {
+    padding-right: 20px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    img {
+      width: 14px;
+      height: 14px;
+    }
+  }
+  .defaultyi {
+    display: none !important;
+  }
+  .el-input {
+    width: 392px !important;
+  }
+  .add-box {
+    display: flex;
+    align-items: center;
+    color: #5882ef;
+    img {
+      width: 16px;
+      height: 16px;
+      margin-right: 10px;
+    }
+  }
+  .radio-content {
+    display: flex;
+    justify-content: space-between;
+    margin: 0 30px;
+  }
+}
+</style>

src/views/rai_manage/components/apply/applyTableColums.js

@@ -0,0 +1,483 @@
+//表格列
+export const tableColums = (type) => {
+  return type === 1
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+        },
+        {
+          label: "手机号码",
+          key: "Mobile",
+        },
+        {
+          label: "外呼号码",
+          key: "OutboundMobile",
+        },
+        {
+          label: "公司名称",
+          key: "CompanyName",
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+        },
+        {
+          label: "报名时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 2
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+        },
+        {
+          label: "公司名称",
+          key: "CompanyName",
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+        },
+        {
+          label: "报名时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 3
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+        },
+
+        {
+          label: "公司名称",
+          key: "CompanyName",
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+        },
+        {
+          label: "报名时间",
+          key: "CreateTime",
+        },
+        {
+          label: "失败原因",
+          key: "FailType",
+        },
+      ]
+    : [
+        {
+          label: "姓名",
+          key: "RealName",
+        },
+        {
+          label: "手机号码",
+          key: "Mobile",
+        },
+
+        {
+          label: "公司名称",
+          key: "CompanyName",
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+        },
+        {
+          label: "报名时间",
+          key: "CreateTime",
+        },
+        {
+          label: "失败原因",
+          key: "FailType",
+        },
+      ];
+};
+
+export const ListTitle = [
+  {
+    PermissionName: "专家/分析师电话会",
+    ChartPermissionId: 1,
+  },
+  {
+    PermissionName: "分析师电话会（C类）",
+    ChartPermissionId: 4,
+  },
+  {
+    PermissionName: "专家/分析师线下沙龙",
+    ChartPermissionId: 2,
+  },
+  {
+    PermissionName: "公司调研",
+    ChartPermissionId: 3,
+  },
+];
+
+export const purchaserListTitle = [
+  {
+    PermissionName: "专家电话会",
+    ChartPermissionId: 1,
+  },
+  {
+    PermissionName: "专家线下沙龙",
+    ChartPermissionId: 2,
+  },
+  {
+    PermissionName: "买方线下交流",
+    ChartPermissionId: 5,
+  },
+  {
+    PermissionName: "公司调研",
+    ChartPermissionId: 3,
+  },
+];
+
+//表格列
+export const TableApplyColums = (type) => {
+  return type === 1
+    ? [
+        {
+          label: "活动名称",
+          key: "ActivityName",
+          minwidthsty: "300",
+        },
+        {
+          label: "行业",
+          key: "ChartPermissionName",
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypeName",
+          minwidthsty: "110",
+        },
+        {
+          label: "活动标签",
+          key: "Label",
+          minwidthsty: "120",
+        },
+        {
+          label: "活动状态",
+          key: "ActiveState",
+          minwidthsty: "80",
+        },
+        {
+          label: "发布状态",
+          key: "PublishStatus",
+          minwidthsty: "80",
+        },
+        {
+          label: "活动时间",
+          key: "ActivityTimeText",
+          minwidthsty: "200",
+        },
+        {
+          label: "报名人数限制",
+          key: "LimitPeopleNum",
+          minwidthsty: "105",
+        },
+        {
+          label: "当前报名人数",
+          key: "SignupPeopleNum",
+          minwidthsty: "105",
+        },
+        {
+          label: "报名失败人数",
+          key: "SignupFailPeopleNum",
+          minwidthsty: "130",
+        },
+        {
+          label: "消息提醒人数",
+          key: "ReminderPeopleNum",
+          minwidthsty: "105",
+        },
+        {
+          label: "预约纪要人数",
+          key: "AppointmentPeopleNum",
+          minwidthsty: "105",
+        },
+        {
+          label: "带问",
+          key: "AskNum",
+          minwidthsty: "70",
+        },
+      ]
+    : type === 2
+    ? [
+        {
+          label: "活动名称",
+          key: "ActivityName",
+          minwidthsty: "350",
+        },
+        {
+          label: "行业",
+          key: "ChartPermissionName",
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypeName",
+          minwidthsty: "120",
+        },
+        {
+          label: "活动标签",
+          key: "Label",
+          minwidthsty: "120",
+        },
+        {
+          label: "活动时间",
+          key: "ActivityTimeText",
+          minwidthsty: "219",
+        },
+        {
+          label: "活动状态",
+          key: "ActiveState",
+          minwidthsty: "80",
+        },
+        {
+          label: "发布状态",
+          key: "PublishStatus",
+          minwidthsty: "80",
+        },
+        {
+          label: "报名人数限制",
+          key: "LimitPeopleNum",
+          minwidthsty: "130",
+        },
+        {
+          label: "当前报名人数",
+          key: "SignupPeopleNum",
+          minwidthsty: "130",
+        },
+        {
+          label: "报名失败人数",
+          key: "SignupFailPeopleNum",
+          minwidthsty: "130",
+        },
+        {
+          label: "预约纪要人数",
+          key: "AppointmentPeopleNum",
+          minwidthsty: "130",
+        },
+      ]
+    : type === 3
+    ? [
+        {
+          label: "活动名称",
+          key: "ActivityName",
+          minwidthsty: "300",
+        },
+        {
+          label: "行业",
+          key: "ChartPermissionName",
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypeName",
+          minwidthsty: "120",
+        },
+        {
+          label: "活动标签",
+          key: "Label",
+          minwidthsty: "120",
+        },
+        {
+          label: "活动时间",
+          key: "ActivityTimeText",
+          minwidthsty: "219",
+        },
+        {
+          label: "活动状态",
+          key: "ActiveState",
+          minwidthsty: "80",
+        },
+        {
+          label: "发布状态",
+          key: "PublishStatus",
+          minwidthsty: "80",
+        },
+        {
+          label: "报名人数限制",
+          key: "LimitPeopleNum",
+          minwidthsty: "105",
+        },
+        {
+          label: "当前报名人数",
+          key: "SignupPeopleNum",
+          minwidthsty: "105",
+        },
+        {
+          label: "报名失败人数",
+          key: "SignupFailPeopleNum",
+          minwidthsty: "130",
+        },
+        {
+          label: "会议提醒人数",
+          key: "ReminderPeopleNum",
+          minwidthsty: "105",
+        },
+        {
+          label: "预约纪要人数",
+          key: "AppointmentPeopleNum",
+          minwidthsty: "105",
+        },
+      ]
+    : [
+        {
+          label: "活动名称",
+          key: "ActivityName",
+          minwidthsty: "350",
+        },
+        {
+          label: "行业",
+          key: "ChartPermissionName",
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypeName",
+          minwidthsty: "150",
+        },
+        {
+          label: "活动标签",
+          key: "Label",
+          minwidthsty: "120",
+        },
+        {
+          label: "活动时间",
+          key: "ActivityTimeText",
+          minwidthsty: "219",
+        },
+        {
+          label: "活动状态",
+          key: "ActiveState",
+          minwidthsty: "80",
+        },
+        {
+          label: "发布状态",
+          key: "PublishStatus",
+          minwidthsty: "80",
+        },
+        {
+          label: "报名人数限制",
+          key: "LimitPeopleNum",
+          minwidthsty: "130",
+        },
+        {
+          label: "当前报名人数",
+          key: "SignupPeopleNum",
+          minwidthsty: "130",
+        },
+        {
+          label: "报名失败人数",
+          key: "SignupFailPeopleNum",
+          minwidthsty: "130",
+        },
+        {
+          label: "消息提醒人数",
+          key: "ReminderPeopleNum",
+          minwidthsty: "130",
+        },
+        {
+          label: "预约纪要人数",
+          key: "AppointmentPeopleNum",
+          minwidthsty: "105",
+        },
+      ];
+};
+
+export const StatusSelect = [
+  {
+    name: "未开始",
+    value: 1,
+  },
+  {
+    name: "进行中",
+    value: 2,
+  },
+  {
+    name: "已结束",
+    value: 3,
+  },
+];
+
+export const PublishSelect = [
+  {
+    name: "已发布",
+    value: "1",
+  },
+  {
+    name: "未发布",
+    value: "0",
+  },
+  {
+    name: "已取消",
+    value: "3",
+  },
+];
+
+export const SearchResultTable = [
+  {
+    label: "姓名",
+    key: "RealName",
+  },
+  {
+    label: "手机号码",
+    key: "Mobile",
+  },
+  {
+    label: "参会次数",
+    key: "TotalMeeting",
+  },
+];
+
+export const DetailedTable = [
+  {
+    label: "活动名称",
+    key: "ActivityName",
+    minwidthsty: "300",
+  },
+  {
+    label: "活动时间",
+    key: "ActivityTimeText",
+    widthsty: "215",
+  },
+  {
+    label: "首次入会时间",
+    key: "FirstMeetingTime",
+    widthsty: 160,
+  },
+  {
+    label: "最后退出时间",
+    key: "LastMeetingTime",
+    widthsty: 160,
+  },
+  {
+    label: "参与总时长",
+    key: "Duration",
+    widthsty: 96,
+  },
+  {
+    label: "参会方式",
+    key: "MeetingTypeStr",
+    widthsty: 80,
+  },
+  {
+    label: "参会鉴权",
+    key: "MeetingAuthentication",
+    widthsty: 80,
+  },
+  {
+    label: "参会状态",
+    key: "MeetingStatusStr",
+    widthsty: 80,
+  },
+];
+
+export const NameListDownload = [
+  { type: "全部名单", value: 0 },
+  { type: "预约外呼名单", value: 1 },
+  { type: "自主入会（自主拨入）名单", value: 2 },
+];

src/views/rai_manage/components/apply/particularsDialog.vue

@@ -0,0 +1,395 @@
+<template>
+  <div class="container-particulars">
+    <el-dialog
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      :append-to-body="true"
+      :visible.sync="particularsDialogVisible"
+      :before-close="okBtn"
+      :width="subscribe == '报名失败详情' ? '1000px' : '1100px'"
+    >
+      <div slot="title" style="display: flex; align-items: center">
+        <img v-if="subscribe == '预约外呼详情'" :src="$icons.delay" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <img v-else :src="$icons.warntop" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">{{ subscribe }}</span>
+      </div>
+      <div class="content-box">
+        <div class="top-text" style="margin-bottom: 20px">
+          <span v-if="subscribe == '报名失败详情'">
+            <template v-if="memberType == 'Admin'"> 共有{{ total }}人名失败 </template>
+            <template v-else-if="memberType == 'Sale'"> 共有{{ total }}名失败，其中本人名下客户{{ myTotal }}人 </template>
+            <template v-else> 共有{{ total }}名失败，其中本组名下客户{{ myTotal }}人 </template>
+          </span>
+          <span v-else-if="subscribe == '预约外呼详情' || subscribe == '报名详情' || Teleconference">
+            <template v-if="memberType == 'Admin'"> 共有{{ total }}人{{ AppointmentCall ? "预约外呼" : "报名" }} </template>
+            <template v-else-if="memberType == 'Sale'"> 共有{{ total }}人{{ AppointmentCall ? "预约外呼" : "报名" }}，其中本人名下客户{{ myTotal }}人 </template>
+            <template v-else> 共有{{ total }}人{{ AppointmentCall ? "预约外呼" : "报名" }}，其中本组名下客户{{ myTotal }}人 </template>
+          </span>
+        </div>
+        <div class="table-box">
+          <el-table height="400px" :data="dataList" border style="width: 100%">
+            <el-table-column min-width="80" align="center" prop="RealName" key="name" label="姓名"></el-table-column>
+            <el-table-column v-if="isMobileShow" min-width="115" align="center" prop="Mobile" key="mobile" label="手机号"></el-table-column>
+            <el-table-column v-if="isOutboundMobileShow" min-width="140" align="center" key="outboundMobile" label="外呼号码">
+              <template slot-scope="scope">
+                <span>{{ scope.row.OutboundMobile }}</span>
+                <img @click="modification(scope.row.Id, scope.row.OutboundMobile)" :src="$icons.amend" style="color: #fff; width: 12px; height: 12px; margin-left: 5px; vertical-align: middle" />
+              </template>
+            </el-table-column>
+
+            <el-table-column min-width="135" align="center" prop="CompanyName" key="company" label="公司名称"></el-table-column>
+            <el-table-column min-width="110" align="center" prop="SellerName" key="seller" label="所属销售"></el-table-column>
+            <el-table-column v-if="isSignupTypeShow" min-width="110" key="meeting" align="center" label="参会方式">
+              <template slot-scope="{ row }">
+                <span>
+                  {{ row.SignupType == 1 ? "预约外呼" : row.SignupType == 2 ? "自主拨入" : row.SignupType == 4 ? "自主入会" : "--" }}
+                </span>
+              </template>
+            </el-table-column>
+
+            <!-- <el-table-column v-if="subscribe !== '报名失败详情' && Teleconference && isLimitPeople == 0" align="center" prop="CreateTime" key="create" min-width="160" label="预约时间"></el-table-column> -->
+            <el-table-column prop="CreateTime" key="createTime" align="center" min-width="160" label="报名时间"></el-table-column>
+            <el-table-column v-if="subscribe == '报名失败详情'" align="center" prop="" key="fail" label="失败原因">
+              <template slot-scope="scope">
+                <span>{{ scope.row.FailType == 1 ? "总人数已满" : scope.row.FailType == 2 ? "单机构超限制" : scope.row.FailType == 3 ? "爽约次数超限" : "" }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column v-if="subscribe == '报名失败详情' && Teleconference && isLimitPeople == 1" key="callopen" min-width="330" align="center" prop="" label="操作">
+              <template slot-scope="scope">
+                <el-radio-group v-model="scope.row.CallOperation">
+                  <el-radio :disabled="isFullNum" v-for="item in radioArr" :key="item.id" :label="item.id" @change="redioChange(item.id, scope.row.Id, scope.row)">{{ item.name }}</el-radio>
+                </el-radio-group>
+              </template>
+            </el-table-column>
+            <el-table-column v-if="excelType == 'YiDong'" align="center" prop="" key="YiDong" label="操作">
+              <template slot-scope="{ row }">
+                <span :style="yidongStyle(row)">{{ yidongStatus(row) }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column v-if="isCancelApply" min-width="135" align="center" prop="" key="cz1" label="操作">
+              <template slot-scope="scope">
+                <span class="editsty" @click="cancelApply(scope.row, 0)">取消报名</span>
+              </template>
+            </el-table-column>
+            <el-table-column
+              min-width="215"
+              key="salonopen"
+              v-if="subscribe == '报名失败详情' && ((Teleconference && isLimitPeople == 0) || AppointmentCall || excelType == 'ExpertSalon' || excelType == 'OfflineResearch')"
+              align="center"
+              prop=""
+              label="操作"
+            >
+              <template slot-scope="scope">
+                <el-switch :disabled="isFullNum" @change="switchChange(scope.row)" v-model="scope.row.SalonOperation" active-text="加入报名" inactive-text="限制报名"> </el-switch>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <div style="margin: 10px 0" v-if="subscribe !== '报名失败详情' && subscribe !== '预约外呼详情'">
+          <span style="margin-left: 30px">
+            <el-button type="primary" v-if="AppointmentCall || this.excelType == 'CClass'|| this.excelType == 'Teleconference'" @click="appointmentCallDownloadHandler">下载名单</el-button>
+            <a :href="exportUser" download v-else>
+              <el-button type="primary">下载名单</el-button>
+            </a>
+          </span>
+          <el-button style="margin-left: 30px" v-if="subscribe == '预约外呼详情' || (Teleconference && subscribe !== '报名失败详情')" type="primary" plain @click="okBtn">取消</el-button>
+          <el-button v-else style="margin-left: 30px" type="primary" plain @click="okBtn">知道了</el-button>
+        </div>
+        <div v-if="subscribe == '报名失败详情'">
+          <el-button style="margin: 10px 0" type="primary" @click="okBtn">知道了</el-button>
+        </div>
+      </div>
+    </el-dialog>
+    <edit-mobile :editMobileDialogVisible.sync="editMobileDialogVisible" :editMobileId="editMobileId" :outboundMobile="outboundMobile" />
+    <el-dialog v-dialogDrag width="390px" title="下载名单" :append-to-body="true" :visible.sync="isNameListDownloadShow" :modal-append-to-body="false" @close="isNameListDownloadShow = false">
+      <div>
+        <el-select style="width: 100%" v-model="downloadTypeName" placeholder="请选择">
+          <el-option v-for="item in nameListDownload" :key="item.value" :label="item.type" :value="item.value"> </el-option>
+        </el-select>
+      </div>
+      <div style="display: flex; justify-content: center; margin: 30px 0 20px">
+        <el-button type="primary" @click="handleConfirmDownload">确定</el-button>
+        <el-button type="primary" plain @click="isNameListDownloadShow = false">取消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import EditMobile from "../editMobile.vue";
+import { NameListDownload } from "./applyTableColums";
+export default {
+  name: "",
+  components: { EditMobile },
+  props: {
+    particularsDialogVisible: {
+      type: Boolean,
+      default: false,
+    },
+    subscribe: {
+      type: String,
+      default: "报名详情",
+    },
+    dialogVisibleId: {
+      type: Number,
+    },
+  },
+  data() {
+    return {
+      page_no: 1,
+      PageSize: 10,
+      dataList: [], //表格
+      value1: true,
+      radioArr: [
+        {
+          name: "限制报名",
+          id: 3,
+        },
+        {
+          name: "预约外呼",
+          id: 1,
+        },
+        {
+          name: "自主拨入",
+          id: 2,
+        },
+      ],
+      excelType: "", //下载类型
+      excelId: "", //下载的id
+      total: "", //条数
+      myTotal: "", //条数
+      isLimitPeople: "", //条数
+      memberType: "", //
+      editMobileDialogVisible: false, //
+      editMobileId: "", //
+      outboundMobile: "",
+      isFullNum: false, //报名人数是否已满
+      isNameListDownloadShow: false, //下载名单弹框
+      downloadTypeName: 0,
+      isYidongConduct: false, // 是否是易懂
+    };
+  },
+  computed: {
+    // 下载
+    exportUser() {
+      if (this.Teleconference || this.subscribe == "预约外呼详情") {
+        return process.env.API_ROOT + "/cygx/activitySignup/callExport?ActivityId=" + this.excelId + "&" + localStorage.getItem("auth") || "";
+      } else {
+        return process.env.API_ROOT + "/cygx/activitySignup/signupFailExport?ActivityId=" + this.excelId + "&" + localStorage.getItem("auth") || "";
+      }
+    },
+    // 手机号是否展示
+    isMobileShow() {
+      return this.AppointmentCall || this.Teleconference || this.excelType == "YiDong" || this.isYidongConduct || this.excelType == "OfflineResearch";
+    },
+    // 预约外呼是否展示
+    isOutboundMobileShow() {
+      return (this.AppointmentCall || this.Teleconference || this.isYidongConduct || this.excelType == "OfflineResearch") && this.isCancelApply;
+    },
+    // 是否展示参会方式
+    isSignupTypeShow() {
+      return (this.Teleconference || this.AppointmentCall || this.isYidongConduct || this.excelType == "OfflineResearch") && this.subscribe == "报名详情";
+    },
+    isCancelApply() {
+      return this.subscribe !== "报名失败详情";
+    },
+    nameListDownload() {
+      return NameListDownload;
+    },
+    Teleconference() {
+      return this.excelType == "Teleconference";
+    },
+    AppointmentCall() {
+      return this.excelType == "AppointmentCall";
+    },
+  },
+  watch: {
+    particularsDialogVisible() {
+      if (this.particularsDialogVisible) {
+        if (this.subscribe == "报名失败详情") {
+          this.dataList = [];
+          this.salonFailSignupList();
+        } else {
+          this.dataList = [];
+          this.getsDataList();
+        }
+      }
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    // 关闭弹框
+    okBtn() {
+      this.$parent.particularsDialogVisible = false;
+    },
+    //列表表格
+    getsDataList() {
+      raiInterface
+        .appointmentList({
+          ActivityId: this.dialogVisibleId,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.excelType = res.Data.ExcelType;
+          this.excelId = res.Data.ActivityId;
+          this.total = res.Data.Total;
+          this.myTotal = res.Data.MyTotal;
+          this.isLimitPeople = res.Data.IsLimitPeople;
+          this.memberType = res.Data.MemberType;
+          this.isFullNum = res.Data.IsFull;
+          this.isYidongConduct = res.Data.IsYidongConduct == 1 ? true : false;
+          this.$nextTick(() => {
+            this.dataList = res.Data.List;
+          });
+        });
+    },
+    // 报名失败的列表
+    salonFailSignupList() {
+      raiInterface
+        .salonFailSignupList({
+          ActivityId: this.dialogVisibleId,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.excelType = res.Data.ExcelType;
+          this.excelId = res.Data.ActivityId;
+          this.total = res.Data.Total;
+          this.myTotal = res.Data.MyTotal;
+          this.isLimitPeople = res.Data.IsLimitPeople;
+          this.memberType = res.Data.MemberType;
+          this.isFullNum = res.Data.IsFull;
+          this.isYidongConduct = res.Data.IsYidongConduct == 1 ? true : false;
+          this.$nextTick(() => {
+            this.dataList = res.Data.List;
+          });
+        });
+    },
+    // 报名方式的选择
+    redioChange(name, id, row) {
+      raiInterface
+        .callSignupEdit({
+          Id: id,
+          OperationStatus: name,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.$message.success("操作成功");
+        });
+    },
+    switchChange(item) {
+      raiInterface
+        .salonSignupEdit({
+          Id: item.Id,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.$message.success("操作成功");
+            this.$parent.getsDataList();
+          } else {
+            item.SalonOperation = !item.SalonOperation;
+          }
+        });
+    },
+    // 点击了修改预约外呼
+    modification(id, value) {
+      this.editMobileDialogVisible = true;
+      this.editMobileId = id;
+      this.outboundMobile = value;
+    },
+    //取消报名
+    cancelApply(item, num) {
+      if (num == 1) {
+        const str = item.ActivityTime.replace(/-/g, "/");
+        const date = new Date(str);
+        const times = date.getTime();
+        const num = new Date().getTime();
+        if (times - num <= 3600000) return this.$message.error("外呼名单已发送专家组，请联系专家组取消");
+      }
+      let str = num == 1 ? "外呼" : "报名";
+      this.$confirm(`确定要取消该用户的${str}吗？`, `取消${str}`, {
+        confirmButtonText: "是",
+        cancelButtonText: "否",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = await raiInterface.activitySignupApply({
+            SignupId: item.Id,
+            CancelClass: num,
+          });
+          console.log(res);
+          if (res.Ret !== 200) return;
+          this.$message({
+            type: "success",
+            message: `取消${str}成功!`,
+          });
+          this.getsDataList();
+          this.$parent.getsDataList();
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消操作",
+          });
+        });
+    },
+    //文字显示
+    yidongStatus(row) {
+      let str = row.YidongExamineStatus == 0 ? "待审核" : row.YidongExamineStatus == 1 ? "审核通过" : "未通过";
+      return str;
+    },
+    yidongStyle(row) {
+      const style = row.YidongExamineStatus == 0 ? "color: #3385FF" : row.YidongExamineStatus == 1 ? "color: #07C635" : "color: #D7584F";
+      return style;
+    },
+    // 专家/分析师电话会 下载名单 弹框
+    appointmentCallDownloadHandler() {
+      this.downloadTypeName = 0;
+      this.isNameListDownloadShow = true;
+    },
+    // 专家/分析师电话会 下载名单 确定事件
+    handleConfirmDownload() {
+      let url = process.env.API_ROOT + "/cygx/activitySignup/signupFailExport?ActivityId=" + this.excelId + "&ExcelType=" + this.downloadTypeName + "&" + localStorage.getItem("auth") || "";
+      let a = document.createElement("a"); // 创建a标签
+      a.href = url; // 设置下载地址
+      a.download = ""; // 设置下载文件名
+      a.click();
+      this.isNameListDownloadShow = false;
+      this.downloadTypeName = 0;
+    },
+  },
+};
+</script>
+<style lang="less">
+.container-particulars {
+  .table-box {
+    margin: 20px auto;
+  }
+  .top-text {
+    display: flex;
+    align-items: center;
+    div {
+      margin-left: 20px;
+    }
+  }
+  .el-radio {
+    margin-right: 15px !important;
+  }
+  .el-switch__label {
+    color: #606266;
+    font-size: 14px;
+    font-weight: 400;
+  }
+  .is-active {
+    color: #409eff !important;
+  }
+  .el-radio__label {
+    font-weight: 400;
+  }
+}
+</style>

src/views/rai_manage/components/apply/searchCustomerDlg.vue

@@ -0,0 +1,185 @@
+<template>
+  <div class="container search-customer-dlg">
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="搜索流失客户" :visible.sync="searchCustomer" :before-close="searchCancelHandle" width="529px">
+      <div>
+        <p style="margin: 10px 0 10px">搜索有线上参会记录的流失客户</p>
+        <el-autocomplete
+          class="inline-input"
+          style="width: 100%"
+          v-model="clientName"
+          clearable
+          :fetch-suggestions="querySearch"
+          placeholder="请输入客户名称"
+          :trigger-on-focus="false"
+        >
+        <template slot-scope="scope">
+           <div v-if="scope.item.CompanyName">
+            {{ scope.item.CompanyName }}
+          </div>
+          <div v-else style="text-align: center">暂无数据</div>
+        </template>
+        </el-autocomplete>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button style="width: 224px; margin-right: 20px" type="primary" @click="searchConfirmHandle">确 定</el-button>
+        <el-button style="width: 224px" @click="searchCancelHandle">取 消</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="搜索结果" :visible.sync="resultCustomer" :before-close="resultCancelHandle" width="529px">
+      <div class="result-table">
+        <div class="result-text">
+          <p>客户名称：{{ resultDate.CompanyName }}</p>
+          <p>所属销售：{{ resultDate.SellerName }}</p>
+        </div>
+        <el-table :data="resultDateList" content border height="300">
+          <el-table-column v-for="item in searchResultTable" :key="item.key" :label="item.label" :width="item.widthsty" align="center">
+            <template slot-scope="{ row }">
+              <span @click="handleRowClick(row, item.key)" :class="item.key == 'TotalMeeting' ? 'editsty' : ''">
+                {{ handleRowContent(row, item.key) }}
+              </span>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </el-dialog>
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="参会明细" :visible.sync="detailedVisibleDlg" :before-close="detaileCancelHandle" width="1242px">
+      <div style="margin-bottom: 30px">
+        <div style="margin-bottom: 20px">
+          <span style="margin-right: 30px">姓名：{{ detailedDate.RealName }}</span>
+          <span>手机号：{{ detailedDate.Mobile }}</span>
+        </div>
+        <el-table :data="detailedDateList" content border height="350">
+          <el-table-column v-for="item in detailedTable" :key="item.key" :label="item.label" :width="item.widthsty" :min-width="item.minwidthsty" align="center">
+            <template slot-scope="{ row }">
+              <span> {{ row[item.key] }}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+
+import { SearchResultTable, DetailedTable } from "./applyTableColums";
+export default {
+  name: "",
+  components: {},
+  props: {
+    searchCustomer: {
+      default: false,
+    },
+  },
+  data() {
+    return {
+      clientName: "", //无相关流失客户
+      clientList: "", //
+      //结果
+      resultCustomer: false,
+      resultDateList: [],
+      resultDate: {},
+      //明细
+      detailedVisibleDlg: false,
+      detailedDateList: [],
+      detailedDate: {},
+    };
+  },
+  computed: {
+    searchResultTable() {
+      return SearchResultTable;
+    },
+    detailedTable() {
+      return DetailedTable;
+    },
+  },
+  watch: {},
+  created() {},
+  mounted() {},
+  methods: {
+    //搜索的确定
+    async searchConfirmHandle() {
+      if (!this.clientName) return this.$message.error("请输入客户名称");
+      if (!this.clientList.length) return this.$message.error("无相关流失客户");
+      const res = await raiInterface.getActivityLossUser({ CompanyName: this.clientName });
+      if (res.Ret === 200) {
+        this.resultDate = res.Data;
+        this.resultDateList = res.Data.List || [];
+        this.resultCustomer = true;
+      }
+    },
+    //搜索的联想
+    async querySearch(queryString, cb) {
+      cb([]);
+      if (queryString) {
+        const res = await raiInterface.getActivityLossCompany({ KeyWord: queryString });
+        if (res.Ret === 200) {
+          this.clientList = res.Data.List || [];
+          if (res.Data && res.Data.List.length > 0) {
+            let arr = res.Data.List.map((item) => {
+              return { value: item.CompanyName, ...item };
+            });
+            cb(arr);
+          } else {
+            cb([{}]);
+          }
+        }
+      }
+    },
+
+    handleRowContent(row, key) {
+      return row[key];
+    },
+    async handleRowClick(row, key) {
+      if (key == "TotalMeeting") {
+        const res = await raiInterface.getActivityLossMeet({
+          Mobile: row.Mobile,
+        });
+        if (res.Ret === 200) {
+          this.detailedDate = res.Data;
+          this.detailedDateList = res.Data.List || [];
+           this.detailedVisibleDlg = true;
+        }
+      }
+    },
+
+    //搜索的取消
+    searchCancelHandle() {
+      this.$emit("update:searchCustomer", false);
+      this.clientName = "";
+    },
+    //搜索结果的取消
+    resultCancelHandle() {
+      this.resultCustomer = false;
+      this.resultDateList = [];
+    },
+    //参会明细的取消
+    detaileCancelHandle() {
+      //明细
+      this.detailedVisibleDlg = false;
+      this.detailedDateList = [];
+    },
+  },
+};
+</script>
+<style scoed lang="scss">
+.search-customer-dlg {
+  .el-dialog .el-input {
+    width: 100% !important;
+  }
+  .dialog-footer {
+    margin: 20px 0 0;
+  }
+
+  .result-table {
+    margin-bottom: 30px;
+    .result-text {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      margin-bottom: 20px;
+    }
+  }
+}
+</style>

src/views/rai_manage/components/apply/summaryRemind.vue

@@ -0,0 +1,122 @@
+<template>
+  <div class="container-summaryRemind">
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center :visible.sync="summaryRemindDlg" width="1000px" :before-close="confirmPerson" :append-to-body="true">
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.warntop" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">{{ subscribe }}</span>
+      </div>
+      <div>
+        <template v-if="subscribe === '纪要预约人数'">
+          <span v-if="fromData.ExcelType !== 'ExpertSalon' && fromData.ExcelType !== 'OfflineResearch'">共有{{ fromData.Total }}人预约纪要，其中本人名下{{ fromData.MyTotal }}人</span>
+        </template>
+        <template v-else>共有{{ fromData.Total }}人设置会议提醒，其中本人名下{{ fromData.MyTotal }}人</template>
+        <div style="margin: 30px 0">
+          <el-table height="400px" :data="dataList" border style="width: 100%">
+            <el-table-column min-width="80" align="center" prop="RealName" key="name" label="姓名"></el-table-column>
+            <el-table-column
+              v-if="fromData.ExcelType == 'AppointmentCall' || fromData.ExcelType == 'Teleconference'"
+              min-width="115"
+              align="center"
+              prop="Mobile"
+              key="mobile"
+              label="手机号"
+            ></el-table-column>
+            <el-table-column min-width="135" align="center" prop="CompanyName" key="company" label="公司名称"></el-table-column>
+            <el-table-column min-width="110" align="center" prop="SellerName" key="seller" label="所属销售"></el-table-column>
+            <el-table-column v-if="subscribe === '纪要预约人数'" align="center" prop="CreateTime" key="create" label="预约时间"></el-table-column>
+            <el-table-column v-else align="center" prop="CreateTime" key="createTime" min-width="160" label="报名时间"></el-table-column>
+            <el-table-column align="center" label="操作">
+              <template slot-scope="{ row }">
+                <span class="editsty" @click="cancelTableHandler(row)"> {{ subscribe === "纪要预约人数" ? "取消预约" : "取消提醒" }}</span>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    summaryRemindDlg: {
+      type: Boolean,
+      default: false,
+    },
+    subscribe: {
+      type: String,
+      default: "",
+    },
+    dialogVisibleId: {
+      type: Number,
+    },
+  },
+  data() {
+    return {
+      fromData: {}, //数据
+      dataList: [], //表格
+    };
+  },
+  computed: {},
+  watch: {
+    summaryRemindDlg: {
+      handler(newval) {
+        if (newval) {
+          this.getsDataList();
+        }
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    //获取表格数据
+    async getsDataList() {
+      const res =
+        this.subscribe === "纪要预约人数"
+          ? await raiInterface.activitySignupSummaryList({ ActivityId: this.dialogVisibleId })
+          : await raiInterface.activitySignupReminder({ ActivityId: this.dialogVisibleId });
+      if (res.Ret === 200) {
+        this.fromData = res.Data;
+        this.$nextTick(() => {
+          this.dataList = res.Data.List;
+        });
+      }
+    },
+    //弹框的关闭事件
+    confirmPerson() {
+      this.$parent.summaryRemindDlg = false;
+    },
+    //取消提醒、取消外呼
+    cancelTableHandler(item) {
+      let str = this.subscribe === "纪要预约人数" ? "纪要预约" : "会议提醒";
+      this.$confirm(`确定要取消该用户的${str}吗？`, `取消${str}`, {
+        confirmButtonText: "是",
+        cancelButtonText: "否",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = this.subscribe === "纪要预约人数" ? await raiInterface.activityAppointmentCancel({ SignupId: item.Id }) : await raiInterface.activityReminderCancel({ SignupId: item.Id });
+          if (!res.Ret === 200) return;
+          this.$message({
+            type: "success",
+            message: `取消${str}成功!`,
+          });
+          this.getsDataList();
+          this.$parent.getsDataList();
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消操作",
+          });
+        });
+    },
+  },
+};
+</script>
+<style lang="scss"></style>

src/views/rai_manage/components/apply/templateMessage.vue

@@ -0,0 +1,180 @@
+<template>
+  <div class="container container-message-dlg">
+    <el-dialog width="560px" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center :visible.sync="messageDialog" title="发送模板消息" :before-close="handleClose">
+      <div class="content">
+        <div class="annotation">
+          <div class="annotation-box" @click="annotationHandler">
+            <img style="margin-right: 5px" src="~@/assets/img/icons/annotation_icon.png" alt="" />
+            注释
+          </div>
+        </div>
+        <el-form :model="messageForm" :rules="rules" ref="messageFormRef" class="demo-ruleForm">
+          <el-form-item prop="sendId">
+            <el-select style="width: 100%" v-model="messageForm.sendId" multiple placeholder="请选择发送对象（可多选）" :disabled="typeMessage == '确定行程'">
+              <el-option v-for="item in sendOptions" :key="item.Id" :label="item.Name" :value="item.Id"> </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item prop="activityName">
+            <el-input type="textarea" :rows="2" :placeholder="`请输入${this.typeMessage == '确定行程' ? '调研主题' : '活动名称'}（20字内）`" v-model="messageForm.activityName"> </el-input>
+          </el-form-item>
+          <el-form-item prop="content">
+            <el-input type="content" :rows="2" placeholder="请输入变更内容（20字内）" v-model="messageForm.content"> </el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+      <el-image
+        style="width: 0px; height: 0px"
+        src="https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/templet_new.png"
+        id="TripImgLink"
+        :preview-src-list="['https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/templet_new.png']"
+      ></el-image>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmPerson">确定</el-button>
+        <el-button @click="handleClose">取消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    selectionArr: {
+      type: Array,
+      required: true,
+      default: () => [],
+    },
+    messageDialog: {
+      type: Boolean,
+      required: true,
+      default: false,
+    },
+    typeMessage: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      previewList: ["https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/template.png"],
+      messageForm: {
+        sendId: [7],
+        beforeText: "",
+        activityName: "",
+        content: "",
+      },
+      rules: {
+        sendId: [{ required: true, message: "请选择发送对象", trigger: "change" }],
+        activityName: [{ required: true, message: "请输入活动名称", trigger: "blur" }],
+        content: [{ required: true, message: "请输入变更内容", trigger: "blur" }],
+      },
+      defaultSalesProps: {
+        multiple: true,
+        label: "Name",
+        value: "Id",
+      },
+      sendOptions: [],
+    };
+  },
+  computed: {},
+  watch: {
+    messageDialog: {
+      handler(newValue) {
+        console.log(this.selectionArr);
+        if (newValue) this.messageForm.activityName = this.selectionArr[0].ActivityName || this.selectionArr[0].ResearchTheme;
+        this.activitySendGroupList();
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    async activitySendGroupList() {
+      const res = this.typeMessage == "确定行程" ? await raiInterface.activityTripSendGroupList() : await raiInterface.activitySendGroupList();
+      if (res.Ret === 200) {
+        this.sendOptions = res.Data;
+        this.messageForm.sendId = this.typeMessage == "确定行程" ? [1] : [7];
+      }
+    },
+    // 点击了注释
+    annotationHandler() {
+      $("#TripImgLink").click();
+    },
+    handleClickStop() {
+      this.$nextTick(() => {
+        let domImageView = document.querySelector(".el-image-viewer__mask"); // 获取遮罩层dom
+        if (!domImageView) {
+          return;
+        }
+        console.log(domImageView);
+        domImageView.addEventListener("click", () => {
+          // 点击遮罩层时调用关闭按钮的 click 事件
+          document.querySelector(".el-image-viewer__close").click();
+        });
+      });
+    }, // 弹框关闭
+    handleClose() {
+      this.$refs.messageFormRef.resetFields();
+      this.previewList = [];
+      this.messageForm = {
+        sendId: [7],
+        beforeText: "",
+        activityName: "",
+        content: "",
+      };
+      this.$emit("update:messageDialog", false);
+    },
+    // 弹框确定饰件
+    confirmPerson() {
+      this.$refs["messageFormRef"].validate(async (valid) => {
+        if (valid) {
+          let params = {
+            ActivityIds: this.selectionArr[0].ActivityId + "",
+            ResearchTheme: this.selectionArr[0].ResearchTheme || "",
+            SendGroup: this.messageForm.sendId.join(","),
+            // FirstText: this.messageForm.beforeText,
+            ActivityName: this.messageForm.activityName,
+            Content: this.messageForm.content,
+          };
+          const res = this.typeMessage == "确定行程" ? await raiInterface.activityTripSignupTempMsg(params) : await raiInterface.activitySignupTempMsg(params);
+          if (res.Ret === 200) {
+            this.$message.success("发送成功");
+            this.handleClose();
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="scss">
+.container-message-dlg {
+  .content {
+    .annotation {
+      display: flex;
+      justify-content: flex-end;
+      margin-bottom: 20px;
+      .annotation-box {
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+        width: 60px;
+        cursor: pointer;
+      }
+    }
+  }
+  .el-input {
+    width: 100% !important;
+  }
+  .el-image-viewer__canvas .el-image-viewer__img {
+    width: 700px;
+    height: 50%;
+  }
+}
+</style>

src/views/rai_manage/components/atcParticulars.vue

@@ -0,0 +1,220 @@
+<template>
+  <div class="container">
+    <el-dialog :modal-append-to-body="false" v-dialogDrag center top="5vh" :visible.sync="dialogVisible" customClass="customParticulars" :before-close="clickBtn">
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.particulars" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">活动详情</span>
+      </div>
+      <div class="dialog-box">
+        <div v-if="detailData.ActivityName" class="dialog-title">{{ detailData.ActivityName }}</div>
+        <div class="test" v-if="detailData.ActivityTypeName">
+          <p>活动类型：</p>
+          <div class="paragraph" v-html="detailData.ActivityTypeName"></div>
+        </div>
+        <div class="test" v-if="detailData.ChartPermissionName">
+          <p>所属行业：</p>
+          <div class="paragraph" v-html="detailData.ChartPermissionName"></div>
+        </div>
+        <div class="test" v-if="detailData.ActivityTimeText">
+          <p>活动时间：</p>
+          <div class="paragraph" v-html="detailData.ActivityTimeText"></div>
+        </div>
+        <div class="test" v-if="detailData.DistinguishedGuest">
+          <p>嘉&nbsp;&nbsp; &nbsp; &nbsp;宾：</p>
+          <div class="paragraph" v-html="detailData.DistinguishedGuest"></div>
+        </div>
+        <div class="test" v-if="detailData.Host">
+          <p>主&nbsp; 持&nbsp; 人：</p>
+          <div class="paragraph" v-html="detailData.Host"></div>
+        </div>
+        <div class="test" v-if="detailData.Speaker">
+          <p>主&nbsp; 讲&nbsp; 人：</p>
+          <div class="paragraph" v-html="detailData.Speaker"></div>
+        </div>
+        <div class="test" v-if="detailData.Expert">
+          <p>专&nbsp;&nbsp; &nbsp; &nbsp;家：</p>
+          <div class="paragraph" v-html="detailData.Expert"></div>
+        </div>
+        <div class="test" v-if="detailData.City">
+          <p>城&nbsp;&nbsp; &nbsp; &nbsp;市：</p>
+          <div class="paragraph" v-html="detailData.City"></div>
+        </div>
+        <div class="test" v-if="detailData.MainlandTell">
+          <p>大陆拨入：</p>
+          <div class="paragraph" v-html="detailData.MainlandTell"></div>
+        </div>
+        <div class="test" v-if="detailData.HongKongTell">
+          <p>香港拨入：</p>
+          <div class="paragraph" v-html="detailData.HongKongTell"></div>
+        </div>
+        <div class="test" v-if="detailData.TaiwanTell">
+          <p>台湾拨入：</p>
+          <div class="paragraph" v-html="detailData.TaiwanTell"></div>
+        </div>
+        <div class="test" v-if="detailData.AmericaTell">
+          <p>美国拨入：</p>
+          <div class="paragraph" v-html="detailData.AmericaTell"></div>
+        </div>
+        <div class="test" v-if="detailData.ParticipationCode">
+          <p>参会密码：</p>
+          <div class="paragraph" v-html="detailData.ParticipationCode"></div>
+        </div>
+        <div class="test" v-if="detailData.OnlineParticipation">
+          <p>网络参会：</p>
+          <div class="paragraph" v-html="detailData.OnlineParticipation"></div>
+        </div>
+        <div class="test" v-if="detailData.Address">
+          <p>活动地址：</p>
+          <div class="paragraph" v-html="detailData.Address"></div>
+        </div>
+        <div class="test" v-if="detailData.Highlights">
+          <p>活动亮点：</p>
+          <div class="paragraph" v-html="detailData.Highlights"></div>
+        </div>
+        <div class="test" v-if="detailData.ReportLink">
+          <p>报告链接：</p>
+          <div class="paragraph" v-html="detailData.ReportLink"></div>
+        </div>
+        <div class="test" v-if="detailData.Theme">
+          <p>主&nbsp;&nbsp; &nbsp; &nbsp;题：</p>
+          <div class="paragraph" v-html="detailData.Theme"></div>
+        </div>
+        <div class="test" v-if="detailData.TencentConferenceNumber">
+          <p>腾讯会议号：</p>
+          <div class="paragraph" v-html="detailData.TencentConferenceNumber"></div>
+        </div>
+        
+        <div class="test" v-if="detailData.Remarks">
+          <p>备&nbsp;&nbsp; &nbsp; &nbsp;注：</p>
+          <div class="paragraph" v-html="detailData.Remarks"></div>
+        </div>
+      </div>
+      <div class="type-scale" v-if="detailData.IsLimitPeople == 1">
+        <div style="flex-shrink: 0; margin-right: 10px">活动可见：</div>
+        <div>
+          <div class="item" v-if="checkedCities.length">
+            <span style="width: 70px; flex-shrink: 0" class="text-right"> 套餐类型：</span>
+            <el-checkbox-group v-model="checkedCities">
+              <span v-for="item in cities" :key="item.CustomerTypeId">
+                <el-checkbox style="margin-right: 10px" :label="item.CustomerTypeId" disabled v-if="checkedCities.includes(item.CustomerTypeId)">
+                  {{ item.CustomerName }}
+                  <el-tooltip :content="item.Explain" placement="top-start" v-if="item.Explain">
+                    <i class="el-icon-info" />
+                  </el-tooltip>
+                </el-checkbox>
+              </span>
+            </el-checkbox-group>
+          </div>
+          <div class="item" v-if="checkScaleList.length">
+            <span class="text-right"> 管理规模： </span>
+            <el-checkbox-group v-model="checkScaleList">
+              <el-checkbox v-if="checkScaleList.includes('3')" disabled label="3">100亿以上</el-checkbox>
+              <el-checkbox v-if="checkScaleList.includes('2')" disabled label="2">50～100亿</el-checkbox>
+            </el-checkbox-group>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    detailData: {
+      type: Object,
+    },
+    dialogVisible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      cities: [], //
+      checkedCities: [],
+      checkScaleList: [],
+    };
+  },
+  computed: {},
+  watch: {
+    detailData: {
+      handler(newValue) {
+        if (Object.values(newValue).length > 0) {
+          this.checkedCities = newValue.CustomerTypeIds ? newValue.CustomerTypeIds.split(",").map((item) => Number(item)) : [];
+          this.checkScaleList = newValue.Scale ? newValue.Scale.split(",") : [];
+        }
+      },
+      deep: true,
+    },
+  },
+  created() {},
+  mounted() {
+    this.customerTypelist();
+  },
+  methods: {
+    clickBtn() {
+      this.$emit("update:detailData", {});
+      this.$emit("update:dialogVisible", false);
+    },
+    //获取多选的客户列表
+    customerTypelist() {
+      raiInterface.customerTypelist().then((res) => {
+        if (res.Ret === 200) {
+          this.cities = res.Data.List;
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="scss">
+.customParticulars {
+  width: 550px !important;
+  padding-bottom: 20px;
+  .type-scale {
+    margin-top: 20px;
+    display: flex;
+    .item {
+      display: flex;
+      margin-bottom: 20px;
+    }
+  }
+}
+.dialog-box {
+  box-sizing: border-box;
+  width: 501px;
+  border: 1px solid #dcdfe6;
+  font-size: 14px;
+  font-family: PingFang SC;
+  font-weight: 500;
+  color: #666666;
+  .test {
+    display: flex;
+    padding: 13px 30px;
+    border-top: 1px solid #dcdfe6;
+    p {
+      width: 104px !important;
+      text-align: justify;
+    }
+    .paragraph {
+      padding: 0;
+      margin: 0;
+      width: 100%;
+      p {
+        width: 100% !important;
+        text-align: left;
+      }
+    }
+  }
+  .dialog-title {
+    padding: 13px 30px;
+    border-top: none;
+    text-align: center;
+    background: #f0f2f5;
+  }
+}
+</style>

src/views/rai_manage/components/editMobile.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class="container-editMobile">
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center :append-to-body="true" width="40%" :visible.sync="editMobileDialogVisible" :before-close="handleClose">
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.edit_garden" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">修改外呼号码</span>
+      </div>
+      <div class="content-box" style="margin-top: 20px; margin-bottom: 60px">
+        <el-select style="width: 80px" v-model="selectValue" placeholder="请选择">
+          <el-option v-for="item in optionsMobile" :key="item.key" :label="item.value" :value="item.key"> </el-option>
+        </el-select>
+        <el-input style="width: 368px" v-model="modelKey" placeholder="请输入手机号或座机号" />
+        <p style="margin-top: 15px">座机号请填写区号，分机号用"-"分隔，例：02150509999-8888</p>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="btnOk">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface,raiSpecial } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    editMobileDialogVisible: {
+      type: Boolean,
+      default: false,
+      required: true,
+    },
+    editMobileId: {
+      type: Number,
+      required: true,
+    },
+    outboundMobile: {
+      type: String,
+      required: true,
+    },
+    isType: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      selectValue: "86",
+      optionsMobile: [
+        { value: "+86", key: "86" },
+        { value: "+852", key: "852" },
+        { value: "+886", key: "886" },
+        { value: "+1", key: "1" },
+        { value: "+65", key: "65" },
+      ],
+      modelKey: "",
+    };
+  },
+  computed: {},
+  watch: {
+    editMobileDialogVisible(newval) {
+      if (newval) {
+        this.activitySignupSignupDetail();
+      }
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    async activitySignupSignupDetail() {
+      const res = this.isType ? await "" : await raiInterface.activitySignupSignupDetail({ Id: this.editMobileId });
+      if (res.Ret === 200) {
+        this.selectValue = res.Data.CountryCode ? res.Data.CountryCode : "86";
+        this.modelKey = res.Data.OutboundMobile;
+      }
+    },
+    handleClose() {
+      this.selectValue = "86";
+      this.modelKey = "";
+      this.$parent.outboundMobile = "";
+      this.$emit("update:editMobileDialogVisible", false);
+    },
+    async btnOk() {
+      const res = this.isType
+        ? await raiSpecial.outboundMobileEdit({
+            CountryCode: this.selectValue,
+            OutboundMobile: this.modelKey,
+            Id: this.editMobileId,
+          })
+        : await raiInterface.outboundMobileEdit({
+            CountryCode: this.selectValue,
+            OutboundMobile: this.modelKey,
+            Id: this.editMobileId,
+          });
+
+      if (res.Ret !== 200) return;
+      this.$message.success("操作成功");
+      this.selectValue = "86";
+      this.modelKey = "";
+      this.$emit("update:editMobileDialogVisible", false);
+      this.$parent.outboundMobile = "";
+      this.$parent.getsDataList();
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-editMobile {
+  .content-box {
+    margin-top: 20px;
+    margin-bottom: 60px;
+    display: flex;
+  }
+}
+</style>

src/views/rai_manage/components/focusCollection.vue

@@ -0,0 +1,87 @@
+<template>
+  <div class="container-collection">
+    <mDialog :show.sync="collectionDlgShow" @beforeClose="closeDlg" :width="'50%'">
+      <div>
+        <div v-if="collectionType == '关注' && fllowNum" style="margin-bottom: 20px">
+          <span>{{ nickName }}</span>
+          <span>&nbsp;&nbsp;{{ fllowNum }}人关注</span>
+        </div>
+        <el-table :data="dataList" style="width: 100%" border>
+          <el-table-column align="center" prop="RealName" label="姓名"></el-table-column>
+          <el-table-column align="center" prop="CompanyName" label="公司名称"></el-table-column>
+          <el-table-column align="center" prop="SellerName" label="所属销售"></el-table-column>
+          <el-table-column min-width="150" align="center" prop="CreateTime" :label="collectionType === '关注' ? '关注时间' : '收藏时间'"></el-table-column>
+        </el-table>
+      </div>
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.warntop" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="fontsize: 16px"> {{ collectionType === "关注" ? "关注详情" : "收藏详情" }}</span>
+      </div>
+      <div slot="footer" style="margin-top:40px">
+        <el-button type="primary" @click="closeDlg">关闭</el-button>
+      </div>
+    </mDialog>
+  </div>
+</template>
+
+<script>
+import mDialog from "@/components/mDialog.vue";
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {
+    mDialog,
+  },
+  props: {
+    collectionDlgShow: {
+      type: Boolean,
+      default: false,
+    },
+    collectionId: {
+      type: String,
+      default: "",
+    },
+    collectionType: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      dataList: [],
+      fllowNum: "",
+      nickName: "",
+    };
+  },
+  computed: {},
+  watch: {
+    collectionDlgShow: {
+      handler(newValue) {
+        if (newValue) {
+          this.getArticle();
+        }
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    closeDlg() {
+      this.$parent.collectionDlgShow = false;
+    },
+    async getArticle() {
+      const res = this.collectionType == "关注" ? await raiInterface.departmentFollowList({ DepartmentId: this.collectionId }) : await raiInterface.articleCollection({ ArticleId: this.collectionId });
+      if (res.Ret === 200) {
+        if (this.collectionType == "关注") {
+          this.dataList = res.Data.List || [];
+          this.fllowNum = res.Data.FllowNum;
+          this.nickName = res.Data.NickName;
+        } else {
+          this.dataList = res.Data || [];
+        }
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="less"></style>

src/views/rai_manage/components/generationAsk.vue

@@ -0,0 +1,167 @@
+<template>
+  <div class="container-generaiton">
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center :visible.sync="generaitondialogVisib" customClass="generaiton-applydialog" :before-close="confirmPerson">
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.delay" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">{{ generaitonType == "报名" ? "代问详情" : "留言详情" }}</span>
+      </div>
+      <div>
+        <el-table :data="tableData" style="width: 100%" border max-height="260px">
+          <el-table-column align="center" prop="RealName" label="姓名"> </el-table-column>
+          <el-table-column align="center" prop="CompanyName" label="公司名称"> </el-table-column>
+          <el-table-column align="center" prop="Content" label="问题" width="330"> </el-table-column>
+          <el-table-column align="center" prop="CreateTime" label="提交时间" width="180"> </el-table-column>
+        </el-table>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <a :href="exportUser" download>
+          <el-button type="primary">
+            {{ generaitonType == "报名" ? "下载问题列表" : "下载留言列表" }}
+          </el-button>
+        </a>
+        <el-button @click="confirmPerson" style="margin-left: 20px">取 消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiVideoApi } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    generaitonId: {
+      type: Number,
+      required: true,
+    },
+    generaitondialogVisib: {
+      type: Boolean,
+      required: true,
+    },
+    generaitonType: {
+      type: String,
+      required: true,
+    },
+    tabActiveRoadshow: {
+      type: Number,
+    },
+  },
+  data() {
+    return {
+      tableData: [],
+    };
+  },
+  computed: {
+    exportUser() {
+      let url = "";
+      if (this.generaitonType == "报告") {
+        url = "/cygx/reportArticle/askListExport?ReportId=";
+      } else if (this.generaitonType == "报名") {
+        url = "/cygx/activitySignup/askListExport?ActivityId=";
+      } else if (this.generaitonType == "微路演") {
+        this.tabActiveRoadshow == 4
+          ? (url = "/cygx/microRoadshow/commentListExport/video?VideoId=")
+          : this.tabActiveRoadshow == 3
+          ? (url = "/cygx/askserie_video/collection_list?IsExport=true&AskserieVideoId=")
+          : (url = "/cygx/activity_voice_and_video/commentList?IsExport=true&ActivityId=");
+      } else {
+        url = "/cygx/summaryManage/commentListExport?ArticleId=";
+      }
+      return process.env.API_ROOT + url + this.generaitonId + "&" + localStorage.getItem("auth") || "";
+    },
+  },
+  watch: {
+    generaitondialogVisib() {
+      if (this.generaitondialogVisib) {
+        switch (this.generaitonType) {
+          case "报告":
+            this.getReportList();
+            break;
+          case "报名":
+            this.getlist();
+            break;
+          case "微路演":
+            this.getRoadshowList();
+            break;
+          default:
+            this.getSummaryList();
+        }
+      }
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    confirmPerson() {
+      this.tableData = [];
+      this.$emit("update:generaitondialogVisib", false);
+    },
+    //报名 代问
+    getlist() {
+      raiInterface
+        .activitySignupAskList({
+          ActivityId: this.generaitonId,
+        })
+        .then((res) => {
+          if (res.Ret == 200) {
+            this.tableData = res.Data.List;
+          }
+        });
+    },
+    //报告 代问
+    getReportList() {
+      raiInterface
+        .reportArticleAskList({
+          ReportId: this.generaitonId,
+        })
+        .then((res) => {
+          if (res.Ret == 200) {
+            this.tableData = res.Data.List;
+          }
+        });
+    },
+    //纪要 代问
+    getSummaryList() {
+      raiInterface
+        .summaryManageAskList({
+          ArticleId: this.generaitonId,
+        })
+        .then((res) => {
+          if (res.Ret == 200) {
+            this.tableData = res.Data.List;
+          }
+        });
+    },
+    //微路演
+    async getRoadshowList() {
+      const res =
+        this.tabActiveRoadshow == 4
+          ? await raiVideoApi.getMicroRoadshowVideo({
+              VideoId: this.generaitonId,
+            })
+          : this.tabActiveRoadshow == 3
+          ? await raiVideoApi.askserieVideoCollectionList({
+              AskserieVideoId: this.generaitonId,
+            })
+          : await raiVideoApi.activityVoiceAndVideoCommentList({
+              ActivityId: this.generaitonId,
+            });
+
+      if (res.Ret == 200) {
+        this.tableData = res.Data.List;
+      }
+    },
+  },
+};
+</script>
+<style lang="less">
+.container-generaiton {
+  .generaiton-applydialog {
+    width: 800px;
+  }
+  .el-dialog__footer {
+    margin-top: 30px;
+  }
+}
+</style>

src/views/rai_manage/components/interviewDia.vue

@@ -0,0 +1,126 @@
+<script setup>
+import { ref } from "vue";
+import { raiInterface } from "@/api/api.js";
+
+import { ElMessage } from 'element-plus'
+const props = defineProps({
+  isShowDia: Boolean,
+  title: String,
+  status: String,
+  itemObj: Array,
+  applyId: Number,
+});
+
+const datetime = ref("");
+
+/* 保存 */
+const saveHandle = () => {
+  if (this.title === "update" || this.title === "cancel") {
+    if (this.status == "待邀请") {
+      this.datetime && this.updateApply();
+      !this.datetime && ElMessage.warning("访谈时间不能为空");
+    } else {
+      this.updateApply();
+    }
+  }
+  this.title === "deal" && this.$emit("saveOver");
+};
+/* 取消 */
+const cancelHandle = () => {
+  this.datetime = "";
+  this.$emit("cancel");
+};
+
+/* 更新/取消 */
+const updateApply = () => {
+  raiInterface
+    .cancelInterview({
+      HandleType: this.title == "update" ? 1 : 2,
+      InterviewApplyId: Number(this.applyId),
+      InterviewTime: this.title == "update" && this.status == "待邀请" ? this.datetime : "",
+    })
+    .then((res) => {
+      if (res.Ret === 200) {
+        ElMessage.success(res.Msg);
+        this.$emit("over");
+      }
+    });
+};
+
+const lookDetail = (id) => {
+  let url =
+    process.env.NODE_ENV === "production"
+      ? "https://details.hzinsights.com/cygx/report"
+      : process.env.NODE_ENV === "test"
+      ? "http://xcxh5test.hzinsights.com/xcx_h5/cygx/report"
+      : "http://xcxh5test.hzinsights.com/xcx_h5/cygx/report";
+  let href = `${url}?id=${id}`;
+  window.open(href, "_blank");
+};
+</script>
+
+<template>
+  <el-dialog
+    draggable
+    v-model="isShowDia"
+    :close-on-click-modal="false"
+    :modal-append-to-body="false"
+    :show-close="false"
+    @close="cancelHandle"
+    class="interview_dialog"
+    :width="title == 'detail' ? '600px' : '450px'"
+  >
+    <template #header>
+      <div style="position: relative">
+        <span style="fontsize: 16px">{{ title === "update" ? "状态更新" : title === "cancel" ? "取消申请" : title === "detail" ? "访谈详情" : "标记处理" }}</span>
+      </div>
+    </template>
+
+    <!-- 访谈申请弹窗 -->
+    <div class="dialog_cont">
+      <!-- 状态更新 -->
+      <div v-if="title === 'update'">
+        <span>{{ status == "待邀请" ? "状态将跟更新为：待访谈" : status == "待访谈" ? "是否将状态更新为已完成？" : "" }}</span>
+        <date-picker v-model="datetime" type="datetime" value-type="format" placeholder="请选择访谈时间" style="margintop: 20px" v-if="status == '待邀请'"></date-picker>
+      </div>
+      <!-- 取消申请 -->
+      <span v-else-if="title === 'cancel' || title === 'deal'">{{ title === "cancel" ? "确定要取消此次访谈申请吗？" : "是否确认已处理该用户申请？" }}</span>
+      <!-- 访谈详情 -->
+      <el-table max-height="260px" :data="itemObj" border v-else>
+        <el-table-column align="center" label="相关纪要" width="200px">
+          <template #default="scope">
+            <span style="color: #409eff; cursor: pointer" @click="lookDetail(scope.row.ArticleIdMd5)">{{ scope.row.ArticleTitle }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="所属行业" prop="CategoryName">
+          <template #default="scope">{{ scope.row.CategoryName }}</template>
+        </el-table-column>
+        <el-table-column align="center" label="访谈时间">
+          <template #default="scope">{{ scope.row.InterviewTime }}</template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div style="display: flex; justify-content: center; margin: 40px 0">
+      <el-button type="primary" style="width: 120px" @click="cancelHandle" v-if="title === 'detail'">知道了</el-button>
+      <template v-else>
+        <el-button type="primary" style="width: 80px; marginright: 24px" @click="saveHandle">确定</el-button>
+        <el-button type="primary" plain style="width: 80px" @click="cancelHandle">取消</el-button>
+      </template>
+    </div>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+.dialog_cont {
+  padding: 0 10px;
+  .node_name {
+    font-size: 15px;
+    margin-bottom: 20px;
+  }
+  .node_ipt {
+    display: block;
+    width: 100%;
+    margin: 20px 0;
+  }
+}
+</style>

src/views/rai_manage/components/mapDialog.vue

@@ -0,0 +1,122 @@
+<script setup>
+import { ref } from "vue";
+import { raiInterface } from "@/api/api.js";
+import { ElMessage } from "element-plus";
+
+const props = defineProps({
+  isShowDia: Boolean,
+  title: String,
+  nodeData: Object,
+});
+
+const emit = defineEmits(["over", "cancel"]);
+const add_name = ref("");
+
+/* 保存 */
+const saveHandle = () => {
+  switch (title) {
+    case "add":
+      addNode();
+      break;
+    case "edit":
+      editNode();
+      break;
+    case "del":
+      delNode();
+      break;
+  }
+};
+
+/* 新增节点 */
+const addNode = () => {
+  if (add_name) {
+    raiInterface
+      .addNode({
+        IndustryMapId: props.nodeData.id,
+        IndustryMapName: add_name,
+        Level: props.nodeData.level,
+      })
+      .then((res) => {
+        if (res.Ret === 200) {
+          emit("over");
+          ElMessage.success(res.Msg);
+        }
+      });
+  } else {
+    ElMessage.warning("子级名称不能为空");
+  }
+};
+
+/* 修改 */
+const editNode = () => {
+  raiInterface
+    .editNode({
+      IndustryMapId: props.nodeData.id,
+      IndustryMapName: props.nodeData.name,
+    })
+    .then((res) => {
+      if (res.Ret === 200) {
+        emit("over");
+        ElMessage.success(res.Msg);
+      }
+    });
+};
+
+/* 删除节点 */
+
+const delNode = () => {
+  raiInterface
+    .delNode({
+      IndustryMapId: props.nodeData.id,
+    })
+    .then((res) => {
+      if (res.Ret === 200) {
+        ElMessage.success("已删除");
+        emit("over");
+      }
+    });
+};
+
+/* 取消 */
+const cancelHandle = () => {
+  add_name.value = "";
+  emit("cancel");
+};
+</script>
+
+<template>
+  <el-dialog draggable v-model="props.isShowDia" :close-on-click-modal="false" :modal-append-to-body="false" @close="cancelHandle" custom-class="map_dialog" width="450px">
+    <template #header>
+      <span style="font-size: 16px">{{ props.title == "add" ? "新增子级" : "edit" ? "编辑" : "删除" }}</span>
+    </template>
+
+    <div class="dialog_cont">
+      <!-- 新增子级 -->
+      <template v-if="props.title == 'add'">
+        <div class="node_name">父级名称:&nbsp;{{ nodeData.name }}</div>
+        <el-input v-model="add_name" placeholder="请输入子级名称" class="node_ipt" @keyup.enter.native="saveHandle"> </el-input>
+      </template>
+      <!-- 编辑 -->
+      <el-input v-model="nodeData.name" placeholder="请输入名称" class="node_ipt" v-else-if="props.title == 'edit'" @keyup.enter.native="saveHandle"> </el-input>
+      <!-- 删除 -->
+      <div class="node_name" v-else-if="props.title == 'del'">确定要删除此节点吗？</div>
+    </div>
+    <div style="display: flex; justify-content: center; margin-top: 40px">
+      <el-button type="primary" style="width: 80px; marginright: 24px" @click="saveHandle">确定</el-button>
+      <el-button type="primary" plain style="width: 80px" @click="cancelHandle">取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+.dialog_cont {
+  display: flex;
+  padding: 0 10px;
+  .node_name {
+    display: flex;
+    align-items: center;
+    flex-shrink: 0;
+    font-size: 15px;
+  }
+}
+</style>

src/views/rai_manage/components/matchingDlg.vue

@@ -0,0 +1,95 @@
+<template>
+  <div class="container-macthing">
+    <mDialog :show.sync="matchingDlgShow" @beforeClose="closeDlg" :width="'40%'">
+      <div class="content-macthing">
+        <el-select style="width: 100%" v-model="matchingValue" filterable clearable :filter-method="remoteMethod" placeholder="请输入活动名称关键字">
+          <el-option v-for="item in dataQueryList" :key="item.RoadshowTitle + item.ActivityTime" :label="item.value" :value="item.RoadshowTitle +'{|}'+ item.ActivityTime"> </el-option>
+        </el-select>
+      </div>
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.warntop" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="fontsize: 16px">手动匹配</span>
+      </div>
+      <div slot="footer" style="margin-top: 40px">
+        <el-button type="primary" @click="confirm">确定</el-button>
+        <el-button type="primary" @click="closeDlg">取消</el-button>
+      </div>
+    </mDialog>
+  </div>
+</template>
+
+<script>
+import mDialog from "@/components/mDialog.vue";
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {
+    mDialog,
+  },
+  props: {
+    matchingDlgShow: {
+      type: Boolean,
+      default: false,
+    },
+    matchingId:{
+        type: Number, 
+    }
+  },
+  data() {
+    return {
+      dataQueryList: [],
+      matchingValue: "",
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {},
+  methods: {
+    closeDlg() {
+      this.matchingValue=''
+      this.dataQueryList = [];
+      this.$parent.matchingDlgShow = false;
+    },
+    //作者的搜索
+    async remoteMethod(query) {
+      if (query !== "") {
+        this.dataQueryList = [];
+        const res = await raiInterface.activityMeetMatchingList({ KeyWord: query });
+        if (res.Ret === 200) {
+          let obj = {};
+          res.Data.List &&
+            res.Data.List.forEach((item) => {
+              obj = {
+                ...item,
+                value: item.RoadshowTitle + `【` + item.ActivityTime + "】",
+              };
+              this.dataQueryList.push(obj);
+            });
+        }
+      } else {
+        this.dataQueryList = [];
+      }
+    },
+    async confirm() {
+      if(!this.matchingValue) return this.$message.error("请输入活动名称关键字")
+      const res = await raiInterface.activityMeetMatchingByHand({
+        ActivityId: this.matchingId,
+        KeyWord: this.matchingValue,
+      });
+      if(res.Ret === 200){
+        this.dataQueryList = [];
+        this.matchingValue=''
+        this.$message.success('操作成功!')
+        this.$emit('update:matchingDlgShow',false)
+        this.$parent.getsDataList()
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.content-macthing {
+  margin: 30px;
+}
+</style>

src/views/rai_manage/components/particalDialog.vue

@@ -0,0 +1,411 @@
+<template>
+  <div class="container-applydialog">
+    <!-- 详情的弹框 -->
+    <div v-if="dialogVisiblepartica">
+      <el-dialog
+        v-dialogDrag
+        :close-on-click-modal="false"
+        :modal-append-to-body="false"
+        center
+        top="10vh"
+        :visible.sync="dialogVisiblepartica"
+        customClass="custom-applydialog"
+        :before-close="confirmPerson"
+      >
+        <div slot="title" style="display: flex; align-items: center">
+          <img :src="$icons.warntop" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+          <span style="font-size: 16px">{{ particlaDlg.title }}</span>
+        </div>
+        <div v-if="particlaDlg">
+          <el-table :data="tableDataSub" border height="500px" style="width: 100%">
+            <el-table-column align="center" prop="RealName" label="姓名"> </el-table-column>
+            <el-table-column align="center" prop="CompanyName" label="公司名称"> </el-table-column>
+            <el-table-column align="center" v-if="isShowparticulars == '报名详情'" prop="CreateTime" label="报名时间"> </el-table-column>
+            <el-table-column align="center" v-if="isShowparticulars == '到会详情'" prop="" label="是否到会">
+              <template slot-scope="scope">
+                {{ scope.row.IsMeeting == 1 ? (scope.row.IsAirborne == 1 ? "已到会(空降)" : "已到会") : scope.row.IsMeeting == 2 ? "空降" : "未到会" }}
+              </template>
+            </el-table-column>
+            <el-table-column v-if="type === '线下到会'" align="center" prop="SigninTime" label="签到时间"> </el-table-column>
+          </el-table>
+        </div>
+        <div v-if="particlaDlg.title == '到会详情' && type == '线下到会' && listSignin.length > 0" class="meeting-box">
+          <div>潜在客户:</div>
+          <div>
+            <div class="signin-content" v-for="item in listSignin" :key="item.Id">
+              <el-image
+                v-if="item.BusinessCard"
+                style="width: 180px; height: 100px; margin-right: 5px"
+                :src="item.BusinessCard"
+                :preview-src-list="[item.BusinessCard]"
+              >
+              </el-image>
+              <span v-else>{{ item.RealName }} {{ item.Mobile }}</span>
+              <span>{{ item.CreateTime }}</span>
+            </div>
+          </div>
+        </div>
+        <span slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="confirmPerson">知道了</el-button>
+        </span>
+      </el-dialog>
+    </div>
+    <div>
+      <el-dialog
+        v-dialogDrag
+        :close-on-click-modal="false"
+        :modal-append-to-body="false"
+        center
+        top="10vh"
+        :visible.sync="submitDialog"
+        customClass="custom-applydialog"
+        :before-close="handleClose"
+      >
+        <div slot="title" style="display: flex; align-items: center">
+          <img :src="$icons.warntop" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+          <span style="font-size: 16px">提交到会情况</span>
+        </div>
+        <div>
+          <el-table height="500px" :data="tableDataSub" border style="width: 100%">
+            <el-table-column align="center" prop="RealName" label="姓名"> </el-table-column>
+            <el-table-column align="center" prop="CompanyName" label="公司名称"> </el-table-column>
+            <el-table-column align="center" prop="" label="操作">
+              <template slot-scope="scope">
+                <el-switch v-model="scope.row.Operation" active-text="已到会" inactive-text="未到会"> </el-switch>
+              </template>
+            </el-table-column>
+            <el-table-column v-if="type === '线下到会'" align="center" prop="SigninTime" label="签到时间"> </el-table-column>
+          </el-table>
+          <div class="add-box">
+            <img @click="addItem" :src="$icons.addblue" alt="" />
+            <span @click="addItem">添加空降人员</span>
+          </div>
+          <div class="inline" v-for="(item, index) in dynamicItem" :key="index">
+            <div class="inline-content">
+              <el-autocomplete
+                class="inline-input"
+                v-model="item.name"
+                :fetch-suggestions="callbackHandle"
+                placeholder="请输入姓名"
+                @input="getCompany(item.name)"
+                @select="selectCompany(item, index)"
+                @blur="focusCompany(item.name)"
+                :trigger-on-focus="false"
+                clearable
+              ></el-autocomplete>
+              <img @click="deleteItem(item, index)" src="~@/assets/img/icons/delete-Item.png" :class="index == 0 ? 'defaultyi' : ''" alt="" />
+            </div>
+            <p v-if="item.isShow">系统中无此人，请先将其添加到对应公司的联系人列表下</p>
+          </div>
+        </div>
+
+        <span slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="confirmSubmit">提交</el-button>
+          <el-button @click="handleClose">取消</el-button>
+        </span>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    dialogVisiblepartica: {
+      type: Boolean,
+      default: false,
+    },
+    particlaDlg: {
+      type: Object,
+    },
+    submitDialog: {
+      type: Boolean,
+      default: false,
+    },
+    offlineId: {
+      type: Number,
+      default: 0,
+    },
+    type: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      tableData: [],
+      isShow: "",
+      tableDataSub: [],
+      dynamicItem: [],
+      companyList: [], //客户名称的数组
+      timeout: null, //
+      isShowparticulars: "到会详情",
+      user: [],
+      warningIsShow: false,
+      userId: "",
+      listSignin: [],
+    };
+  },
+  computed: {},
+  watch: {
+    "particlaDlg.title"() {
+      if (this.particlaDlg.title) {
+        this.isShowparticulars = this.particlaDlg.title;
+      }
+    },
+    dialogVisiblepartica: {
+      handler(newval) {
+        if (newval) {
+          if (this.isShowparticulars == "报名详情") {
+            this.offlineListDetail();
+          } else {
+            this.arriveOfflineListDetail();
+          }
+        }
+      },
+    },
+    submitDialog: {
+      handler(newval) {
+        if (newval) {
+          this.arriveOfflineListDetail();
+        }
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    // //报名人数
+    async offlineListDetail() {
+      const res = await raiInterface.offlineListDetail({
+        ActivityId: this.offlineId,
+      });
+      if (res.Ret == 200) {
+        this.tableDataSub = res.Data.List;
+      }
+    },
+    //到会详情
+    async arriveOfflineListDetail() {
+      const res = this.particlaDlg.isSpecial
+        ? await raiSpecial.getSpecialtripmeetDetial({
+            ActivityId: this.offlineId,
+          })
+        : await raiInterface.activityMeetoffline({
+            ActivityId: this.offlineId,
+          });
+      if (res.Ret == 200) {
+        this.tableDataSub = res.Data.List;
+        this.listSignin = res.Data.ListSignin || [];
+      }
+    },
+    confirmPerson() {
+      this.tableDataSub = [];
+      this.user = [];
+      this.userId = "";
+      this.dynamicItem = [];
+      this.$emit("update:dialogVisiblepartica", false);
+    },
+    async confirmSubmit() {
+      const is = this.dynamicItem.some((item) => item.isShow == true);
+      if (is) return this.$message.error("姓名有误");
+      if (this.tableDataSub) {
+        this.tableDataSub.forEach((item) => {
+          if (item.Operation) {
+            this.user.push(item.UserId);
+          }
+        });
+      }
+      this.dynamicItem.forEach((item) => this.user.push(item.id));
+      this.userId = this.user.join(",");
+      const res = this.particlaDlg.isSpecial
+        ? await raiSpecial.postSpecialtripMeetingDo({
+            ActivityId: this.offlineId,
+            UserIds: this.userId,
+          })
+        : await raiInterface.activityMeetmeetingDo({
+            ActivityId: this.offlineId,
+            Ids: this.userId,
+          });
+      if (res.Ret === 200) {
+        this.user = [];
+        this.userId = "";
+        this.dynamicItem = [];
+        this.$emit("update:submitDialog", false);
+        this.$parent.getsDataList();
+        this.$nextTick(() => {
+          this.$parent.particulars(this.offlineId, "到会详情");
+        });
+      }
+    },
+    addItem() {
+      this.dynamicItem.push({
+        name: "",
+        isShow: false,
+      });
+    },
+    deleteItem(item, index) {
+      this.dynamicItem.splice(index, 1);
+    },
+    /* 获取客户名称 */
+    getCompany(query) {
+      if (query.includes(",")) return;
+      if (query) {
+        raiInterface
+          .activitySignupUserList({
+            KeyWord: query,
+          })
+          .then((res) => {
+            if (res.Ret === 200) {
+              let arr = [];
+              res.Data.List &&
+                res.Data.List.forEach((item) => {
+                  let obj = {
+                    ...item,
+                    value: item.RealName + " , " + item.Mobile + " , " + item.CompanyName,
+                  };
+                  arr.push(obj);
+                });
+              this.companyList = arr;
+            }
+          });
+      } else {
+        this.companyList = [];
+      }
+    },
+    callbackHandle(data, cb) {
+      let results = data
+        ? this.companyList.filter((item) => {
+            return item.value.includes(data);
+          })
+        : this.companyList;
+      clearTimeout(this.timeout);
+      this.timeout = setTimeout(() => {
+        cb(results);
+      }, 300);
+      if (results.length == 0) {
+        this.warningIsShow = true;
+      } else {
+        this.warningIsShow = false;
+      }
+    },
+    handleClose() {
+      (this.dynamicItem = []), (this.$parent.submitDialog = false);
+    },
+    focusCompany(name) {
+      if ((name.length && this.companyList.length == 0) || this.warningIsShow) {
+        this.dynamicItem.forEach((item) => {
+          if (item.name == name) {
+            item.isShow = true;
+          }
+        });
+      } else {
+        this.dynamicItem.forEach((item) => {
+          if (item.name == name) {
+            item.isShow = false;
+          }
+        });
+      }
+    },
+    selectCompany(val, index) {
+      this.companyList.forEach((item) => {
+        if (item.value == val.name) {
+          this.dynamicItem.splice(index, 1, { id: item.UserId, ...val });
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="scss">
+.container-applydialog {
+  .custom-applydialog {
+    width: 800px;
+  }
+  .add-box {
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    color: #5882ef;
+    margin-top: 30px;
+    margin-bottom: 17px;
+    cursor: pointer;
+    img {
+      width: 16px;
+      height: 16px;
+      margin-right: 10px;
+    }
+  }
+  .inline {
+    margin-bottom: 20px;
+    width: 440px;
+    .inline-input {
+      width: 392px !important;
+    }
+    p {
+      padding-top: 5px;
+      font-size: 14px;
+      font-family: PingFang SC;
+      font-weight: 500;
+      line-height: 20px;
+      color: #ef5858;
+      opacity: 1;
+    }
+  }
+  .inline-content {
+    padding-right: 20px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    img {
+      width: 14px;
+      height: 14px;
+    }
+  }
+  .el-input {
+    width: 392px !important;
+  }
+  .el-switch__label {
+    color: #606266;
+    font-size: 14px;
+    font-weight: 400;
+  }
+  .is-active {
+    color: #409eff !important;
+  }
+  .el-radio__label {
+    font-weight: 400;
+  }
+  .meeting-box {
+    margin-top: 20px;
+    display: flex;
+    div:first-child {
+      flex-shrink: 0;
+      margin-right: 10px;
+      line-height: 19px;
+    }
+  }
+  .signin-content {
+    margin-bottom: 20px;
+    display: flex;
+    align-items: center;
+    img {
+      width: 100%;
+      height: 100%;
+    }
+    span {
+      margin-right: 5px;
+      line-height: 19px;
+      width: 180px;
+    }
+    .el-image-viewer__canvas {
+      img {
+        max-width: 60% !important;
+        max-height: 60% !important;
+      }
+    }
+  }
+}
+</style>

src/views/rai_manage/components/reportComponents/CompanyDetail.vue

@@ -0,0 +1,156 @@
+<template>
+  <div class="container-company-detail">
+    <el-dialog v-dialogDrag title="公司点击详情" width="800px" :close-on-click-modal="false" :modal-append-to-body="false" center :visible.sync="isCompanyDetailShow" :before-close="handleClose">
+      <p v-if="companyCount" style="margin">公司总点击次数{{ companyCount }}次</p>
+      <div class="table-body">
+        <table>
+          <thead>
+            <tr class="thead-content">
+              <th class="thead-rs" v-for="item in dataList" colspan="2" :key="item.ChartPermissionName">{{ item.ChartPermissionName }}</th>
+            </tr>
+          </thead>
+          <tr v-for="(item, index) in childrenList" :key="index">
+            <td v-for="(i, unm) in item" :key="unm" class="new-box">
+              <span class="thbody-rs">{{ i.name }}</span>
+              <template v-if="i.IsNew == 1">
+                <img v-if="unm % 2 == 0" src="https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/new_subject.png" alt="" class="new-img" />
+              </template>
+            </td>
+          </tr>
+        </table>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  props: {
+    isCompanyDetailShow: {
+      type: "boolean",
+      default: false,
+      required: true,
+    },
+    companyDetailId: {
+      type: Number,
+      required: true,
+      default: 0,
+    },
+  },
+  data() {
+    return {
+      dataList: [],
+      childrenList: [],
+      companyCount: 0,
+    };
+  },
+  watch: {
+    isCompanyDetailShow: {
+      handler(newValue) {
+        newValue && this.getCompanyDetailList();
+      },
+    },
+  },
+  methods: {
+    // 获取点击详情的数据
+    async getCompanyDetailList() {
+      const res = await raiInterface.reportSelectionHistory({
+        ArticleId: this.companyDetailId,
+      });
+      if (res.Ret === 200) {
+        this.companyCount = res.Data.Count;
+        let childrenIndex = 0;
+        res.Data.List &&
+          res.Data.List.forEach((item) => {
+            if (childrenIndex < item.List.length) {
+              childrenIndex = item.List.length;
+            }
+          });
+        this.dataList = res.Data.List;
+        for (let i = 0; i < childrenIndex; i++) {
+          let childrenArr = [];
+          this.dataList.forEach((item) => {
+            childrenArr.push({
+              name: item.List[i] ? item.List[i].SubjectName : "",
+              ...item.List[i],
+            });
+            childrenArr.push({
+              name: item.List[i] ? item.List[i].Count : "",
+              ...item.List[i],
+            });
+          });
+          this.childrenList.push(childrenArr);
+        }
+      }
+    },
+    // 关闭弹框
+    handleClose() {
+      this.dataList = [];
+      this.childrenList = [];
+      this.companyCount = 0;
+      this.$emit("update:companyDetailId", 0);
+      this.$emit("update:isCompanyDetailShow", false);
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-company-detail {
+  .table-body {
+    width: 100%;
+    height: 350px;
+    overflow: hidden;
+    margin: 20px 0;
+    overflow-y: auto;
+    border-top: 1px solid #dcdfe6;
+    table {
+      width: 100%;
+      font-size: 14px;
+      color: #666;
+      thead {
+        position: sticky;
+        z-index: 999;
+        top: 0;
+        left: 0;
+        border-left: 1px solid #dcdfe6;
+        border-right: 1px solid #dcdfe6;
+        th {
+          border: none;
+          outline-color: #dcdfe6;
+          outline-style: solid;
+          outline-width: 0.5px;
+        }
+      }
+      td,
+      th {
+        border: 1px solid #dcdfe6;
+        height: 45px;
+        text-align: center;
+        background-color: #fff;
+      }
+    }
+    .thbody-rs {
+      display: inline-block;
+      width: 90px;
+      overflow: hidden;
+      word-break: keep-all;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+  }
+  div::-webkit-scrollbar {
+    width: 3px !important;
+  }
+  .new-box {
+    position: relative;
+    .new-img {
+      position: absolute;
+      width: 20px;
+      height: 20px;
+      top: 0;
+      left: 0;
+    }
+  }
+}
+</style>

src/views/rai_manage/components/reportComponents/RichTextMixins.js

@@ -0,0 +1,65 @@
+export default {
+  data() {
+    var that = this;
+    return {
+      froalaConfig: {
+        key: "BWC6D-16D3B2F3C2H1A6A7wdwgacxuB-33c1fB2twtfG3A7A6B6A3B3B2G3D2H2==",
+        toolbarButtons: [
+          "textColor",
+          "bold",
+          "italic",
+          "underline",
+          "strikeThrough",
+          "fontFamily",
+          "fontSize",
+          "color",
+          "paragraphStyle",
+          "lineHeight",
+          "paragraphFormat",
+          "align",
+          "insertHR",
+          "undo",
+          "redo",
+        ],
+        height: 450,
+        fontSize: ["12", "14", "16", "18", "20", "24", "28", "32", "36", "40"],
+        fontSizeDefaultSelection: "16",
+        theme: "dark", //主题
+        placeholderText: "请输入报告内容",
+        language: "zh_cn", //国际化
+        imageUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url
+        videoUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url
+        fileUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url 更多上传介绍 请访问https://www.froala.com/wysiwyg-editor/docs/options
+        imageDefaultWidth: false,
+        quickInsertButtons: ["image", "table", "ul", "ol", "hr"], //快速插入项
+        toolbarVisibleWithoutSelection: true, //是否开启 不选中模式
+        toolbarSticky: false, //操作栏是否自动吸顶
+        saveInterval: 0,
+        events: {
+          initialized: function () {
+            that.editor = this;
+          },
+          keyup: function (e, editor) {
+            //添加事件，在每次按键按下时，都记录一下最后停留位置
+            that.$nextTick(function () {
+              that.lastEditRange = getSelection().getRangeAt(0);
+            });
+          },
+          click: function (e, editor) {
+            //添加事件，在每次鼠标点击时，都记录一下最后停留位置
+            that.$nextTick(function () {
+              that.lastEditRange = getSelection().getRangeAt(0);
+            });
+          },
+        },
+        charCounterCount: false,
+        reportloadding: false,
+        lastsavetime: "",
+        isAddEnter: false, //是否已经添加过
+        timer: null,
+        ischange: false,
+        isPublishloading: false,
+      },
+    };
+  },
+};

src/views/rai_manage/components/report_preview/choicenessPre.vue

@@ -0,0 +1,392 @@
+<template>
+  <div>
+    <div class="report-container">
+      <div class="report-title">{{ reportInfo.Title }}</div>
+      <div class="report-author-box">
+        <div class="report-author-name">
+          {{ reportInfo.Department }}
+        </div>
+        <div class="report-publishTime">
+          {{ publishTime }}
+        </div>
+      </div>
+      <div class="report-disclaimer">注：请务必阅读<span @click="showDisclaimer">免责声明</span></div>
+      <!-- <div class="report-introduction-box"> -->
+      <div class="report-product-description">产品说明：{{ reportInfo.ProductDescription }}</div>
+      <div class="report-macro-strategy-pc">
+        <img src="https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/macro-strategy-pc.png" alt="" />
+        宏观策略
+      </div>
+      <div class="report-update-description" v-html="strFontSize(reportInfo.MarketStrategy)"></div>
+      <div class="report-attention-direction" style="margin-top: 12px">
+        详细策略报告请
+        <span @click="reportDetailLink">点击查看</span>
+      </div>
+      <!-- </div> -->
+      <div class="industry-ul">
+        <div class="industry-li" v-for="(item, index) in dataListSubject" :key="index">
+          <div class="industry-name">{{ item.ChartPermissionName }}</div>
+          <div class="industry-subject">
+            <div class="subject-item" @click="positionSubject(key)" v-for="key in item.ListSubject" :key="key.IndustrialSubjectId">
+              <a :href="`#miao${key.IndustrialSubjectId}`">{{ key.SubjectName }}</a>
+              <img v-if="key.IsNew" class="icon_subject" src="https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/new_subject.png" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="report-content-box" id="report-content-box">
+        <!-- 21: 消费 22：医药 20：科技 19：智造 -->
+        <div class="report-content" v-for="item in reportList" :key="item.ChartPermissionId">
+          <div class="report-content-header">
+            <img :src="item.ChartPermissionIcon" />
+            {{ item.ChartPermissionText }}
+          </div>
+          <div class="report-content-report" v-for="it in item.contetList" :key="it.IndustrialSubjectId">
+            <div class="content-report-title">
+              {{ it.IndustrialSubjectName }}
+            </div>
+            <div v-html="it.Body" class="content-report-body"></div>
+            <div class="content-report-detail" v-if="it.OverviewArticleId > 0">
+              公司综述报告请
+              <span @click="goArticle(it.OverviewArticleId)"> 点击查看 </span>
+            </div>
+            <div class="company-label" :id="`miao${it.IndustrialSubjectId}`">
+              <span class="item">{{ it.SubjectName }}</span>
+              <img v-if="it.IsNew" src="https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/new_report.png" />
+              <span class="item item-subject-name" v-for="val in it.CompanyLabel" :key="val"># {{ val }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <Disclaimer :showTips="showTips" @hideDlg="showTips = false" disclaimerType="2" />
+    <toTop />
+  </div>
+</template>
+<script>
+import Disclaimer from "./components/disclaimer.vue";
+import toTop from "./components/toTop.vue";
+import moment from "moment";
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "summaryPre",
+  components: {
+    Disclaimer,
+    toTop,
+  },
+  computed: {
+    publishTime() {
+      return moment(this.reportInfo.PublishDate).format("YYYY-MM-DD hh:mm:ss");
+    },
+  },
+  data() {
+    return {
+      reportInfo: "",
+      showTips: false,
+      dataListSubject: [],
+      // 报告列表
+      reportList: [],
+      // route 列表点击进来，有route参数  storage 从sessionStorage取
+      from: "route",
+      // 21: 消费 22：医药 20：科技 19：智造
+      ChartPermissionTextMap: new Map([
+        [21, "消费领域深度调研报告"],
+        [22, "医药领域深度调研报告"],
+        [20, "科技领域深度调研报告"],
+        [19, "智造领域深度调研报告"],
+      ]),
+      ChartPermissionIconMap: new Map([
+        [21, "https://hongze.oss-accelerate.aliyuncs.com/static/images/202110/20211026/p1Oce2z0Hd7LOAhsMAcnelTc869X.png"],
+        [22, "https://hongze.oss-accelerate.aliyuncs.com/static/images/202110/20211026/x19sqGUZTXXsaZiCl7BdCliARB9X.png"],
+        [20, "https://hongze.oss-accelerate.aliyuncs.com/static/images/202110/20211026/sByLMApvMcKfpMYWANNMNOQGurH7.png"],
+        [19, "https://hongze.oss-accelerate.aliyuncs.com/static/images/202110/20211026/D5UPmQ53dsHGrtdVmC9gJ7qSQ8zp.png"],
+      ]),
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    showDisclaimer() {
+      this.showTips = true;
+    },
+    // 将reportInfo中的list解出来 方便页面展示
+    async init() {
+      if (this.$route.query.ArticleId) {
+        // 有ArticleId 是通过列表点击进来的
+        let res = await raiInterface.reportSelectionDetail({ ArticleId: this.$route.query.ArticleId || "" });
+        if (res.Ret == 200) {
+          this.reportInfo = res.Data;
+          this.from = "route";
+        } else {
+          this.reportInfo = JSON.parse(sessionStorage.getItem("choicenessPre")) || {};
+          this.from = "storage";
+        }
+      } else {
+        this.reportInfo = JSON.parse(sessionStorage.getItem("choicenessPre")) || {};
+        this.from = "storage";
+      }
+      if (this.from == "storage") {
+        this.reportInfo.List.map((item) => {
+          if (this.reportList.length == 0 || this.reportList.every((it) => it.ChartPermissionId != item.ChartPermissionId)) {
+            this.reportList.push({
+              ChartPermissionId: item.ChartPermissionId,
+              ChartPermissionText: this.ChartPermissionTextMap.get(item.ChartPermissionId),
+              ChartPermissionIcon: this.ChartPermissionIconMap.get(item.ChartPermissionId),
+              contetList: [item],
+            });
+          } else {
+            for (const report of this.reportList) {
+              if (report.ChartPermissionId == item.ChartPermissionId) {
+                report.contetList.push(item);
+                break;
+              }
+            }
+          }
+        });
+        this.dataListSubject = this.reportInfo.ListChartSummary;
+      } else {
+        this.reportInfo.List.map((item) => {
+          if (this.reportList.length == 0 || this.reportList.every((it) => it.ChartPermissionId != item.ChartPermissionId)) {
+            this.reportList.push({
+              ChartPermissionId: item.ChartPermissionId,
+              ChartPermissionText: this.ChartPermissionTextMap.get(item.ChartPermissionId),
+              ChartPermissionIcon: this.ChartPermissionIconMap.get(item.ChartPermissionId),
+              contetList: item.List,
+            });
+          } else {
+            for (const report of this.reportList) {
+              if (report.ChartPermissionId == item.ChartPermissionId) {
+                report.contetList.push(item.List);
+                break;
+              }
+            }
+          }
+        });
+        this.reportList = this.reportList.filter((item) => item.contetList && item.contetList.length > 0);
+      }
+    },
+    reportDetailLink() {
+      window.open(this.reportInfo.ReportLink, "_blank");
+    },
+    strFontSize(str) {
+      let font = str
+        .replace(/font-size:\s\w+;?/g, "")
+        .replace(/font-size\s:\w+;?/g, "")
+        .replace(/font-size:\w+;?/g, "");
+      return `<div style="font-size:16px">${font}</div>`;
+    },
+    goArticle(id) {
+      window.open(`https://vmp.hzinsights.com/v2/articles/${id}`, "_blank");
+    },
+  },
+  mounted() {
+    $("#report-content-box img").css("max-width", "100%");
+  },
+};
+</script>
+<style lang="scss" scoped>
+.report-container {
+  padding: 20px;
+  max-width: 1200px;
+  margin: 0 auto;
+  word-break: break-all;
+  box-sizing: border-box;
+  .report-title {
+    font-style: normal;
+    font-weight: bold;
+    font-size: 18px;
+    color: #333333;
+    margin-bottom: 10px;
+  }
+  .report-author-box {
+    margin-bottom: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    .report-author-name {
+      font-style: normal;
+      font-weight: 500;
+      font-size: 16px;
+      color: #333333;
+      margin-bottom: 4px;
+    }
+    .report-publishTime {
+      font-style: normal;
+      font-weight: 400;
+      font-size: 16px;
+      color: #999999;
+    }
+  }
+  .report-attention-direction {
+    text-align: right;
+    span {
+      color: #2a65f5;
+      cursor: pointer;
+    }
+  }
+  .report-disclaimer {
+    font-style: normal;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 22px;
+    color: #999999;
+    span {
+      color: #3385ff;
+      cursor: pointer;
+      margin-left: 4px;
+    }
+  }
+
+  .report-product-description {
+    font-style: normal;
+    font-weight: 400;
+    font-size: 16px;
+    color: #333333;
+    margin-top: 16px;
+  }
+  .report-macro-strategy-pc {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 16px;
+    margin-bottom: 20px;
+    img {
+      width: 26px;
+      height: 20px;
+      margin-right: 10px;
+    }
+  }
+  .report-content-box {
+    .report-content {
+      margin-bottom: 40px;
+      .report-content-header {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 16px;
+        font-weight: 400;
+        color: #333333;
+        img {
+          height: 14px;
+          margin-right: 12px;
+        }
+      }
+      .report-content-report {
+        margin-top: 18px;
+        display: flex;
+        flex-direction: column;
+        .content-report-title {
+          margin-bottom: 10px;
+          min-width: 90px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          align-self: flex-start;
+          padding: 2px 10px;
+          box-sizing: border-box;
+          border-radius: 2px;
+          font-size: 14px;
+          font-family: PingFang SC-Regular, PingFang SC;
+          font-weight: 400;
+          color: #ffffff;
+          background: #3385ff;
+        }
+        .content-report-body {
+          margin-bottom: 10px;
+        }
+        .content-report-detail {
+          font-weight: 400;
+          font-size: 16px;
+          color: #333333;
+          text-align: right;
+          margin-top: 24px;
+          span {
+            color: #2a65f5;
+            cursor: pointer;
+            margin-left: 8px;
+          }
+        }
+      }
+    }
+  }
+  .company-label {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    background: #f2f2f2;
+    width: 100%;
+    padding: 10px 20px;
+    line-height: 1.6;
+    margin-top: 30px;
+    img {
+      width: 40px;
+      height: 20px;
+      margin-right: 22px;
+    }
+    .item {
+      margin-right: 10px;
+    }
+    .item-subject-name {
+      color: #2a65f5;
+      margin-right: 30px;
+    }
+  }
+  .industry-ul {
+    margin-bottom: 40px;
+    .industry-li {
+      width: 100%;
+      display: flex;
+      .industry-name {
+        flex-shrink: 0;
+        width: 104px;
+        background: #2a65f5;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        color: #fff;
+        border-bottom: 1px solid #fff;
+      }
+      .industry-subject {
+        display: flex;
+        flex-wrap: wrap;
+        .subject-item {
+          position: relative;
+          height: 38px;
+          width: 119px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          margin-bottom: -1px;
+          border-top: 1px solid #dcdfe6;
+          border-right: 1px solid #dcdfe6;
+          border-bottom: 1px solid #dcdfe6;
+          a {
+            color: #666;
+            text-decoration: underline;
+          }
+          .icon_subject {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 34px;
+            height: 34px;
+          }
+        }
+      }
+    }
+  }
+  .macro-strategy {
+    width: 100%;
+    height: 100px;
+    // display: flex;
+    // align-items: center;
+    // justify-content: center;
+    font-size: 26px;
+    width: 14px;
+    height: 13px;
+  }
+}
+</style>

src/views/rai_manage/components/report_preview/components/disclaimer.vue

@@ -0,0 +1,113 @@
+<template>
+  <div class="container-dlg" v-show="showTips">
+    <div class="text">
+      <h1>免责声明</h1>
+      <p v-if="disclaimerType=='1'">
+        本文为用户投稿，用户在平台中发表的所有资料、言论等仅代表个人观点，与本平台立场无关，不对您构成任何投资建议。本平台对文中陈述、观点判断保持中立，不对所包含内容及数据的真实性、准确性、可靠性或完整性提供任何明示或暗示的保证。请读者仅作参考，并请自行承担全部责任。
+      </p>
+      <template v-else>
+        <p class="disTypeTwo">1、本报告仅供弘则弥道（上海）投资咨询有限公司正式签约的机构客户使用，不会仅因接收人/接受机构收到本报告而将其视为客户。</p>
+        <p class="disTypeTwo">
+          2、本报告根据国际和行业通行的准则，以合法渠道获得这些信息，尽可能保证可靠、准确和完整，但并不保证报告所述信息的准确性和完整性，也不保证本报告所包含的信息或建议在本报告发出后不会发生任何变更。本报告中所提供的信息仅供参考。
+        </p>
+        <p class="disTypeTwo">
+          3、报告中的内容不对投资者做出的最终操作建议做任何的担保，也没有任何形式的分享投资收益或者分担投资损失的书面或口头承诺。不作为客户在投资、法律、会计或税务等方面的最终操作建议，也不作为道义的、责任的和法律的依据或者凭证，无论是否已经明示或者暗示。
+        </p>
+        <p class="disTypeTwo">4、在任何情况下，本公司不对客户/接受人/接受机构因使用报告中内容所引致的一切损失负责任，客户/接受人/接受机构需自行承担全部风险。</p>
+      </template>
+      <p class="hide-tips" @click="isHide">知道了</p>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name:'disclaimer',
+  props:{
+    showTips: {
+      type: Boolean,
+      required: true,
+      default: false,
+    },
+    // 1: 研选报告 路演精华 2: 报告精选 本周汇总 上周汇总
+    disclaimerType:{
+      type:String,
+      default:'1'
+    }
+  },
+  methods:{
+    isHide(){
+      this.$emit('hideDlg')
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+  .container-dlg {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 99;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.6);
+  padding: 0 8vw;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  @media screen and (min-width:790px) {
+    padding: 0px 30px;
+    width: 1200px;
+    top: 0;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+  .text {
+    width: 100%;
+    background-color: #fff;
+    border-radius: 2.66667vw;
+    @media screen and (min-width:790px) {
+    width: 50%;
+    border-radius: 20px;
+  }
+  h1 {
+      padding-top: 4vw;
+      text-align: center;
+      font: 4.26667vw "PingFang-SC-Regular";
+      color: #333;
+      text-align: center;
+      margin-bottom: 2.26667vw;
+    @media screen and (min-width:790px) {
+      padding-top: 15px;
+      margin-bottom: 17px;
+      font: 16px "PingFang-SC-Regular";
+    }
+    }
+    p {
+      padding: 0 4vw;
+      font-size: 3.46667vw;
+       @media screen and (min-width:790px) {
+    padding: 0 15px;
+      font-size: 14px;
+    }
+    }
+    .disTypeTwo{
+      color: #666;
+    }
+    .hide-tips {
+      cursor: pointer;
+      margin-top: 2.66667vw;
+      font-size: 3.73333vw;
+      line-height: 10.66667vw;
+      color: #2680eb;
+      text-align: center;
+      border-top: 1px solid #eaeaea;
+    @media screen and (min-width:790px) {
+      margin-top: 10px;
+      font-size: 14px;
+      line-height: 40px;
+    }
+    }
+  }
+}
+</style>

src/views/rai_manage/components/report_preview/components/toTop.vue

@@ -0,0 +1,30 @@
+<template>
+  <div class="toTop-image">
+    <img src="~@/assets/img/icons/returntop.png" @click="toTop" />
+  </div>
+</template>
+<script>
+export default {
+  name:'toTop',
+  methods:{
+    toTop(){
+      document.body.scrollTop = document.documentElement.scrollTop = 0;
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+  .toTop-image{
+    position: fixed;
+    right: 20px;
+    bottom: 150px;
+    z-index: 10;
+    // @media screen and (max-width:790px) {
+    //   bottom: 40px;
+    // }
+    img{
+      width: 40px;
+      cursor: pointer;
+    }
+  }
+</style>

src/views/rai_manage/components/report_preview/lastWeekSummary.vue

@@ -0,0 +1,307 @@
+<template>
+    <div>
+        <div class="report-container">
+            <div class="report-title">{{reportInfo.Title}}</div>
+            <div class="report-author-box">
+                <div class="report-author-name">
+                    {{reportInfo.Department}}
+                </div>
+                <div class="report-publishTime">
+                    {{publishTime}}
+                </div>
+            </div>
+            <div class="report-disclaimer">
+                注：请务必阅读<span @click="showDisclaimer">免责声明</span>
+            </div>
+            <div class="report-abstract">
+                摘要：{{reportInfo.Abstract}}
+            </div>
+            <div class="report-content-box" id="report-content-box">
+              <div class="report-big-content" v-for="item1 in reportList" :key="item1.name">
+                <template v-if="item1.name != '买方研选纪要'">
+                  <div class="report-big-content-title">
+                    <img :src="item1.icon"/>{{item1.name}}
+                  </div>
+                  <div class="report-small-content" v-for="item2 in item1.list" :key="item2.ChartPermissionId">
+                    <div class="report-type-tag">
+                      <img :src="item2.IcoLink"/>
+                      {{item2.ChartPermissionName}}
+                    </div>
+                    <div class="report-content" v-for="(item3,index3) in item2.List" :key="index3">
+                      <div class="report-body" v-html="item3.Body"></div>
+                      <div class="report-detail-link"  @click="toReportDetail(item3.ReportLink)" v-if="item3.ReportLink">点击查看详情</div>
+                    </div>
+                  </div>
+                </template>
+                <template v-else>
+                  <div class="report-big-content-title">
+                    <img :src="item1.icon"/>{{item1.name}}
+                  </div>
+                  <div class="report-small-content">
+                    <div class="report-content" v-for="(item4,index4) in item1.list" :key="index4">
+                      <div class="report-body" v-html="item4.Body"></div>
+                      <div class="report-detail-link"  @click="toReportDetail(item4.ReportLink)" v-if="item4.ReportLink">点击查看详情</div>
+                    </div>
+                  </div>
+
+                </template>
+              </div>
+            </div>
+
+        </div>
+        <Disclaimer :showTips="showTips" @hideDlg="showTips = false" disclaimerType='2'/>
+        <toTop />
+    </div>
+</template>
+<script>
+import Disclaimer from './components/disclaimer.vue'
+import toTop from "./components/toTop.vue"
+import moment from "moment";
+import { raiInterface } from "@/api/api.js";
+
+export default {
+    name:"summaryPre",
+    components:{
+        Disclaimer,
+        toTop
+    },
+    computed:{
+        publishTime(){
+            return moment(this.reportInfo.PublishDate).format('YYYY-MM-DD hh:mm:ss')
+        }
+    },
+    data(){
+        return {
+            reportInfo:{},
+            showTips:false,
+            // 报告数据
+            reportList:[]
+        }
+    },
+    created(){
+      this.init()
+    },
+    mounted() {
+        $("#report-content-box img").css('max-width','100%')
+    },
+    methods:{
+      showDisclaimer(){
+          this.showTips = true
+      },
+      // 将reportInfo中的list解出来 方便页面展示
+      async init(){
+        let Content=''
+        console.log(this.reportInfo);
+        if(this.$route.query.ArticleId){
+          // 有ArticleId 是通过列表点击进来的
+          let res = await raiInterface.minutesSummaryDetail({ ArticleId: this.$route.query.ArticleId || ""})
+          if(res.Ret == 200){
+              this.reportInfo = res.Data
+              Content = this.reportInfo
+          }else{
+              this.reportInfo = JSON.parse(sessionStorage.getItem('lastWeekPre')) || {}
+              Content = this.reportInfo.Content
+          }
+        }else{
+          this.reportInfo = JSON.parse(sessionStorage.getItem('lastWeekPre')) || {}
+          Content = this.reportInfo.Content
+        }
+        // let {Content} = this.reportInfo
+        
+        if(Content.SortCydyjy != ''){
+          this.reportList.push({
+            // 报告列表
+            list:Content.ListCydyjy,
+            // 名称
+            name:'产业调研纪要',
+            // 排序
+            sort:Content.SortCydyjy,
+            icon:''
+          })
+        }
+        if(Content.SortSsgs != ''){
+          this.reportList.push({
+            // 报告列表
+            list:Content.ListSsgs,
+            // 名称
+            name:'上市公司调研纪要',
+            // 排序
+            sort:Content.SortSsgs,
+            icon:''
+          })
+        }
+        if(Content.SortYanx != ''){
+          this.reportList.push({
+            // 报告列表
+            list:Content.ListYanx,
+            // 名称
+            name:'买方研选纪要',
+            // 排序
+            sort:Content.SortYanx,
+            icon:''
+          })
+        }
+        for (let report of this.reportList) {
+          if(report.name == "上市公司调研纪要"){
+            report.icon = 'https://hongze.oss-cn-shanghai.aliyuncs.com/static/images/202111/20211101/ujHXB48I8ay9T0XoPRI7lorz7OkL.png'
+          }else if(report.name == "产业调研纪要"){
+            report.icon = 'https://hongze.oss-cn-shanghai.aliyuncs.com/static/images/202110/20211020/UPAdozy96z9ypzY04vi0Y3Ogqzji.png'
+          }else{
+            report.icon = 'https://hongze.oss-cn-shanghai.aliyuncs.com/static/images/202111/20211104/QbTGTNhD9MxYp24cJ7V5WpCN0oNl.png'
+          }
+        }
+        // 买方研选纪要里面没有排序项目
+        for (let report of this.reportList.filter(it => it.name!='买方研选纪要')) {
+          for (const item of report.list) {
+            if(item.ChartPermissionName == '智造'){
+              item.IcoLink = "https://hzstatic.hzinsights.com/static/temp/20220707202207/20220707/1sZLc8DnXMPkB29QQATstvtEvi20.png"
+            }else if(item.ChartPermissionName == '医药'){
+              item.IcoLink = "https://hzstatic.hzinsights.com/static/temp/20220707202207/20220707/5Xa9gP3A2dyR2AXoXcTyrboTEYl4.png"
+            }else if(item.ChartPermissionName == '消费'){
+              item.IcoLink = "https://hzstatic.hzinsights.com/static/temp/20220707202207/20220707/yAcPQU6iAgO3tgP1yNSlOmRhgfl9.png"
+            }else{
+              item.IcoLink = "https://hzstatic.hzinsights.com/static/temp/20220707202207/20220707/GIMrrZKC1GEOzGbaTBCkE5i6N9DJ.png"
+            }
+          }
+          // 清除没有写排序的项目 没有排序就没有内容
+          report.list = report.list.filter(item => item.ChartPermissionSort!='')
+          // 里层排序
+          report.list.sort((a,b) => a.ChartPermissionSort - b.ChartPermissionSort)
+        }
+        // 外层排序
+        this.reportList.sort((a,b)=> a.sort.charCodeAt()-b.sort.charCodeAt())
+        console.log(this.reportList);
+      },
+      toReportDetail(reportLink){
+        window.open(reportLink, '_blank');
+      }
+    },
+}
+</script>
+<style lang="scss" scoped>
+    .report-container{
+        padding: 20px;
+        max-width: 1200px;
+        margin: 0 auto;
+        word-break: break-all;
+        box-sizing: border-box;
+        .report-title{
+            font-style: normal;
+            font-weight: bold;
+            font-size: 18px;
+            color: #333333;
+            margin-bottom: 10px;
+        }
+        .report-author-box{
+            margin-bottom: 10px;
+            display:flex;
+            align-items:center;
+            justify-content:space-between;
+            flex-wrap: wrap;
+            .report-author-name{
+                font-style: normal;
+                font-weight: 500;
+                font-size: 16px;
+                color: #333333;
+                margin-bottom: 4px;
+            }
+            .report-publishTime{
+                font-style: normal;
+                font-weight: 400;
+                font-size: 16px;
+                color: #999999;
+            }
+        }
+        .report-disclaimer{
+            font-style: normal;
+            font-weight: 400;
+            font-size: 16px;
+            line-height: 22px;
+            color: #999999;
+            span{
+                color: #3385FF;
+                cursor: pointer;
+                margin-left: 4px;
+            }
+        }
+        .report-abstract{
+            font-style: normal;
+            font-weight: 400;
+            font-size: 16px;
+            color: #666666;
+            padding: 12px 0;
+            text-indent: 14px;
+            word-break: break-all;
+            position: relative;
+            border-bottom: 1px dashed #DCDFE6;
+            &:before{
+                content: '';
+                height: 20px;
+                width: 4px;
+                background-color: #3385FF;
+                position: absolute;
+                left: 0;
+                top: 12px;
+            }
+        }
+        .report-content-box{
+          margin-top: 30px;
+          .report-big-content{
+            .report-big-content-title{
+              font-style: normal;
+              font-weight: 400;
+              font-size: 14px;
+              color: #333333;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              margin-bottom: 20px;
+              img{
+                height: 14px;
+                margin-right: 10px;
+              }
+            }
+            .report-small-content{
+              display: flex;
+              flex-direction: column;
+              margin-bottom: 30px;
+              .report-type-tag{
+                height: 24px;
+                min-width: 90px;
+                padding: 2px 10px;
+                box-sizing: border-box;
+                background-color: #3385FF;
+                border-radius: 2px;
+                font-weight: 400;
+                font-size: 14px;
+                color: #FFFFFF;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                align-self: flex-start;
+                margin-bottom: 16px;
+                img{
+                  height: 14px;
+                  margin-right: 6px;
+                }
+              }
+              .report-content{
+                margin-bottom: 38px;
+                &:last-child{
+                  margin-bottom: 0;
+                }
+                .report-detail-link{
+                  font-weight: 400;
+                  font-size: 16px;
+                  color: #2A65F5;
+                  margin-top: 14px;
+                  text-align: right;
+                  cursor: pointer;
+                }
+              }
+            }
+          }
+
+        }
+    }
+</style>

src/views/rai_manage/components/report_preview/roadshowPre.vue

@@ -0,0 +1,176 @@
+<template>
+    <div>
+        <div class="report-container">
+            <div class="report-title">{{reportInfo.Title}}</div>
+            <div class="report-author-box">
+                <div class="report-author-name">
+                    {{reportInfo.SellerAndMobile}}
+                </div>
+                <div class="report-publishTime">
+                    <div>
+                        {{publishDate}}
+                    </div>
+                    <div>
+                        {{publishTime}}
+                    </div>
+                </div>
+            </div>
+            <div class="report-disclaimer">
+                注：请务必阅读<span @click="showDisclaimer">免责声明</span>
+            </div>
+            <div class="report-abstract">
+                摘要：{{reportInfo.Abstract}}
+            </div>
+            <div class="report-content-item">
+                <div class="report-content" id="report-content" v-html="reportInfo.Body"></div>
+                <div class="deeperReport" @click="lookDeeperReport" v-if="reportInfo.ReportLink">
+                    查看深度报告
+                </div>
+            </div>
+        </div>
+        <Disclaimer :showTips="showTips" @hideDlg="showTips = false" />
+        <toTop />
+    </div>
+</template>
+<script>
+import Disclaimer from './components/disclaimer.vue'
+import toTop from "./components/toTop.vue"
+import moment from "moment";
+import { raiInterface } from "@/api/api.js";
+
+export default {
+    name:"summaryPre",
+    components:{
+        Disclaimer,
+        toTop
+    },
+    computed:{
+        publishDate(){
+            return moment(this.reportInfo.PublishDate).format('YYYY-MM-DD')
+        },
+        publishTime(){
+            return moment(this.reportInfo.PublishDate).format('hh:mm:ss')
+        },
+    },
+    data(){
+        return {
+            reportInfo:{},
+            showTips:false
+        }
+    },
+    created(){
+        this.init()
+    },
+    methods:{
+        showDisclaimer(){
+            this.showTips = true
+        },
+        lookDeeperReport(){
+            window.open(this.reportInfo.ReportLink, '_blank');
+        },
+        async init(){
+            if(this.$route.query.ArticleId){
+                // 有ArticleId 是通过列表点击进来的
+                let res = await raiInterface.roadshowEssenceDetail({ ArticleId: this.$route.query.ArticleId || ""})
+                if(res.Ret == 200){
+                    this.reportInfo = res.Data
+                }else{
+                    this.reportInfo = JSON.parse(sessionStorage.getItem('roadShowPre')) || {}
+                }
+            }else{
+                this.reportInfo = JSON.parse(sessionStorage.getItem('roadShowPre')) || {}
+            }
+            // console.log(this.reportInfo);
+        }
+    },
+    mounted() {
+        $("#report-content img").css('max-width','100%')
+    },
+}
+</script>
+<style lang="scss" scoped>
+    .report-container{
+        word-break: break-all;
+        padding: 20px;
+        max-width: 1200px;
+        margin: 0 auto;
+        box-sizing: border-box;
+        .report-title{
+            font-style: normal;
+            font-weight: bold;
+            font-size: 18px;
+            color: #333333;
+            margin-bottom: 10px;
+        }
+        .report-author-box{
+            margin-bottom: 10px;
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            .report-author-name{
+                font-style: normal;
+                font-weight: 500;
+                font-size: 16px;
+                color: #333333;
+                margin-bottom: 4px;
+            }
+            .report-publishTime{
+                font-style: normal;
+                font-weight: 400;
+                font-size: 16px;
+                color: #999999;
+                text-align: right;
+            }
+        }
+        .report-disclaimer{
+            font-style: normal;
+            font-weight: 400;
+            font-size: 16px;
+            line-height: 22px;
+            color: #999999;
+            span{
+                color: #3385FF;
+                cursor: pointer;
+                margin-left: 4px;
+            }
+        }
+        .report-abstract{
+            font-style: normal;
+            font-weight: 400;
+            font-size: 16px;
+            color: #666666;
+            padding: 12px 0;
+            text-indent: 14px;
+            word-break: break-all;
+            position: relative;
+            border-bottom: 1px dashed #DCDFE6;
+            &:before{
+                content: '';
+                height: 20px;
+                width: 4px;
+                background-color: #3385FF;
+                position: absolute;
+                left: 0;
+                top: 12px;
+            }
+        }
+        .report-content-item{
+            margin-top: 10px;
+            .deeperReport{
+                width: 128px;
+                height: 40px;
+                background: #1890FF;
+                box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.0400);
+                border-radius: 2px 2px 2px 2px;
+                font-size: 16px;
+                font-weight: 400;
+                color: #FFFFFF;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                margin: 30px auto 0 auto;
+                cursor: pointer;
+            }
+        }
+    }
+</style>

src/views/rai_manage/components/report_preview/summaryPre.vue

@@ -0,0 +1,158 @@
+<template>
+  <div>
+    <div class="report-container">
+      <div class="report-title">{{ reportInfo.Title }}</div>
+      <div class="report-author-box">
+        <img :src="reportInfo.ImgUrl" v-if="reportInfo.ImgUrl" />
+        <div :class="[!reportInfo.NickName && 'report-hz']">
+          <div class="report-author-name">
+            {{ reportInfo.NickName || reportInfo.SellerAndMobile }}
+          </div>
+          <div class="report-publishTime">
+            {{ publishTime }}
+          </div>
+        </div>
+      </div>
+      <div class="report-disclaimer">注：请务必阅读<span @click="showDisclaimer">免责声明</span></div>
+      <div class="report-abstract">
+        <div>摘要：</div>
+        <div>
+          {{ reportInfo.Abstract }}
+        </div>
+      </div>
+      <div class="report-content-item">
+        <div class="report-content" id="report-content" v-html="reportInfo.Body"></div>
+      </div>
+      <div class="deeperReport" @click="lookDeeperReport" v-if="reportInfo.ReportLink">查看报告链接</div>
+    </div>
+    <Disclaimer :showTips="showTips" @hideDlg="showTips = false" />
+    <toTop />
+  </div>
+</template>
+<script>
+import Disclaimer from "./components/disclaimer.vue";
+import toTop from "./components/toTop.vue";
+import moment from "moment";
+
+export default {
+  name: "summaryPre",
+  components: {
+    Disclaimer,
+    toTop,
+  },
+  computed: {
+    publishTime() {
+      return moment(new Date()).format("YYYY-MM-DD");
+    },
+  },
+  data() {
+    return {
+      reportInfo: JSON.parse(sessionStorage.getItem("summaryPre")) || "",
+      showTips: false,
+    };
+  },
+  methods: {
+    showDisclaimer() {
+      this.showTips = true;
+    },
+    lookDeeperReport() {
+      window.open(this.reportInfo.ReportLink, "_blank");
+    },
+  },
+  mounted() {
+    console.log(this.reportInfo);
+    $("#report-content img").css("max-width", "100%");
+  },
+};
+</script>
+<style lang="scss" scoped>
+.report-container {
+  word-break: break-all;
+  padding: 20px;
+  max-width: 1200px;
+  margin: 0 auto;
+  box-sizing: border-box;
+  .report-hz {
+    display: flex;
+    align-items: center;
+    .report-author-name {
+      margin-right: 30px;
+      margin-bottom: 0px !important;
+    }
+  }
+  .report-title {
+    font-style: normal;
+    font-weight: bold;
+    font-size: 30px;
+    color: #333333;
+    font-weight: 600;
+    margin-bottom: 10px;
+  }
+  .report-author-box {
+    margin-bottom: 10px;
+    display: flex;
+    img {
+      width: 41px;
+      height: 41px;
+      overflow: hidden;
+      margin-right: 15px;
+    }
+    .report-author-name {
+      font-style: normal;
+      font-weight: 500;
+      font-size: 16px;
+      color: #333333;
+      margin-bottom: 4px;
+    }
+    .report-publishTime {
+      font-style: normal;
+      font-weight: 400;
+      font-size: 12px;
+      color: #b3b3b3;
+    }
+  }
+  .report-disclaimer {
+    font-style: normal;
+    font-weight: 400;
+    font-size: 14px;
+    line-height: 22px;
+    color: #999999;
+    margin: 15px 0;
+    span {
+      color: #3385ff;
+      cursor: pointer;
+      margin-left: 4px;
+    }
+  }
+  .report-abstract {
+    border-left: 3px solid #001529;
+    padding-left: 12px;
+    :nth-child(1){
+      margin-bottom: 0.6em;
+      font-size: 20px;
+      color: #000;
+      font-style: italic;
+    }
+  }
+  .report-content-item {
+    margin-top: 20px;
+    padding-top: 20px;
+    border-top: 1px solid #f0f0f0;
+  }
+  .deeperReport {
+    width: 128px;
+    height: 40px;
+    background: #1890ff;
+    box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.04);
+    border-radius: 2px 2px 2px 2px;
+    font-size: 16px;
+    font-weight: 400;
+    color: #ffffff;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 80px auto 0 auto;
+    cursor: pointer;
+  }
+}
+</style>

src/views/rai_manage/components/report_preview/thisWeekSummary.vue

@@ -0,0 +1,334 @@
+<template>
+    <div>
+        <div class="report-container">
+            <div class="report-title">{{reportInfo.Title}}</div>
+            <div class="report-author-box">
+                <div class="report-author-name">
+                    {{reportInfo.Department}}
+                </div>
+                <div class="report-publishTime">
+                    {{publishTime}}
+                </div>
+            </div>
+            <div class="report-disclaimer">
+                注：请务必阅读<span @click="showDisclaimer">免责声明</span>
+            </div>
+            <div class="report-abstract">
+                摘要：{{reportInfo.Abstract}}
+            </div>
+            <div class="report-content-box" id="report-content-box">
+              <div class="report-big-content" v-for="item1 in reportList" :key="item1.name">
+                <template v-if="item1.name != '市场QA汇总'">
+                  <div class="report-big-content-title">
+                    <img :src="item1.icon"/>{{item1.name}}
+                  </div>
+                  <div class="report-small-content" v-for="item2 in item1.list" :key="item2.ChartPermissionId">
+                    <div class="report-type-tag">
+                      <img :src="item2.IcoLink"/>
+                      {{item2.ChartPermissionName}}
+                    </div>
+                    <div class="report-content" v-for="(item3,index3) in item2.List" :key="index3">
+                      <div class="report-body" v-html="item3.Body"></div>
+                      <div class="report-detail-link" @click="toReportDetail(item3.ReportLink)" v-if="item3.ReportLink">点击查看详情</div>
+                    </div>
+                  </div>
+                </template>
+                <template v-else>
+                  <div class="report-big-content-title">
+                    <img :src="item1.icon"/>{{item1.name}}
+                  </div>
+                  <div class="report-small-content">
+                    <div class="report-content" v-for="(item4,index4) in item1.list" :key="index4">
+                      <div class="report-body" v-html="item4.Body"></div>
+                      <div class="report-detail-link" @click="toReportDetail(item4.ReportLink)" v-if="item4.ReportLink">点击查看详情</div>
+                    </div>
+                  </div>
+
+                </template>
+              </div>
+            </div>
+
+        </div>
+        <Disclaimer :showTips="showTips" @hideDlg="showTips = false" disclaimerType='2'/>
+        <toTop />
+    </div>
+</template>
+<script>
+import Disclaimer from './components/disclaimer.vue'
+import toTop from "./components/toTop.vue"
+import moment from "moment";
+import { raiInterface } from "@/api/api.js";
+
+export default {
+    name:"summaryPre",
+    components:{
+        Disclaimer,
+        toTop
+    },
+    computed:{
+        publishTime(){
+            return moment(this.reportInfo.PublishDate).format('YYYY-MM-DD hh:mm:ss')
+        }
+    },
+    data(){
+        return {
+            reportInfo:{},
+            showTips:false,
+            // 报告数据
+            reportList:[]
+        }
+    },
+    created(){
+      this.init()
+    },
+    mounted() {
+        $("#report-content-box img").css('max-width','100%')
+    },
+    methods:{
+      showDisclaimer(){
+          this.showTips = true
+      },
+      // 将reportInfo中的list解出来 方便页面展示
+      async init(){
+        let Content=''
+        if(this.$route.query.ArticleId){
+          // 有ArticleId 是通过列表点击进来的
+          let res = await raiInterface.researchSummaryDetail({ ArticleId: this.$route.query.ArticleId || ""})
+          if(res.Ret == 200){
+              this.reportInfo = res.Data
+              Content = this.reportInfo
+          }else{
+              this.reportInfo = JSON.parse(sessionStorage.getItem('thisWeekPre')) || {}
+              Content = this.reportInfo.Content
+          }
+        }else{
+          this.reportInfo = JSON.parse(sessionStorage.getItem('thisWeekPre')) || {}
+          Content = this.reportInfo.Content
+        }
+        // console.log(Content);
+        
+        if(Content.SortBzchjh != ''){
+          this.reportList.push({
+            // 报告列表
+            list:Content.ListBzchjh,
+            // 名称
+            name:'本周晨会精华',
+            // 排序
+            sort:Content.SortBzchjh,
+            icon:''
+          })
+        }
+        if(Content.SortCydyjy != ''){
+          this.reportList.push({
+            // 报告列表
+            list:Content.ListCydyjy,
+            // 名称
+            name:'产业调研纪要',
+            // 排序
+            sort:Content.SortCydyjy,
+            icon:''
+          })
+        }
+        if(Content.SortSdbg != ''){
+          this.reportList.push({
+            // 报告列表
+            list:Content.ListSdbg,
+            // 名称
+            name:'深度报告',
+            // 排序
+            sort:Content.SortSdbg,
+            icon:''
+          })
+        }
+        if(Content.SortSjdp != ''){
+          this.reportList.push({
+            // 报告列表
+            list:Content.ListSjdp,
+            // 名称
+            name:'市场QA汇总',
+            // 排序
+            sort:Content.SortSjdp,
+            icon:''
+          })
+        }
+        if(Content.SortSsgs != ''){
+          this.reportList.push({
+            // 报告列表
+            list:Content.ListSsgs,
+            // 名称
+            name:'上市公司调研纪要',
+            // 排序
+            sort:Content.SortSsgs,
+            icon:''
+          })
+        }
+        for (let report of this.reportList) {
+          if(report.name == "深度报告"){
+            report.icon = 'https://hongze.oss-cn-shanghai.aliyuncs.com/static/images/202110/20211027/le8AcRjDz0MhA72bVDiaf3d5ALSe.png'
+          }else if(report.name == "产业调研纪要"){
+            report.icon = 'https://hongze.oss-cn-shanghai.aliyuncs.com/static/images/202110/20211020/UPAdozy96z9ypzY04vi0Y3Ogqzji.png'
+          }else if(report.name == "本周晨会精华"){
+            report.icon = 'https://hongze.oss-cn-shanghai.aliyuncs.com/static/images/202110/20211020/DCfekcxaIKGePBsNVu1ULfmNcJBY.png'
+          }else if(report.name == "市场QA汇总"){
+            report.icon = 'https://hongze.oss-cn-shanghai.aliyuncs.com/static/images/202110/20211020/2a5cXafO3Iws4QcFp1bd5WPdYikV.png'
+          }else {
+            report.icon = 'https://hongze.oss-cn-shanghai.aliyuncs.com/static/images/202111/20211101/ujHXB48I8ay9T0XoPRI7lorz7OkL.png'
+          }
+        }
+        // 市场QA汇总里面没有排序项目
+        for (let report of this.reportList.filter(it => it.name!='市场QA汇总')) {
+          for (const item of report.list) {
+            if(item.ChartPermissionName == '智造'){
+              item.IcoLink = "https://hzstatic.hzinsights.com/static/temp/20220707202207/20220707/1sZLc8DnXMPkB29QQATstvtEvi20.png"
+            }else if(item.ChartPermissionName == '医药'){
+              item.IcoLink = "https://hzstatic.hzinsights.com/static/temp/20220707202207/20220707/5Xa9gP3A2dyR2AXoXcTyrboTEYl4.png"
+            }else if(item.ChartPermissionName == '消费'){
+              item.IcoLink = "https://hzstatic.hzinsights.com/static/temp/20220707202207/20220707/yAcPQU6iAgO3tgP1yNSlOmRhgfl9.png"
+            }else if(item.ChartPermissionName == '策略'){
+              item.IcoLink = ""
+            }else{
+              item.IcoLink = "https://hzstatic.hzinsights.com/static/temp/20220707202207/20220707/GIMrrZKC1GEOzGbaTBCkE5i6N9DJ.png"
+            }
+          }
+          // 清除没有写排序的项目 没有排序就没有内容
+          report.list = report.list.filter(item => item.ChartPermissionSort!='')
+          // 里层排序
+          report.list.sort((a,b) => a.ChartPermissionSort - b.ChartPermissionSort)
+        }
+        // 外层排序
+        this.reportList.sort((a,b)=> a.sort.charCodeAt()-b.sort.charCodeAt())
+        console.log(this.reportList);
+      },
+      toReportDetail(reportLink){
+        window.open(reportLink, '_blank');
+      }
+    },
+}
+</script>
+<style lang="scss" scoped>
+    .report-container{
+        padding: 20px;
+        max-width: 1200px;
+        margin: 0 auto;
+        word-break: break-all;
+        box-sizing: border-box;
+        .report-title{
+            font-style: normal;
+            font-weight: bold;
+            font-size: 18px;
+            color: #333333;
+            margin-bottom: 10px;
+        }
+        .report-author-box{
+            margin-bottom: 10px;
+            display:flex;
+            align-items:center;
+            justify-content:space-between;
+            flex-wrap: wrap;
+            .report-author-name{
+                font-style: normal;
+                font-weight: 500;
+                font-size: 16px;
+                color: #333333;
+                margin-bottom: 4px;
+            }
+            .report-publishTime{
+                font-style: normal;
+                font-weight: 400;
+                font-size: 16px;
+                color: #999999;
+            }
+        }
+        .report-disclaimer{
+            font-style: normal;
+            font-weight: 400;
+            font-size: 16px;
+            line-height: 22px;
+            color: #999999;
+            span{
+                color: #3385FF;
+                cursor: pointer;
+                margin-left: 4px;
+            }
+        }
+        .report-abstract{
+            font-style: normal;
+            font-weight: 400;
+            font-size: 16px;
+            color: #666666;
+            padding: 12px 0;
+            text-indent: 14px;
+            word-break: break-all;
+            position: relative;
+            border-bottom: 1px dashed #DCDFE6;
+            &:before{
+                content: '';
+                height: 20px;
+                width: 4px;
+                background-color: #3385FF;
+                position: absolute;
+                left: 0;
+                top: 12px;
+            }
+        }
+        .report-content-box{
+          margin-top: 30px;
+          .report-big-content{
+            .report-big-content-title{
+              font-style: normal;
+              font-weight: 400;
+              font-size: 14px;
+              color: #333333;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              margin-bottom: 20px;
+              img{
+                height: 14px;
+                margin-right: 10px;
+              }
+            }
+            .report-small-content{
+              display: flex;
+              flex-direction: column;
+              margin-bottom: 30px;
+              .report-type-tag{
+                height: 24px;
+                min-width: 90px;
+                padding: 2px 10px;
+                box-sizing: border-box;
+                background-color: #3385FF;
+                border-radius: 2px;
+                font-weight: 400;
+                font-size: 14px;
+                color: #FFFFFF;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                align-self: flex-start;
+                margin-bottom: 16px;
+                img{
+                  height: 14px;
+                  margin-right: 6px;
+                }
+              }
+              .report-content{
+                margin-bottom: 38px;
+                &:last-child{
+                  margin-bottom: 0;
+                }
+                .report-detail-link{
+                  font-weight: 400;
+                  font-size: 16px;
+                  color: #2A65F5;
+                  margin-top: 14px;
+                  text-align: right;
+                  cursor: pointer;
+                }
+              }
+            }
+          }
+
+        }
+    }
+</style>

src/views/rai_manage/components/richText.vue

@@ -0,0 +1,132 @@
+<template>
+  <div class="richtext">
+    <froala :id="'editor' + spareId" :tag="'textarea'" :config="froalaConfig" v-model="valueText" @input="inputHandler"></froala>
+  </div>
+</template>
+
+<script>
+import VueFroala from "vue-froala-wysiwyg";
+export default {
+  name: "",
+  components: {},
+  model: {
+    prop: "valueText",
+    event: "contentText",
+  },
+  props: {
+    spareId: {
+      type: String,
+      required: true,
+    },
+    isText: {
+      type: String,
+      required: true,
+      default: "",
+    },
+    valueText: {
+      type: String,
+      required: true,
+    },
+  },
+  watch: {
+    isText: {
+      handler(newVal) {
+        if (newVal) {
+          this.froalaConfig.placeholderText = newVal;
+        }
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  data() {
+    var that = this;
+    return {
+      editor: null,
+      froalaConfig: {
+        //More -> https://www.froala.com/wysiwyg-editor/docs/options
+        // toolbarButtons: ['undo', 'redo', 'clearFormatting', '|', 'bold', 'italic', 'underline','strikeThrough','|', 'fontFamily', 'fontSize', 'color', '|','paragraphFormat', 'align', 'formatOL', 'formatUL', 'outdent', 'indent', 'quote', '-', 'insertLink', 'insertImage', 'insertVideo', 'embedly', 'insertFile', 'insertTable', '|', 'emoticons', 'specialCharacters', 'insertHR', 'selectAll', '|', 'print', 'spellChecker', 'help', '|', 'fullscreen'],//['fullscreen', 'bold', 'italic', 'underline', 'strikeThrough', 'subscript', 'superscript', '|', 'fontFamily', 'fontSize', 'color', 'inlineStyle', 'paragraphStyle', '|', 'paragraphFormat', 'align', 'formatOL', 'formatUL', 'outdent', 'indent', 'quote', '-', 'insertLink', 'insertImage', 'insertVideo', 'embedly', 'insertFile', 'insertTable', '|', 'emoticons', 'specialCharacters', 'insertHR', 'selectAll', 'clearFormatting', '|', 'print', 'spellChecker', 'help', 'html', '|', 'undo', 'redo'],//显示可操作项
+        toolbarButtons: [
+          "insertImage",
+          "textColor",
+          "bold",
+          "italic",
+          "underline",
+          "strikeThrough",
+          "fontFamily",
+          "fontSize",
+          "color",
+          "paragraphStyle",
+          "lineHeight",
+          "paragraphFormat",
+          "align",
+          "insertHR",
+          "undo",
+          "redo",
+        ],
+        height: 400,
+        fontSize: ["12", "14", "16", "18", "20", "24", "28", "32", "36", "40"],
+        fontSizeDefaultSelection: "16",
+        theme: "dark", //主题
+        // placeholderText: this.isText,
+        language: "zh_cn", //国际化
+        imageUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url
+        videoUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url
+        fileUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url 更多上传介绍 请访问https://www.froala.com/wysiwyg-editor/docs/options
+        imageDefaultWidth: false,
+        // imageEditButtons:['imageAlign', 'imageCaption', 'imageRemove', '|', 'imageLink', 'linkOpen', 'linkEdit', 'linkRemove', '-', 'imageDisplay', 'imageStyle', 'imageAlt', 'imageSize'],
+        quickInsertButtons: ["image", "table", "ul", "ol", "hr"], //快速插入项
+        toolbarVisibleWithoutSelection: true, //是否开启 不选中模式
+        // disableRightClick:true,//是否屏蔽右击
+        // colorsHEXInput:false,//关闭16进制色值
+        toolbarSticky: false, //操作栏是否自动吸顶
+        // zIndex:99999,
+        saveInterval: 0,
+        events: {
+          initialized: function () {
+            // this.editor = editor;
+            that.editor = this;
+            // that.editor.html.set(that.value);
+            // that.setHtml()
+          },
+          keyup: function (e, editor) {
+            //添加事件，在每次按键按下时，都记录一下最后停留位置
+            that.$nextTick(function () {
+              that.lastEditRange = getSelection().getRangeAt(0);
+            });
+          },
+          click: function (e, editor) {
+            //添加事件，在每次鼠标点击时，都记录一下最后停留位置
+            that.$nextTick(function () {
+              that.lastEditRange = getSelection().getRangeAt(0);
+            });
+          },
+        },
+        charCounterCount: false,
+        reportloadding: false,
+        lastsavetime: "",
+        isAddEnter: false, //是否已经添加过
+        timer: null,
+        ischange: false,
+        isPublishloading: false,
+      },
+      value: "",
+    };
+  },
+  methods: {
+    inputHandler() {
+      this.$emit("contentText", this.valueText);
+    },
+  },
+};
+</script>
+<style lang="scss">
+.richtext {
+  .fr-placeholder {
+    margin-top: 41px !important;
+  }
+  .fr-second-toolbar {
+    display: none;
+  }
+}
+</style>

src/views/rai_manage/components/selection/mixins.js

@@ -0,0 +1,152 @@
+export default {
+  data() {
+    var that = this;
+    return {
+      froalaConfig: {
+        //More -> https://www.froala.com/wysiwyg-editor/docs/options
+        // toolbarButtons: ['undo', 'redo', 'clearFormatting', '|', 'bold', 'italic', 'underline','strikeThrough','|', 'fontFamily', 'fontSize', 'color', '|','paragraphFormat', 'align', 'formatOL', 'formatUL', 'outdent', 'indent', 'quote', '-', 'insertLink', 'insertImage', 'insertVideo', 'embedly', 'insertFile', 'insertTable', '|', 'emoticons', 'specialCharacters', 'insertHR', 'selectAll', '|', 'print', 'spellChecker', 'help', '|', 'fullscreen'],//['fullscreen', 'bold', 'italic', 'underline', 'strikeThrough', 'subscript', 'superscript', '|', 'fontFamily', 'fontSize', 'color', 'inlineStyle', 'paragraphStyle', '|', 'paragraphFormat', 'align', 'formatOL', 'formatUL', 'outdent', 'indent', 'quote', '-', 'insertLink', 'insertImage', 'insertVideo', 'embedly', 'insertFile', 'insertTable', '|', 'emoticons', 'specialCharacters', 'insertHR', 'selectAll', 'clearFormatting', '|', 'print', 'spellChecker', 'help', 'html', '|', 'undo', 'redo'],//显示可操作项
+        toolbarButtons: [
+          "insertImage",
+          "textColor",
+          "bold",
+          "italic",
+          "underline",
+          "strikeThrough",
+          "fontFamily",
+          "fontSize",
+          "color",
+          "paragraphStyle",
+          "lineHeight",
+          "paragraphFormat",
+          "align",
+          "insertHR",
+          "undo",
+          "redo",
+        ],
+        height: 200,
+        fontSize: ["12", "14", "16", "18", "20", "24", "28", "32", "36", "40"],
+        fontSizeDefaultSelection: "16",
+        theme: "dark", //主题
+        placeholderText: "请输入文字描述",
+        language: "zh_cn", //国际化
+        imageUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url
+        videoUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url
+        fileUploadURL: process.env.API_ROOT + "/report/uploadImg", //上传url 更多上传介绍 请访问https://www.froala.com/wysiwyg-editor/docs/options
+        imageDefaultWidth: false,
+        // imageEditButtons:['imageAlign', 'imageCaption', 'imageRemove', '|', 'imageLink', 'linkOpen', 'linkEdit', 'linkRemove', '-', 'imageDisplay', 'imageStyle', 'imageAlt', 'imageSize'],
+        quickInsertButtons: ["image", "table", "ul", "ol", "hr"], //快速插入项
+        toolbarVisibleWithoutSelection: true, //是否开启 不选中模式
+        // disableRightClick:true,//是否屏蔽右击
+        // colorsHEXInput:false,//关闭16进制色值
+        toolbarSticky: false, //操作栏是否自动吸顶
+        // zIndex:99999,
+        saveInterval: 0,
+        events: {
+          initialized: function () {
+            // this.editor = editor;
+            that.editor = this;
+            // that.editor.html.set(that.value);
+            // that.setHtml()
+          },
+          keyup: function (e, editor) {
+            //添加事件，在每次按键按下时，都记录一下最后停留位置
+            that.$nextTick(function () {
+              that.lastEditRange = getSelection().getRangeAt(0);
+            });
+          },
+          click: function (e, editor) {
+            //添加事件，在每次鼠标点击时，都记录一下最后停留位置
+            that.$nextTick(function () {
+              that.lastEditRange = getSelection().getRangeAt(0);
+            });
+          },
+        },
+        charCounterCount: false,
+        reportloadding: false,
+        lastsavetime: "",
+        isAddEnter: false, //是否已经添加过
+        timer: null,
+        ischange: false,
+        isPublishloading: false,
+      },
+      ruleForm: {
+        title: "", //标题
+        author: "", //作者
+        time: "", //时间
+        explain: "", //说明
+        alteration: "", //变更
+      },
+      rules: {
+        title: [{ required: true, message: "请输入标题", trigger: "blur" }],
+        author: [{ required: true, message: "请输入作者", trigger: "blur" }],
+        time: [{ required: true, message: "请输入时间", trigger: "change" }],
+        explain: [{ required: true, message: "请输入摘要", trigger: "blur" }],
+      },
+      //产业调研纪要篇
+      ListCydyjy: [],
+      SortCydyjy: "",
+      //上市公司调研纪要篇
+      ListSsgs: [],
+      SortSsgs: "",
+      //产业调研纪要篇 上市公司调研纪要篇 输入框是否高亮
+      isSortCydyjyShow: true,
+      isSortSsgsShow: true,
+    };
+  },
+  methods: {
+    //深度报告篇 产业调研纪要篇 本周晨会精华
+    addListSdbg(item, index, type) {
+      switch (type) {
+        case "深度报告篇":
+          this.ListSdbg[index].List.push({ Body: "", ReportLink: "" });
+          break;
+        case "产业调研纪要篇":
+          this.ListCydyjy[index].List.push({ Body: "", ReportLink: "" });
+          break;
+        case "上市公司调研纪要篇":
+          this.ListSsgs[index].List.push({ Body: "", ReportLink: "" });
+          break;
+        case "本周晨会精华":
+          this.ListBzchjh[index].List.push({ Body: "", ReportLink: "" });
+        // case "研选":
+        // this.ListYanx[index].List.push({ Body: "", ReportLink: "" });
+          break;
+      }
+    },
+    //深度报告篇 产业调研纪要篇 本周晨会精华
+    deleteListSdbg(item, num, index, type) {
+      switch (type) {
+        case "深度报告篇":
+          this.ListSdbg[index].List.splice(num, 1);
+          break;
+        case "产业调研纪要篇":
+          this.ListCydyjy[index].List.splice(num, 1);
+          break;
+        case "上市公司调研纪要篇":
+          this.ListSsgs[index].List.splice(num, 1);
+          break;
+        case "本周晨会精华":
+          this.ListBzchjh[index].List.splice(num, 1);
+          // case "研选":
+          // this.ListYanx[index].List.splice(num, 1);
+          break;
+      }
+    },
+    chidrenList(list) {
+      const flag = list.some((item) => {
+        if (item.List.length > 0 && !item.ChartPermissionSort) {
+          this.$set(item, "isShow", true);
+          return true;
+        }
+      });
+      return flag;
+    },
+    initGetList(list) {
+      list.forEach((item) => {
+        if (!item.List) {
+          item.List = [];
+        }
+      });
+    },
+  },
+};

src/views/rai_manage/components/selection/strictSelection.scss

@@ -0,0 +1,114 @@
+.el-date-editor.el-input,
+.el-select {
+  width: 100%;
+}
+.more-button {
+  width: 100%;
+  text-align: center;
+  margin: 60px 0 80px;
+  .el-button {
+    height: 40px;
+    padding: 0 30px;
+    margin-right: 20px;
+  }
+}
+.content-list {
+  margin-top: 60px;
+  .list-top {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    span {
+      font-size: 16px;
+      font-family: PingFang SC;
+      font-weight: bold;
+      color: #333333;
+      opacity: 1;
+    }
+    input {
+      width: 50px;
+      height: 22px;
+      box-sizing: border-box;
+      text-align: center;
+      background: #ffffff;
+      border: 1px solid #aab4cc;
+      opacity: 1;
+      border-radius: 11px;
+      margin: 0 4px 0 8px;
+    }
+    i {
+      z-index: 99;
+    }
+  }
+  .list-ul {
+    margin: 20px 0;
+    .list-title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 20px;
+      input {
+        width: 36px;
+        height: 18px;
+        box-sizing: border-box;
+        text-align: center;
+        background: #ffffff;
+        border: 1px solid #aab4cc;
+        opacity: 1;
+        border-radius: 11px;
+        font-size: 12px;
+      }
+      span {
+        padding: 0 10px 0 6px;
+      }
+      img {
+        width: 16px;
+        height: 16px;
+      }
+    }
+    .list-li {
+      p {
+        width: 160px;
+        height: 40px;
+        text-align: center;
+        line-height: 40px;
+        box-sizing: border-box;
+        background: #ecf5ff;
+        border-radius: 4px;
+        font-size: 14px;
+        color: #409eff;
+      }
+      .active {
+        background: #409eff;
+        box-shadow: 0px 3px 6px rgba(49, 78, 223, 0.16);
+        color: #ffffff;
+      }
+
+      .list-children {
+        width: 100%;
+        display: flex;
+        // align-items: center;
+        justify-content: space-between;
+        div {
+          width: 100%;
+        }
+        .box {
+          border-bottom: 1px dashed #aab4cc;
+          margin-bottom: 30px;
+          margin-top: 10px;
+        }
+        .el-input {
+          margin: 20px 0;
+        }
+        img {
+          margin-top: 150px;
+          margin-left: 12px;
+          width: 14px;
+          height: 14px;
+        }
+      }
+    }
+  }
+}
+.red {
+  border: 1px solid #f00 !important;
+}

src/views/rai_manage/components/shortcutDialog.vue

@@ -0,0 +1,195 @@
+<template>
+ <div class="container-shortcut">
+     <el-dialog
+      v-dialogDrag 
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      top="5vh"
+      :visible.sync="shortcutIsDialog"
+      customClass="custom-shortcut"
+      :before-close="confirmPerson"
+    >
+    <div slot="title" style="display: flex; align-items: center">
+        <img
+          :src="$icons.add"
+          style="color: #fff; width: 16px; height: 16px; margin-right: 5px"
+        />
+        <span style="font-size: 16px">快捷检索标签</span>
+      </div>
+     <div  class="inline"  v-for="(item, index) in dynamicItem"  :key="index" >
+        <div class="inline-content">
+        <span>{{index+1}}</span>
+          <el-input
+          class="inline-input"
+          v-model.trim="item.KeyWord"
+          placeholder="请输入标签名称"
+          clearable
+        ></el-input>
+         <img @click="deleteItem(index)" src="~@/assets/img/icons/delete-Item.png"  :class="index == 0 ? 'defaultyi' : ''" alt="">
+      </div>
+     </div>
+        <div class="add-box">
+          <img  @click="addItem" :src="$icons.addblue">
+          <span @click="addItem" >添加</span>
+        </div>
+       <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmSubmit">确定</el-button>
+        <el-button @click="confirmPerson">取消</el-button>
+      </span>
+    </el-dialog>
+ </div>
+</template>
+
+<script>
+import { raiInterface } from '@/api/api.js'
+export default {
+  name: '',
+  components: {},
+  props: {
+      shortcutIsDialog:{
+          type: Boolean,
+          default: false
+      }
+  },
+  data () {
+    return {
+        dynamicItem:[]
+    }
+  },
+  computed: {},
+  watch: {
+      shortcutIsDialog:{
+          handler(){
+              if(this.shortcutIsDialog) {
+                  this.fastSearchKeWord()
+              }
+          }
+      }
+  },
+  created () {},
+  mounted () {},
+  methods: {
+      fastSearchKeWord(){
+          raiInterface.fastSearchKeWordsummaryManage().then((res)=>{
+              if(res.Ret === 200) {
+              this.dynamicItem = res.Data.List?res.Data.List:[]
+              }
+          })
+      },
+      //弹框取消事件
+      confirmPerson(){
+          this.dynamicItem=[]
+          this.$emit('update:shortcutIsDialog',false);
+      },
+      //弹框确认事件
+      confirmSubmit(){
+        const arr = []
+        this.dynamicItem.forEach(item =>arr.push(item.KeyWord))
+        const keyWord = arr.join(',')
+        raiInterface.editFastSearchKeWordsummary({keyWord}).then((res)=>{
+            if(res.Ret === 200) {
+            this.dynamicItem=[]
+            this.$emit('update:shortcutIsDialog',false);
+            }
+        })
+        
+      },
+      //添加活动标签
+      addItem(){
+          if(this.dynamicItem.length == 20) return 
+          this.dynamicItem.push({KeyWord: ""})
+      },
+      //删除活动标签
+      deleteItem(index){
+          this.dynamicItem.splice(index,1)
+      },
+  }
+}
+</script>
+<style  lang="less">
+.container-shortcut {
+ .custom-shortcut {
+    width: 600px;  
+  }
+  .add-box {
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    color: #5882EF;
+    margin-top: 30px;
+    margin-bottom: 17px;
+    img {   
+    width: 16px;
+    height: 16px;
+    margin-right: 10px;
+    }
+  }
+    .inline {
+    margin-bottom: 20px;
+    width: 440px;
+    .inline-input {
+     width: 370px !important;
+    }
+  p{
+      padding-top: 5px;
+      font-size: 14px;
+      font-family: PingFang SC;
+      font-weight: 500;
+      line-height: 20px;
+      color: #EF5858;
+      opacity: 1;
+    }
+    .children-item {
+
+      .children-item {
+      margin-top: 20px;
+      padding-right:20px;
+      padding-left: 25px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      img { 
+        width: 14px;
+        height: 14px;
+      }
+      }
+      .children-box {
+        margin-top: 15px;
+        padding-left: 25px;
+        display: flex;
+        align-items: center;
+        color: #5882EF;
+        img { 
+          margin-right: 10px;
+        }
+      }
+    }
+  }
+  .inline-content {
+    padding-right:20px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    img { 
+      width: 14px;
+      height: 14px;
+    }
+  }
+   .el-input {
+    width: 360px !important;
+  }
+  .el-switch__label  {
+    color: #606266 ;
+   font-size: 14px;
+   font-weight:400;
+  }
+   .is-active {
+    color: #409EFF !important;
+  }
+  .el-radio__label {
+    font-weight:400;
+  }
+}
+
+</style>

src/views/rai_manage/components/special/optionsTabs.js

@@ -0,0 +1,107 @@
+export const inAdvanceOptions = [
+  { id: "0", name: "未发布" },
+  { id: "1", name: "已发布" },
+  { id: "3", name: "已下线" },
+  { id: "4", name: "已确定行程" },
+];
+
+export const ConfirmOptions = [
+  { id: "0", name: "未发布" },
+  { id: "1", name: "已发布" },
+];
+
+//表格列
+export const tableColums = (type) => {
+  return type === 1
+    ? [
+        {
+          label: "调研主题",
+          key: "ResearchTheme",
+          minwidthsty: "195",
+        },
+        {
+          label: "行业",
+          key: "ChartPermissionName",
+          widthsty: "95",
+        },
+        {
+          label: "活动负责人",
+          key: "AdminName",
+          widthsty: "98",
+        },
+        {
+          label: "预期活动时间",
+          key: "ActivityTimeText",
+          widthsty: "110",
+        },
+        {
+          label: "调研形式",
+          key: "SpecialType",
+          widthsty: "115",
+        },
+        {
+          label: "更新时间",
+          key: "LastUpdatedTime",
+          widthsty: "195",
+        },
+        {
+          label: "感兴趣人数",
+          key: "InterestedNum",
+          widthsty: "95",
+        },
+        {
+          label: "发布状态",
+          key: "PublishStatus",
+          widthsty: "115",
+        },
+      ]
+    : [
+        {
+          label: "调研主题",
+          key: "ResearchTheme",
+          minwidthsty: "195",
+        },
+        {
+          label: "行业",
+          key: "ChartPermissionName",
+          widthsty: "95",
+        },
+        {
+          label: "活动负责人",
+          key: "AdminName",
+          widthsty: "98",
+        },
+        {
+          label: "活动开始时间",
+          key: "ActivityTimeTextByDay",
+          widthsty: "250",
+        },
+        {
+          label: "调研形式",
+          key: "SpecialType",
+          widthsty: "115",
+        },
+        {
+          label: "更新时间",
+          key: "LastUpdatedTime",
+          widthsty: "195",
+        },
+        {
+          label: "报名人数",
+          key: "SignupPeopleNum",
+          widthsty: "95",
+        },
+        {
+          label: "发布状态",
+          key: "PublishStatus",
+          widthsty: "115",
+        },
+      ];
+};
+
+export const TabsTop = [
+  { id: 1, name: "预报名" },
+  { id: 2, name: "确定行程" },
+];
+
+

src/views/rai_manage/components/special/specialResearchDlg.vue

@@ -0,0 +1,171 @@
+<template>
+  <div class="container">
+    <el-dialog width="1000px" v-dialogDrag :modal-append-to-body="false" center :title="dialogTitle" :visible.sync="dialogVisibleActivity" :before-close="handleCloseSubject">
+      <div class="rai-detail-wrap" v-if="dialogTitle == '活动详情'">
+        <div class="activity-top">
+          {{ activityDetail.ResearchTheme }}
+        </div>
+        <p>所属行业： {{ activityDetail.ChartPermissionName }}</p>
+        <p v-if="tabsActive == 1">预期时间： {{ activityDetail.ActivityTimeText }}</p>
+        <p v-else>活动开始时间： {{ activityDetail.ActivityTimeTextByDay }}</p>
+        <p>调研形式： {{ activityDetail.SpecialType == 1 ? "线上" : "线下" }} {{ activityDetail.SpecialType == 2 && activityDetail.City ? "(" + activityDetail.City + ")" : "" }}</p>
+        <template v-if="!activityDetail.IndustrialName && !activityDetail.IndustrialSubjectName">
+          <p>相关主题： {{ activityDetail.Label }}</p>
+        </template>
+        <template v-else>
+          <p>产业名称： {{ activityDetail.IndustrialName }}</p>
+          <p>相关公司： {{ activityDetail.IndustrialSubjectName }}</p>
+        </template>
+        <div class="text-box">
+          <div style="flex-shrink: 0">活动可见：</div>
+          <div>
+            <span>{{ activityDetail.CustomerName }}</span>
+            <div v-if="activityDetail.Scale">
+              <span v-if="activityDetail.Scale.includes('3')"> 100亿以上</span>
+              <span v-if="activityDetail.Scale.includes('2')"> 150~100亿</span>
+            </div>
+          </div>
+        </div>
+        <p v-if="activityDetail.Host">主持人： {{ activityDetail.Host }}</p>
+        <p v-if="activityDetail.Host">主持人： {{ activityDetail.PersonInCharge }}</p>
+        <el-image v-if="tabsActive == 1" style="width: 0px; height: 0px" :src="activityDetail.TripImgLink" id="TripImgLink" :preview-src-list="previewList"></el-image>
+        <el-image v-else style="width: 0px; height: 0px" :src="activityDetail.TripImgLinkFix" id="TripImgLink" :preview-src-list="previewList"></el-image>
+        <div class="arrange" @click.stop="imgLink">
+          查看行程安排
+          <i class="el-icon-d-arrow-right"></i>
+        </div>
+      </div>
+      <div v-else>
+        <el-table :data="interestData" style="width: 100%; margin: 20px 0" height="400px" border>
+          <el-table-column min-width="" prop="RealName" align="center" label="姓名"></el-table-column>
+          <el-table-column min-width="" prop="CompanyName" align="center" label="公司名称"></el-table-column>
+          <el-table-column min-width="" prop="SellerName" align="center" label="所属销售"></el-table-column>
+          <el-table-column min-width="180" prop="CreateTime" align="center" label="反馈时间"></el-table-column>
+        </el-table>
+        <div class="dialog-footer">
+          <a :href="exportInterest" download>
+            <el-button type="primary" @click="confirmSubmit">下载名单</el-button>
+          </a>
+          <el-button style="margin-left: 20px" @click="handleCloseSubject">取消</el-button>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface, raiSpecial } from "@/api/api.js";
+
+export default {
+  name: "",
+  components: {},
+  props: {
+    dialogTitle: {
+      type: String,
+      required: true,
+      default: "",
+    },
+    dialogVisibleActivity: {
+      type: Boolean,
+      required: true,
+      default: false,
+    },
+    specialDetailId: {
+      type: Number,
+      required: true,
+      default: "",
+    },
+    tabsActive: {
+      type: Number,
+      required: true,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      interestData: [], //感兴趣人数
+      exportInterest: "",
+      previewList: [],
+      activityDetail: {},
+    };
+  },
+  computed: {},
+  watch: {
+    dialogTitle: {
+      handler(newValue) {
+        newValue == "活动详情" && this.themeDetails();
+        newValue == "感兴趣人数" && this.interestDetails();
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    // 预览图片
+    imgLink() {
+      $("#TripImgLink").click();
+    },
+    handleCloseSubject() {
+      this.$parent.dialogTitle = "";
+      this.$parent.exportInterest = "";
+      this.activityDetail = {};
+      this.previewList = [];
+      this.$emit("update:dialogVisibleActivity", false);
+    },
+    //感兴趣人数
+    async interestDetails() {
+      const res = await raiSpecial.specialInterested({ ActivityId: this.specialDetailId });
+      if (res.Ret === 200) {
+        this.exportInterest = `${process.env.API_ROOT}/cygx/special/export?${localStorage.getItem("auth") || ""}&ActivityId=${this.specialDetailId}`;
+        this.$nextTick(() => {
+          this.interestData = res.Data.List;
+        });
+      }
+    },
+    //获取调研主题详情
+    async themeDetails() {
+      const res = await raiSpecial.specialDetail({ ActivityId: this.specialDetailId });
+      if (res.Ret === 200) {
+        this.activityDetail = res.Data;
+        this.previewList.push(this.tabsActive == 1 ? this.activityDetail.TripImgLink : this.activityDetail.TripImgLinkFix);
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.rai-detail-wrap {
+  .activity-top {
+    width: 100%;
+    height: 55px;
+    background: #f4f4f4;
+    border-radius: 4px 4px 4px 4px;
+    opacity: 1;
+    line-height: 55px;
+    padding-left: 23px;
+    margin-bottom: 30px;
+  }
+  p {
+    margin-bottom: 20px;
+    padding-left: 10px;
+  }
+  .arrange {
+    margin: 50px auto 20px;
+    cursor: pointer;
+    text-align: center;
+    color: #3385ff;
+  }
+  .text-box {
+    display: flex;
+    padding-left: 10px;
+    span {
+      display: block;
+      margin-bottom: 10px;
+    }
+  }
+}
+.dialog-footer {
+  text-align: center;
+  margin-bottom: 20px;
+}
+</style>

src/views/rai_manage/cygxManage/adviceList.vue

@@ -0,0 +1,191 @@
+<template>
+	<div class="adviceList_container">
+		<div class="adviceList_top">
+			<el-input
+				placeholder="姓名/手机号"
+				v-model="search_txt"
+				clearable
+				style="maxWidth:500px">
+				<i slot="prefix" class="el-input__icon el-icon-search"></i>
+			</el-input>
+		</div>
+		<div class="adviceList_cont">
+			<el-table
+				ref="userTable"
+				:data="tableData"
+				v-loading="isShowloadding"
+				element-loading-text="数据加载中..."
+				border>
+					<el-table-column
+					prop="UserRealName"
+					label="姓名"
+					align="center">
+						<template slot-scope="scope"> <span>{{scope.row.UserRealName}}</span></template>
+					</el-table-column>
+					<el-table-column
+					prop="Mobile"
+					label="手机号"
+					align="center">
+						<template slot-scope="scope"> <span>{{scope.row.Mobile}}</span></template>
+					</el-table-column>
+					<el-table-column
+					prop="CompanyName"
+					label="客户名称"
+					align="center">
+						<template slot-scope="scope"> <span style="color:#409EFF;cursor:pointer;" @click="$router.push({
+						path:'/RaiDetail',
+						query:{
+							id:scope.row.CompanyId
+						}})">{{scope.row.CompanyName}}</span></template>
+					</el-table-column>
+					<el-table-column
+					prop="SalesRealName"
+					label="所属销售"
+					align="center">
+						<template slot-scope="scope"> <span>{{scope.row.SalesRealName}}</span> </template>
+					</el-table-column>
+					<el-table-column
+					prop="Advice"
+					label="优化建议"
+					align="center"
+					min-width="300px">
+						<template slot-scope="scope"> <span>{{scope.row.Advice}}</span> </template>
+					</el-table-column>
+					<el-table-column
+					prop="CreateTime"
+					label="创建时间"
+					min-width="130px"
+					align="center">
+						<template slot-scope="scope"> <span>{{scope.row.CreateTime}}</span> </template>
+					</el-table-column>
+					<el-table-column label="操作" align="center" min-width="110">
+						<template slot-scope="scope">
+							<span class="editsty" v-if="scope.row.AdviceImgUrl" @click="previewImg(scope.row)">查看图片</span>
+						</template>
+					</el-table-column>
+					<div slot="empty" style="lineHeight:44px;margin:60px 0;color:#999;">
+						<img src="~@/assets/img/cus_m/nodata.png" alt="" style="display:block;width:160px;height:128px;margin: auto;">
+						<span>暂无数据</span>
+					</div>
+			</el-table>
+			<el-col :span="24" class="toolbar">
+				<m-page 
+				:total="total"
+				:page_no="page_no"
+				@handleCurrentChange="handleCurrentChange"/>
+			</el-col>
+		</div>
+		<!-- 图片预览 -->
+		<el-image-viewer 
+		v-if="showViewer" 
+		:on-close="closeViewer" 
+		:url-list="reviewList" />
+	</div>
+</template>
+
+<script>
+import { raiInterface } from '@/api/api.js'
+import mPage from '@/components/mPage.vue'
+import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
+export default {
+	name:'',
+	components: {mPage,ElImageViewer},
+	watch:{
+		search_txt(newval) {
+			this.page_no = 1;
+			this.getTableData();
+		}
+	},
+	data () {
+		return {
+			tableData:[],
+			total:0,
+			page_no:sessionStorage.getItem('adviceListBack')?JSON.parse(sessionStorage.getItem('adviceListBack')).page_no:1,
+			pageSize:10,
+			search_txt:'',
+			showViewer:false,
+			reviewList:[]
+		};
+	},
+	/* 页面跳转前记录参数 */
+	beforeRouteLeave(to, form, next) {
+		let backData = {
+			page_no:this.page_no,
+			keyword:this.search_txt
+		}
+		sessionStorage.setItem('adviceListBack',JSON.stringify(backData))
+		next()
+	},
+	/* 页面进入前是否清除参数 */
+	beforeRouteEnter(to,from,next) {
+		if(from.path!='/customDetail') {
+			sessionStorage.removeItem('adviceListBack')
+		}
+		next()
+	},
+	methods: {
+		/* 获取表格数据 */
+		getTableData() {
+			raiInterface.adviceList({
+				PageSize:this.pageSize,
+				CurrentIndex:this.page_no,
+				KeyWord:this.search_txt
+			}).then(res => {
+				if(res.Ret === 200) {
+					this.tableData = res.Data.List || [];
+					this.total = res.Data.Paging.Totals;
+				}
+			})
+		},
+		/* 页码改变 */
+		handleCurrentChange(page) {
+			this.page_no = page;
+			this.getTableData();
+		},
+		/* 预览名片 */
+		previewImg(item) {
+			this.showViewer = true;
+			this.reviewList = item.AdviceImgUrl.split('#');
+		},
+		/* 关闭预览 */
+		closeViewer() {
+			this.reviewList = [];
+			this.showViewer = false;
+		},
+	},
+	created() {
+	},
+	mounted() {
+		if(sessionStorage.getItem('adviceListBack')) {
+			let backData = JSON.parse(sessionStorage.getItem('adviceListBack'));
+			this.search_txt = backData.keyword;
+			this.page_no = backData.page_no;
+		}
+		this.getTableData();
+	},
+}
+</script>
+<style lang='scss' scoped>
+.adviceList_container {
+	.adviceList_top {
+		display: flex;
+		justify-content:flex-end;
+		align-items: center;
+		border: 1px solid #ECECEC;
+		padding: 20px 30px;
+		background: #fff;
+		border-radius: 4px;
+		box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+	}
+	.adviceList_cont {
+		min-height: calc(100vh - 320px);
+		padding: 20px 30px 80px;
+		background: #fff;
+		margin-top: 20px;
+		position: relative;
+		border: 1px solid #ECECEC;
+		border-radius: 4px;
+		box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+	}
+}
+</style>

src/views/rai_manage/cygxManage/applyUserList.vue

@@ -0,0 +1,236 @@
+<template>
+  <div class="applyUserList_container">
+    <div class="applyUserList_top">
+      <el-select v-model="custom_type" placeholder="请选择状态" style="width: 200px; margin-right: 16px" clearable>
+        <el-option v-for="item in statusArr" :key="item.name" :label="item.name" :value="item.value"> </el-option>
+      </el-select>
+      <el-input placeholder="姓名/手机号/邮箱" v-model="search_txt" clearable style="max-width: 500px">
+        <i slot="prefix" class="el-input__icon el-icon-search"></i>
+      </el-input>
+    </div>
+    <div class="applyUserList_cont">
+      <el-table ref="userTable" :data="tableData" v-loading="isShowloadding" element-loading-text="数据加载中..." border>
+        <el-table-column prop="RealName" label="姓名" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.RealName }}</span></template
+          >
+        </el-table-column>
+        <el-table-column prop="Mobile" label="手机号" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.Mobile }}</span></template
+          >
+        </el-table-column>
+        <el-table-column prop="Email" label="邮箱" align="center" min-width="120px">
+          <template slot-scope="scope">
+            <span>{{ scope.row.Email }}</span></template
+          >
+        </el-table-column>
+        <el-table-column prop="CompanyName" label="客户名称" align="center">
+          <template slot-scope="scope">
+            <span
+              style="color: #409eff; cursor: pointer"
+              v-if="scope.row.CompanyIdPay !== 1"
+              @click="
+                $router.push({
+                  path: '/RaiDetail',
+                  query: {
+                    id: scope.row.CompanyIdPay,
+                  },
+                })
+              "
+              >{{ scope.row.CompanyName }}</span
+            >
+            <span v-else>{{ scope.row.CompanyName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="SellerName" label="所属销售" align="center" width="125">
+          <template slot-scope="scope">
+            <span>{{ scope.row.SellerName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="CreateTime" label="申请时间" width="160" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.CreateTime }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="CompanyIdTypeName" label="用户状态" min-width="130" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.CompanyIdTypeName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="ApplicationSource" label="申请来源" width="115" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.ApplicationSource }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Title" label="申请内容" min-width="130" align="center">
+          <template slot-scope="scope">
+            <span class="editsty" @click="applicationContent(scope.row)">{{ scope.row.Title }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" min-width="110">
+          <template slot-scope="scope">
+            <span class="editsty" v-if="scope.row.BusinessCardUrl" @click="previewImg(scope.row)">查看名片</span>
+            <span class="editsty" v-if="scope.row.Status === 0" @click="dealHandle(scope.row)">标记处理</span>
+          </template>
+        </el-table-column>
+        <div slot="empty" style="line-height: 44px; margin: 60px 0; color: #999">
+          <img src="~@/assets/img/cus_m/nodata.png" alt="" style="display: block; width: 160px; height: 128px; margin: auto" />
+          <span>暂无数据</span>
+        </div>
+      </el-table>
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </div>
+    <!-- 图片预览 -->
+    <el-image-viewer v-if="showViewer" :on-close="closeViewer" :url-list="reviewList" />
+    <!-- 弹窗 -->
+    <intervewDia :title="'deal'" :isShowDia="isShowDia" @cancel="isShowDia = false" @saveOver="dealApplyHandle" />
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import mPage from "@/components/mPage.vue";
+import ElImageViewer from "element-ui/packages/image/src/image-viewer";
+import intervewDia from "../components/interviewDia.vue";
+export default {
+  name: "",
+  components: { mPage, ElImageViewer, intervewDia },
+  watch: {
+    search_txt(newval) {
+      this.page_no = 1;
+      this.getTableData();
+    },
+    custom_type(newval) {
+      this.page_no = 1;
+      this.getTableData();
+    },
+  },
+  data() {
+    return {
+      custom_type: "",
+      statusArr: [
+        { name: "潜在用户", value: 1 },
+        { name: "ficc", value: 3 },
+        { name: "现有用户", value: 2 },
+      ],
+      tableData: [],
+      total: 0,
+      page_no: sessionStorage.getItem("applyUserListBack") ? JSON.parse(sessionStorage.getItem("applyUserListBack")).page_no : 1,
+      pageSize: 10,
+      search_txt: "",
+      showViewer: false,
+      reviewList: [],
+      isShowDia: false, //处理弹窗
+      dealObj: {},
+    };
+  },
+  /* 页面跳转前记录参数 */
+  beforeRouteLeave(to, form, next) {
+    let backData = {
+      page_no: this.page_no,
+      keyword: this.search_txt,
+    };
+    sessionStorage.setItem("applyUserListBack", JSON.stringify(backData));
+    next();
+  },
+  /* 页面进入前是否清除参数 */
+  beforeRouteEnter(to, from, next) {
+    if (from.path != "/customDetail") {
+      sessionStorage.removeItem("applyUserListBack");
+    }
+    next();
+  },
+  methods: {
+    /* 获取表格数据 */
+    getTableData() {
+      raiInterface
+        .applyList({
+          PageSize: this.pageSize,
+          CurrentIndex: this.page_no,
+          KeyWord: this.search_txt,
+          CustomType: this.custom_type,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.tableData = res.Data.List || [];
+            this.total = res.Data.Paging.Totals;
+          }
+        });
+    },
+    /* 页码改变 */
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getTableData();
+    },
+    /* 预览名片 */
+    previewImg(item) {
+      this.showViewer = true;
+      this.reviewList = item.BusinessCardUrl.split("#");
+    },
+    /* 关闭预览 */
+    closeViewer() {
+      this.reviewList = [];
+      this.showViewer = false;
+    },
+    dealHandle(item) {
+      this.dealObj = item;
+      this.isShowDia = true;
+    },
+    /* 处理申请 */
+    dealApplyHandle() {
+      raiInterface
+        .delApply({
+          ApplyRecordId: this.dealObj.ApplyRecordId,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.$message.success(res.Msg);
+            this.dealObj.Status = 1;
+            this.isShowDia = false;
+          }
+        });
+    },
+    // 申请内容
+    applicationContent(item) {
+      window.open(item.HttpUrl, "_blank");
+      console.log(item);
+    },
+  },
+  created() {},
+  mounted() {
+    if (sessionStorage.getItem("applyUserListBack")) {
+      let backData = JSON.parse(sessionStorage.getItem("applyUserListBack"));
+      this.search_txt = backData.keyword;
+      this.page_no = backData.page_no;
+    }
+    this.getTableData();
+  },
+};
+</script>
+<style lang="scss" scoped>
+.applyUserList_container {
+  .applyUserList_top {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    border: 1px solid #ececec;
+    padding: 20px 30px;
+    background: #fff;
+    border-radius: 4px;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+  }
+  .applyUserList_cont {
+    min-height: calc(100vh - 320px);
+    padding: 20px 30px 80px;
+    background: #fff;
+    margin-top: 20px;
+    position: relative;
+    border: 1px solid #ececec;
+    border-radius: 4px;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+  }
+}
+</style>

src/views/rai_manage/cygxManage/bannerCommon/addBannerDlg.vue

@@ -0,0 +1,238 @@
+<template>
+  <div class="add-banner-visible">
+    <el-dialog
+      :title="bannerVisibleText"
+      :visible.sync="addBannerVisible"
+      width="600px"
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      @close="handleClose"
+    >
+      <el-form :model="addBannerForm" :rules="rules" ref="form" label-width="100px">
+        <el-form-item label="添加类型:" prop="type">
+          <el-select :disabled="bannerVisibleText == '编辑'" v-model="addBannerForm.type" placeholder="请选择报告类型">
+            <el-option v-for="item in addTypes" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="主标题:" prop="mainTitle">
+          <el-input type="textarea" :rows="3" placeholder="请输入标题内容" v-model="addBannerForm.mainTitle"> </el-input>
+        </el-form-item>
+        <el-form-item label="副标题:">
+          <el-input type="textarea" :rows="3" placeholder="请输入标题内容" v-model="addBannerForm.twoTitle"> </el-input>
+        </el-form-item>
+        <el-form-item :label="`${labelName.name}:`" prop="link">
+          <div style="display: flex; align-items: end">
+            <el-input
+              :disabled="bannerVisibleText == '编辑'"
+              type="textarea"
+              :rows="3"
+              :placeholder="labelName.placeholder"
+              v-model="addBannerForm.link"
+            >
+            </el-input>
+            <el-button v-if="addBannerForm.type === 2" type="primary" style="margin-left: 20px" @click="addHaveReportRouter">新建报告</el-button>
+          </div>
+        </el-form-item>
+        <el-form-item label="背景图:" prop="imgUrl">
+          <el-image
+            style="width: 120px; height: 120px"
+            :src="require('@/assets/img/icons/add-img.png')"
+            v-if="!addBannerForm.imgUrl"
+            @click="handleshowChooseImgPop"
+          />
+          <div v-else style="display: flex; align-items: end">
+            <div class="pre-img-box">
+              <el-image style="width: 226px; height: 120px" :src="addBannerForm.imgUrl"> </el-image>
+              <span class="del" @click="addBannerForm.imgUrl = ''">删除</span>
+            </div>
+            <div class="preview-button" @click="handlePreviewImg">预览</div>
+          </div>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="addBannerHandler">发 布</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { AddTypes } from "./bannerData";
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  props: {
+    addBannerVisible: {
+      type: Boolean,
+      default: false,
+    },
+    editBannerList: {
+      type: Object,
+    },
+    bannerVisibleText: {
+      type: String,
+      required: true,
+      default: "",
+    },
+  },
+  watch: {
+    bannerVisibleText: {
+      handler(val) {
+        val === "编辑" && this.getDetail();
+      },
+    },
+  },
+  data() {
+    return {
+      addBannerForm: {
+        type: 1,
+        mainTitle: "",
+        twoTitle: "",
+        link: "",
+        imgUrl: "",
+        imgId: "",
+      },
+      rules: {
+        type: [{ required: true, message: "请选择报告类型", trigger: "change" }],
+        mainTitle: [{ required: true, message: "请输入标题内容", trigger: "blur" }],
+        link: [{ required: true, message: "请输入链接", trigger: "blur" }],
+        imgUrl: [{ required: true, message: "请选择背景图", trigger: "change" }],
+      },
+      selectImgVisible: false,
+    };
+  },
+  computed: {
+    addTypes() {
+      return AddTypes;
+    },
+    labelName() {
+      let type = this.addBannerForm.type;
+      let obj = {
+        name: type == 1 || type == 2 ? "报告链接" : type == 3 ? "视频" : type == 4 ? "音频" : "活动链接",
+        placeholder:
+          type == 1 || type == 2
+            ? "请输入报告链接（网页版详情页地址）"
+            : type == 3 || type == 4
+            ? "请输入网页版详情页地址"
+            : "请输入活动链接（网页版详情页地址）",
+      };
+      return obj;
+    },
+  },
+  methods: {
+    // 获取详情数据
+    async getDetail() {
+      const res = await raiInterface.getBannerDetail({
+        BannerId: this.editBannerList.BannerId,
+      });
+      if (res.Ret === 200) {
+        let { BannerType, ImgId, IndexImg, Link, Title, Subtitle } = res.Data.Detail;
+        this.addBannerForm = {
+          type: BannerType,
+          mainTitle: Title,
+          twoTitle: Subtitle,
+          link: Link,
+          imgUrl: IndexImg,
+          imgId: ImgId,
+        };
+      }
+    },
+    // 添加图片
+    handleshowChooseImgPop() {
+      this.$emit("showImgPop");
+    },
+    // 弹框关闭事件
+    handleClose() {
+      this.$refs["form"].resetFields();
+      this.addBannerForm = {
+        type: 1,
+        mainTitle: "",
+        twoTitle: "",
+        link: "",
+        imgUrl: "",
+        imgId: "",
+      };
+      this.$emit("update:addBannerVisible", false);
+      this.$emit("update:bannerVisibleText", "");
+    },
+    // banner弹框的确认事件
+    addBannerHandler() {
+      this.$refs["form"].validate(async (valid) => {
+        if (valid) {
+          let params = {
+            BannerId: this.bannerVisibleText === "编辑" ? this.editBannerList.BannerId : 0,
+            BannerType: this.addBannerForm.type,
+            Title: this.addBannerForm.mainTitle,
+            Subtitle: this.addBannerForm.twoTitle,
+            Link: this.addBannerForm.link,
+            IndexImg: this.addBannerForm.imgUrl,
+            ImgId: this.addBannerForm.imgId,
+            ListType: this.editBannerList.ListType || this.editBannerList.name,
+          };
+          const res = await raiInterface.bannerPreserveAndPublish(params);
+          if (res.Ret === 200) {
+            this.$message.success("发布成功");
+            this.$emit("preserveAndPublish", params);
+            this.handleClose();
+          }
+        }
+      });
+    },
+    // 预览图片
+    handlePreviewImg() {
+      let obj = {
+        mainTitle: this.addBannerForm.mainTitle,
+        twoTitle: this.addBannerForm.twoTitle,
+      };
+      this.$emit("previewImg", this.addBannerForm.imgId, obj);
+    },
+    // 跳转产品内测页面
+    addHaveReportRouter() {
+      let { href } = this.$router.resolve({ path: "addHaveReport" });
+      window.open(href, "_blank");
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.add-banner-visible {
+  .pre-img-box {
+    position: relative;
+    width: 226px;
+    height: 120px;
+    .del {
+      display: none;
+      color: #fff;
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      text-align: center;
+      line-height: 24px;
+      background-color: rgba($color: #000000, $alpha: 0.8);
+      cursor: pointer;
+    }
+    &:hover {
+      .del {
+        display: block;
+      }
+    }
+  }
+  .preview-button {
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+    width: 120px;
+    height: 40px;
+    background: #409eff;
+    border-radius: 4px;
+    margin-left: 20px;
+    color: #fff;
+    cursor: pointer;
+  }
+}
+</style>

src/views/rai_manage/cygxManage/bannerCommon/bannerData.js

@@ -0,0 +1,20 @@
+export const AddTypes = [
+  { name: "现有报告", id: 1 },
+  { name: "自拟报告", id: 2 },
+  { name: "视频", id: 3 },
+  { name: "音频", id: 4 },
+  { name: "活动", id: 5 },
+];
+
+export const BannerTableColumn = [
+  {
+    label: "主标题",
+    key: "Title",
+  },
+  {
+    label: "状态",
+    key: "Status",
+    widthsty:80
+  },
+];
+

src/views/rai_manage/cygxManage/bannerCommon/detailsDlg.vue

@@ -0,0 +1,119 @@
+<template>
+  <div class="">
+    <!-- banner 详情的弹框 -->
+    <el-dialog
+      title="banner详情"
+      :visible.sync="detailsDlgVisible"
+      width="80%"
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      @close="handleClose"
+    >
+      <el-table style="margin-bottom: 30px" :data="tableList" border>
+        <el-table-column align="center" prop="Sort" label="序号" width="80"></el-table-column>
+        <el-table-column align="center" prop="BannerTypeName" label="类型" width="80"></el-table-column>
+        <el-table-column prop="Title" label="主标题" min-width="200">
+          <template #header>
+            <div style="text-align: center">主标题</div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Subtitle" label="副标题" min-width="100">
+          <template #header>
+            <div style="text-align: center">副标题</div>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="img" label="背景图" width="190">
+          <template slot-scope="{ row }">
+            <el-image @click="previewImg(row)" style="width: 160px; height: 60px" :src="row.IndexImg"> </el-image>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="状态" width="100">
+          <template slot-scope="{ row }">
+            {{ row.Status === 1 ? "已发布" : "已下线" }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="ModifyTime" label="更新时间" width="180"></el-table-column>
+        <el-table-column align="center" prop="pv" label="pv/uv" width="100">
+          <template slot-scope="{ row }">
+            <div class="pv-uv-download">
+              <span>{{ row.Pv }}/{{ row.Uv }}</span>
+              <a :href="exportPvUv(row.BannerId)" download>
+                <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+              </a>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  props: {
+    tableDetailList: {
+      type: Array,
+      default: [],
+    },
+    detailsDlgVisible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  watch: {
+    detailsDlgVisible: {
+      handler(val) {
+        val && this.getDetailData();
+      },
+    },
+  },
+  data() {
+    return { tableList: [] };
+  },
+  methods: {
+    // 获取详情数据
+    async getDetailData() {
+      const res = await raiInterface.getBannerDetail({
+        BannerId: this.tableDetailList.BannerId,
+      });
+      if (res.Ret === 200) {
+        this.$nextTick(() => {
+          this.tableList = [res.Data.Detail];
+        });
+      }
+    },
+    // 关闭弹框
+    handleClose() {
+      this.$emit("update:detailsDlgVisible", false);
+    },
+    previewImg(item) {
+      let obj = {
+        mainTitle: item.Title,
+        twoTitle: item.Subtitle,
+      };
+      this.$emit("previewImg", item.ImgId, obj);
+    },
+    // 下载pv/uv 地址
+    exportPvUv(id) {
+      const url = process.env.API_ROOT + "/cygx/banner/PvExport?BannerId=" + id + "&" + localStorage.getItem("auth") || "";
+      return url;
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.pv-uv-download {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  img {
+    width: 14px;
+    height: 14px;
+    margin-left: 10px;
+  }
+}
+</style>

src/views/rai_manage/cygxManage/bannerCommon/previewBanner.vue

@@ -0,0 +1,230 @@
+<template>
+  <div class="viewer__mask_banner_manage">
+    <div class="content">
+      <i class="el-icon-circle-close" style="color: #fff; font-size: 40px" @click="previewImgShowHanlder"></i>
+      <div class="applet-preview">
+        <h6>小程序预览图</h6>
+        <div class="applet-img" :style="`background-image:url(${previewList.IndexImg})`">
+          <div class="text">
+            <p :style="{ 'font-size': renderMainTitleApplet() }">{{ previewList.mainTitle }}</p>
+            <p>{{ previewList.twoTitle }}</p>
+            <img class="preview_bg" src="~@/assets/img/rai_m/preview_bg.png" alt="" />
+          </div>
+        </div>
+      </div>
+
+      <div class="pc-preview">
+        <h6>网页版预览图</h6>
+        <!-- T1 预览图 -->
+        <div class="pc-item one-item" :style="`background-image:url(${previewList.Img1})`">
+          <p :style="{ 'font-size': renderMainTitle(35) }">{{ previewList.mainTitle }}</p>
+          <p>{{ previewList.twoTitle }}</p>
+        </div>
+        <!-- T2 预览图 -->
+        <div class="box-img-text tow-item">
+          <div class="pc-item" :style="`background-image:url(${previewList.Img2})`">
+            <p :style="{ 'font-size': renderMainTitle(26) }">{{ previewList.mainTitle }}</p>
+            <p>{{ previewList.twoTitle }}</p>
+          </div>
+          <div class="pc-item" :style="`background-image:url(${previewList.Img3})`">
+            <p :style="{ 'font-size': renderMainTitle(18) }">{{ previewList.mainTitle }}</p>
+            <p>{{ previewList.twoTitle }}</p>
+          </div>
+        </div>
+        <!-- T3 预览图 -->
+        <div class="box-img-text three-item">
+          <div class="pc-item" :style="`background-image:url(${previewList.Img2})`">
+            <p :style="{ 'font-size': renderMainTitle(26) }">{{ previewList.mainTitle }}</p>
+            <p>{{ previewList.twoTitle }}</p>
+          </div>
+          <div class="pc-item" :style="`background-image:url(${previewList.Img4})`">
+            <p :style="{ 'font-size': renderMainTitle(0) }">{{ previewList.mainTitle }}</p>
+            <p>{{ previewList.twoTitle }}</p>
+          </div>
+          <div class="pc-item" :style="`background-image:url(${previewList.Img4})`">
+            <p :style="{ 'font-size': renderMainTitle(0) }">{{ previewList.mainTitle }}</p>
+            <p>{{ previewList.twoTitle }}</p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "",
+  components: {},
+  props: {
+    previewList: {
+      type: Object,
+    },
+  },
+  data() {
+    return {};
+  },
+  computed: {},
+  created() {},
+  mounted() {},
+  methods: {
+    // 关闭预览
+    previewImgShowHanlder() {
+      this.$parent.isShowPreview = false;
+    },
+
+    // 渲染主标题
+    renderMainTitle(num) {
+      let size = this.previewList.mainTitle.length < num ? 32 : 24;
+      return size + "px";
+    },
+
+    // 渲染标题
+    renderMainTitleApplet() {
+      let size =
+        this.previewList.twoTitle.length && this.previewList.mainTitle.length > 15
+          ? 18
+          : this.previewList.twoTitle.length && this.previewList.mainTitle.length < 15
+          ? 20
+          : this.previewList.twoTitle.length
+          ? 22
+          : 24;
+      return size + "px";
+    },
+  },
+};
+</script>
+<style lang="scss">
+.viewer__mask_banner_manage {
+  position: fixed;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, .9);
+  z-index: 9999999;
+  .content {
+    position: relative;
+    width: 1745px;
+    margin: 0 auto;
+    .el-icon-circle-close {
+      position: absolute;
+      right: 60px;
+      top: 60px;
+      cursor: pointer;
+    }
+    h6 {
+      font-size: 32px;
+      color: #fff;
+      text-align: center;
+      margin-bottom: 5px;
+    }
+    .applet-preview {
+      width: 375px;
+      height: 320px;
+      margin: 10px auto 80px;
+      .applet-img {
+        position: relative;
+        width: 375px;
+        height: 210px;
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+        display: flex;
+        flex-direction: column;
+        justify-content: flex-end;
+        .text {
+          width: 341px;
+          height: 95px;
+          margin: 0 auto;
+          color: #fff;
+          p {
+            text-overflow: -o-ellipsis-lastline;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            display: -webkit-box;
+            -webkit-line-clamp: 2;
+            line-clamp: 2;
+            -webkit-box-orient: vertical;
+            font-size: 14px;
+          }
+          p:nth-child(1) {
+            font-weight: 500;
+            margin-bottom: 5px;
+          }
+        }
+        .preview_bg {
+          position: absolute;
+          width: 375px;
+          top: 10px;
+          left: 0;
+        }
+      }
+    }
+    .pc-preview {
+      div {
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+        height: 100px;
+        margin-bottom: 20px;
+      }
+      .box-img-text {
+        display: flex;
+        align-items: center;
+      }
+      .pc-item {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        color: #fff;
+        height: 117px;
+        p {
+          width: 100%;
+          font-size: 20px;
+          margin: 0 auto;
+        }
+      }
+      .one-item {
+        width: 1745px;
+        margin-bottom: 35px;
+        p {
+          width: 1180px;
+        }
+      }
+      .tow-item {
+        height: 117px;
+        div:first-child {
+          width: 1043px;
+          margin-right: 20px;
+          p {
+            width: 836px;
+          }
+        }
+        div:last-child {
+          width: 682px;
+          p {
+            width: 546px;
+          }
+        }
+      }
+      .three-item {
+        height: 117px;
+        div {
+          width: 331px;
+          p {
+            width: 264px;
+          }
+        }
+        div:first-child {
+          width: 1043px;
+          margin-right: 20px;
+          p {
+            width: 836px;
+          }
+        }
+        div:nth-child(2) {
+          margin-right: 20px;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/rai_manage/cygxManage/bannerManage.vue

@@ -0,0 +1,484 @@
+<template>
+  <div class="container bannar-container">
+    <div class="container-top" style="margin-bottom: 20px">
+      <el-select v-model="statusValue" clearable placeholder="请选择状态" @change="handleChange">
+        <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
+      </el-select>
+    </div>
+    <div class="content-box">
+      <div class="content-table" :style="{ margin: item.name == 'B' ? '0 35px' : '' }" v-for="(item, index) in dataList" :key="item.name">
+        <el-table :data="item.tableList" border :ref="'table' + index" :style="isDrag && { cursor: 'move' }">
+          <el-table-column
+            v-for="column_list in bannerTableColumn"
+            :key="column_list.key"
+            :label="column_list.label"
+            :prop="column_list.key"
+            :width="column_list.widthsty"
+            :align="column_list.key === 'Title' ? '' : 'center'"
+          >
+            <template #header>
+              <div style="text-align: center">{{ column_list.label }}</div>
+            </template>
+            <template slot-scope="{ row }">
+              <span @click="handleRowClick(row, column_list.key)" :style="handleRowStyle(column_list.key, row)">
+                {{ handleRowContent(row, column_list.key) }}
+              </span>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" label="操作" width="125">
+            <template slot-scope="{ row }">
+              <span v-if="row.Status === 1" class="editsty" @click="handleRowButton(item, row)">下线 &nbsp;&nbsp;</span>
+              <span class="editsty" @click="addHandlerBanner('编辑', row)"> 编辑</span>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-col :span="24" class="toolbar">
+          <m-page :total="item.total" :page_no="item.page_no" :pageSize="item.pageSize" @handleCurrentChange="handleCurrentChange(item, $event)" />
+        </el-col>
+        <span class="add-btn" @click="addHandlerBanner('添加', item)">添加banner</span>
+      </div>
+    </div>
+    <!-- 选择图片的弹框 -->
+    <el-dialog title="选择图片" :visible.sync="selectImgVisible" width="80%" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center>
+      <div class="seleect-img-box">
+        <div class="content-img" @click="clickSelectImg(item)" v-for="item in banerImgList" :key="item.ImgId">
+          <img :src="item.IndexImg" alt="" class="item-img" />
+        </div>
+      </div>
+      <el-col :span="24" class="toolbar">
+        <m-page :total="totalImg" :page_no="page_no_img" :pageSize="10" @handleCurrentChange="handleCurrentChangeSelectImg" />
+      </el-col>
+    </el-dialog>
+    <!-- 预览图片 -->
+    <preview-banner v-if="isShowPreview" :previewList="previewList" />
+    <!-- 添加或者编辑banner -->
+    <add-banner-dlg
+      ref="addBannerRef"
+      :addBannerVisible.sync="addBannerVisible"
+      :bannerVisibleText.sync="bannerVisibleText"
+      :editBannerList="editBannerList"
+      @showImgPop="handleshowChooseImgPop"
+      @previewImg="handlePreviewImg"
+      @preserveAndPublish="preserveAndPublish"
+    />
+    <!-- 详情的弹框 -->
+    <details-dlg :detailsDlgVisible.sync="detailsDlgVisible" :tableDetailList="tableDetailList" @previewImg="handlePreviewImg" />
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+import { BannerTableColumn } from "./bannerCommon/bannerData";
+import AddBannerDlg from "./bannerCommon/addBannerDlg.vue";
+import PreviewBanner from "./bannerCommon/previewBanner.vue";
+import DetailsDlg from "./bannerCommon/detailsDlg.vue";
+import Sortable from "sortablejs";
+export default {
+  name: "",
+  computed: {
+    bannerTableColumn() {
+      return BannerTableColumn;
+    },
+    isDrag() {
+      return this.statusValue == "1" ? true : false;
+    },
+  },
+  components: {
+    mPage,
+    AddBannerDlg,
+    PreviewBanner,
+    DetailsDlg,
+    Sortable,
+  },
+  data() {
+    return {
+      dataList: [
+        { name: "A", tableList: [], total: 0, page_no: 1, pageSize: 10 },
+        { name: "B", tableList: [], total: 0, page_no: 1, pageSize: 10 },
+        { name: "C", tableList: [], total: 0, page_no: 1, pageSize: 10 },
+      ],
+      statusValue: "1",
+      statusOptions: [
+        {
+          label: "已发布",
+          value: "1",
+        },
+        {
+          label: "已下线",
+          value: "0",
+        },
+      ], // 状态的筛选条件
+      tableList: [], // 列表的数据
+      selectImgVisible: false, //选择图片的弹框
+      banerImgList: [], //选择图片的数据
+      banerImgListArr: [], //选择图片的数据
+      totalImg: 0,
+      page_no_img: 1,
+      addBannerVisible: false, // 添加编辑banner的弹框
+      isShowPreview: false, // 预览的弹框
+      previewList: {}, // 预览的数据
+      detailsDlgVisible: false, //详情的弹框
+      tableDetailList: {}, //详情的数据
+      bannerVisibleText: "",
+      editBannerList: {},
+    };
+  },
+  mounted() {
+    const tables = this.$refs;
+    Object.keys(tables).forEach((key) => {
+      if (key.includes("table")) {
+        const table = tables[key][0];
+        const tbody = table.$el.querySelector("tbody");
+        const index = parseInt(key.slice(5));
+        this.setupSortable(tbody, index);
+        tbody.setAttribute("data-index", index);
+      }
+    });
+    this.getDataList();
+    this.getSelectImgListAll();
+  },
+  methods: {
+    // 获取列表数据
+    async getDataList() {
+      this.dataList.forEach(async (item, index) => {
+        const res = await raiInterface.getBannerList({
+          PageSize: item.pageSize,
+          CurrentIndex: item.page_no,
+          ListType: item.name,
+          Status: this.statusValue,
+        });
+        if (res.Ret === 200) {
+          item.tableList = res.Data.List;
+          item.total = res.Data.Paging.Totals;
+        }
+      });
+    },
+    // 获取一个的单独数据 不想写if了
+    async getOneDataList(item) {
+      const res = await raiInterface.getBannerList({
+        PageSize: item.pageSize,
+        CurrentIndex: item.page_no,
+        ListType: item.name,
+        Status: this.statusValue,
+      });
+      if (res.Ret === 200) {
+        item.tableList = res.Data.List;
+        item.total = res.Data.Paging.Totals;
+      }
+    },
+    // 获取弹框图片的数据
+    async getSelectImgList() {
+      const res = await raiInterface.getBannerImgList({
+        CurrentIndex: this.page_no_img,
+        PageSize: 10,
+      });
+      if (res.Ret === 200) {
+        this.banerImgList = res.Data.List;
+        this.totalImg = res.Data.Paging.Totals;
+      }
+    },
+    // 获取弹框图片的数据
+    async getSelectImgListAll() {
+      const res = await raiInterface.getBannerImgList({
+        CurrentIndex: 1,
+        PageSize: 100000,
+      });
+      if (res.Ret === 200) {
+        this.banerImgListArr = res.Data.List;
+        this.totalImg = res.Data.Paging.Totals;
+        this.banerImgList = _.cloneDeep(this.banerImgListArr).splice(0, 10);
+      }
+    },
+
+    // 添加banner
+    async addHandlerBanner(type, item) {
+      this.bannerVisibleText = type;
+      this.addBannerVisible = true;
+      this.editBannerList = item;
+    },
+    // banner弹框的确认事件
+    addBannerHandler() {
+      this.$refs["form"].validate((valid) => {
+        if (valid) {
+        }
+      });
+    },
+    // banner弹框的关闭事件
+    handleClose() {
+      this.$refs["form"].resetFields();
+      this.popData = {
+        type: "",
+        showTime: "",
+        order: "",
+        link: "",
+        imgUrl: "",
+      };
+      this.bannerVisible = false;
+    },
+    // 点击选择添加图片事件
+    handleshowChooseImgPop() {
+      this.selectImgVisible = true;
+    },
+    // 点击图片的事件
+    clickSelectImg(item) {
+      this.$refs.addBannerRef.addBannerForm.imgUrl = item.IndexImg;
+      this.$refs.addBannerRef.addBannerForm.imgId = item.ImgId;
+      this.selectImgVisible = false;
+    },
+    // 筛选框的change事件
+    handleChange() {
+      this.dataList.forEach((item) => (item.page_no = 1));
+      this.getDataList();
+    },
+    //分页
+    async handleCurrentChange(item, page) {
+      item.page_no = page;
+      this.getOneDataList(item);
+    },
+    // 选择图片的分页
+    handleCurrentChangeSelectImg(page) {
+      this.page_no_img = page;
+      this.getSelectImgList();
+    },
+    // 预览图片
+    handlePreviewImg(imgId, obj) {
+      this.banerImgListArr.forEach((item) => {
+        if (imgId === item.ImgId) {
+          this.previewList = { ...item, ...obj };
+        }
+      });
+      this.$nextTick(() => {
+        this.isShowPreview = true;
+      });
+    },
+    // table下线的操作事件
+    async handleRowButton(item, row) {
+      this.$confirm(`确定要下线此banner吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = await raiInterface.bannerPublishAndcancel({ BannerId: row.BannerId });
+          if (res.Ret === 200) {
+            this.$message.success("下线成功！");
+            let page_num = Math.ceil((item.total - 1) / item.pageSize);
+            if (item.page_no > page_num) {
+              item.page_no = page_num;
+            }
+            this.getOneDataList(item);
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消下线`,
+          });
+        });
+    },
+    // 添加或者编辑的确定事件
+    preserveAndPublish(item) {
+      this.dataList.forEach((key) => {
+        if (key.name === (item.name || item.ListType)) {
+          this.getOneDataList(key);
+        }
+      });
+    },
+
+    // 拖拽的初始化和处理伙计
+    setupSortable(dom, index) {
+      const _this = this;
+      let fromIndexNumber = null;
+      const sortableInstanceIs = Sortable.create(dom, {
+        sort: _this.isDrag,
+        // 停靠位置样式
+        ghostClass: "sortable_ghost",
+        group: { name: "tableGroup", pull: true, put: true },
+        onStart(item) {
+          const { from } = item;
+          fromIndexNumber = parseInt(from.getAttribute("data-index"));
+        },
+        onEnd(obj) {
+          const { from, to, newIndex, oldIndex } = obj;
+          const fromIndex = parseInt(from.getAttribute("data-index"));
+          const toIndex = parseInt(to.getAttribute("data-index"));
+          if (newIndex == oldIndex && fromIndex == toIndex) return;
+          const currRow = _.cloneDeep(_this.dataList[fromIndex].tableList[oldIndex]); //拷贝数据
+          const newList = _.cloneDeep(_this.dataList[toIndex].tableList);
+
+          let PreviousBannerId = 0;
+          let NextBannerId = 0;
+
+          if (newIndex === 0) {
+            PreviousBannerId = 0;
+            if (newList && newList[newIndex]) NextBannerId = newList[newIndex].BannerId;
+          } else if (fromIndex != toIndex && newIndex === newList.length) {
+            PreviousBannerId = newList[newIndex - 1].BannerId;
+            NextBannerId = 0;
+          } else if (fromIndex === toIndex && newIndex === newList.length - 1) {
+            PreviousBannerId = newList[newIndex].BannerId;
+            NextBannerId = 0;
+          } else {
+            if (fromIndex === toIndex && newIndex > oldIndex) {
+              PreviousBannerId = newList[newIndex].BannerId;
+              NextBannerId = newList[newIndex + 1].BannerId;
+            } else {
+              PreviousBannerId = newList[newIndex - 1].BannerId;
+              NextBannerId = newList && newList[newIndex] ? newList[newIndex].BannerId : 0;
+            }
+          }
+
+          let params = {
+            BannerId: currRow.BannerId,
+            PreviousBannerId,
+            NextBannerId,
+            ListType: toIndex == 0 ? "A" : toIndex == 1 ? "B" : "C",
+          };
+          _this.bannerDrag(params, currRow);
+        },
+      });
+      // 动态控制拖拽功能
+      this.$watch("isDrag", (newVal) => {
+        if (newVal) {
+          sortableInstanceIs.option("disabled", false); // 启用拖拽
+        } else {
+          sortableInstanceIs.option("disabled", true); // 禁用拖拽
+        }
+      });
+    },
+
+    // 拖拽后的接口
+    async bannerDrag(params, currRow) {
+      const res = await raiInterface.bannerMoveDrag(params);
+      this.dataList = [];
+
+      if (res.Ret === 200) {
+        this.$message.success("拖动成功!");
+        this.dataList = [
+          { name: "A", tableList: [], total: 0, page_no: 1, pageSize: 10 },
+          { name: "B", tableList: [], total: 0, page_no: 1, pageSize: 10 },
+          { name: "C", tableList: [], total: 0, page_no: 1, pageSize: 10 },
+        ];
+        await this.getDataList();
+      }
+    },
+
+    /* 三件套*/
+    handleRowClick(row, key) {
+      if (key === "Title") {
+        this.tableDetailList = row;
+        this.detailsDlgVisible = true;
+      }
+    },
+    handleRowStyle(key, row) {
+      let obj = {
+        Title: "color: #409eff; cursor: pointer",
+        Status: key == "Status" && row.Status == 1 ? "color: #FF8A00" : "",
+      };
+      return obj[key] ? obj[key] : "";
+    },
+    handleRowContent(row, key) {
+      if (key == "Status") {
+        return row[key] == 1 ? "已发布" : "已下线";
+      } else {
+        return row[key];
+      }
+    },
+    /* 三件套*/
+  },
+};
+</script>
+<style>
+.sortable_ghost {
+  background-color: #999 !important;
+}
+</style>
+<style scoped lang="scss">
+.bannar-container {
+  .tabs-content {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 120px;
+    height: 40px;
+    color: #409eff;
+    background: #ecf5ff;
+    border: 1px solid #b3d8ff;
+    border-radius: 4px;
+  }
+  .tabs-active {
+    color: #ffffff;
+    background: #409eff;
+    border: none;
+  }
+  .pre-img-box {
+    position: relative;
+    width: 120px;
+    height: 120px;
+    .del {
+      display: none;
+      color: #fff;
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      text-align: center;
+      line-height: 24px;
+      background-color: rgba($color: #000000, $alpha: 0.8);
+      cursor: pointer;
+    }
+    &:hover {
+      .del {
+        display: block;
+      }
+    }
+  }
+  .seleect-img-box {
+    display: flex;
+    flex-wrap: wrap;
+    .content-img {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 236px;
+      height: 133px;
+      flex-shrink: 0;
+      margin: 0 50px 50px 0;
+      border: 1px solid #dcdfe6;
+      cursor: pointer;
+      .item-img {
+        width: 222px;
+        height: 119px;
+      }
+    }
+  }
+  .content-box {
+    display: flex;
+  }
+  .content-table {
+    width: 530px;
+    height: 720px;
+    background: #ffffff;
+    box-shadow: 2px 6px 6px rgba(0, 0, 0, 0.05);
+    .add-btn {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 120px;
+      height: 40px;
+      background: #409eff;
+      border-radius: 4px;
+      color: #fff;
+      margin: 80px auto 0;
+      cursor: pointer;
+    }
+  }
+  .container-top {
+    width: 1620px;
+    padding: 20px;
+    background: #ffffff;
+    box-shadow: 2px 6px 6px rgba(0, 0, 0, 0.05);
+  }
+}
+</style>

src/views/rai_manage/cygxManage/components/lableDlg.vue

@@ -0,0 +1,175 @@
+<template>
+  <div class="container lable-add-content">
+    <el-dialog :title="visibleTitle" :visible.sync="showRegularDlg" width="600px" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center @close="handleClose">
+      <div v-if="dataRegular.TagType == 1">
+        <div v-for="(item, index) in addDataList" :key="index" class="add-name-item">
+          <el-autocomplete style="width: 90%" v-model="item.name" clearable :fetch-suggestions="querySearchAsync" @select="tableSelectHandel(item)" placeholder="请输入内容"></el-autocomplete>
+          <img style="width: 20px; height: 20px" @click="deleteChildren(index)" src="~@/assets/img/icons/delete-Item.png" />
+        </div>
+        <div style="display: flex; align-items: center; cursor: pointer; width: 100px" @click="addActivityNameHandler">
+          <img style="width: 20px; height: 20px; margin-right: 10px" src="~@/assets/img/document_m/add-label.png" />
+          添加活动
+        </div>
+      </div>
+      <div class="text-content" v-else>{{ visibleText }}</div>
+      <span slot="footer" class="dialog-footer">
+        <template v-if="dataRegular.TagType == 1">
+          <el-button @click="handleClose">取 消</el-button>
+          <el-button type="primary" @click="addBannerHandler">确 定</el-button>
+        </template>
+        <el-button v-else type="primary" @click="handleClose">关闭</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+
+export default {
+  name: "",
+  components: {},
+  props: {
+    showRegularDlg: {
+      type: Boolean,
+      default: false,
+    },
+    dataRegular: {
+      type: Object,
+      default: {},
+    },
+  },
+  data() {
+    return {
+      querySearchList: [],
+      addDataList: [],
+    };
+  },
+  computed: {
+    visibleTitle() {
+      return this.dataRegular.TagName || "";
+    },
+    visibleText() {
+      let str =
+        this.dataRegular.TagType == 2
+          ? "所有【海外】的活动，和报告类型为【海外研究】的报告"
+          : this.dataRegular.TagType == 3
+          ? "所有路演回放音视频"
+          : this.dataRegular.TagType == 4
+          ? "所有问答系列音频"
+          : "";
+      return str;
+    },
+  },
+  watch: {
+    showRegularDlg: {
+      handler(newVal) {
+        if (newVal) {
+          newVal && this.getInitList();
+        }
+      },
+    },
+  },
+  created() {},
+  async mounted() {},
+  methods: {
+    handleClose() {
+      this.querySearchList = [];
+      this.addDataList = [];
+      this.$emit("update:showRegularDlg", false);
+      this.$emit("update:dataRegular", {});
+    },
+    async addBannerHandler() {
+      let isOk = this.addDataList.every((item) => item.name !== "");
+      if (isOk) {
+        let arr = [];
+        this.addDataList.forEach((_) => {
+          arr.push(_.id);
+        });
+        const res = await raiInterface.tagHot_activityListUpdate({
+          ActivityIds: arr,
+        });
+        if (res.Ret === 200) {
+          this.$message.success("保存成功");
+          this.handleClose();
+        }
+      } else {
+        this.$message.error("活动名称不能为空");
+      }
+    },
+    // 删除
+    deleteChildren(index) {
+      this.addDataList.splice(index, 1);
+    },
+    async querySearchAsync(query, cb) {
+      cb([]);
+      if (query) {
+        const res = await raiInterface.tagHot_activityList({ KeyWord: query });
+        if (res.Ret === 200) {
+          console.log(res);
+          this.querySearchList = res.Data.List.map((_) => {
+            return {
+              ..._,
+              value: _.ActivityName + "，" + _.ActivityTime,
+            };
+          });
+          cb(this.querySearchList);
+        }
+      }
+    },
+    addActivityNameHandler() {
+      this.addDataList.push({
+        name: "",
+        id: "",
+      });
+    },
+    tableSelectHandel(item) {
+      this.querySearchList.forEach((_) => {
+        if (_.value === item.name) {
+          item.id = _.ActivityId;
+        }
+      });
+    },
+    async getInitList() {
+      const res = await raiInterface.tagHot_activityList();
+      if (res.Ret === 200 && res.Data.List.length > 0) {
+        res.Data.List.forEach((item) => {
+          this.addDataList.push({
+            name: item.ActivityName + "，" + item.ActivityTime,
+            id: item.ActivityId,
+          });
+        });
+      }
+    },
+  },
+};
+</script>
+<style lang="scss">
+.lable-add-content {
+  .add-name-item {
+    display: flex;
+    align-items: center;
+    margin-bottom: 20px;
+    .el-input {
+      width: 100% !important;
+    }
+    img {
+      margin-left: 20px;
+    }
+  }
+}
+</style>
+<style scoped lang="scss">
+.lable-add-content {
+  .text-content {
+    width: 487px;
+    height: 40px;
+    line-height: 40px;
+    border-radius: 4px;
+    border: 1px solid #dcdfe6;
+    padding-left: 12px;
+    color: #c0c4cc;
+    margin: 0 auto 50px;
+  }
+}
+</style>

src/views/rai_manage/cygxManage/industryMap.vue

@@ -0,0 +1,158 @@
+<script setup lang="jsx">
+import { ref } from "vue";
+import { raiInterface } from "@/api/api.js";
+import mDialog from "../components/mapDialog.vue";
+import { Plus, Edit, Delete } from "@element-plus/icons-vue";
+const showData = ref(false); //数据
+const isShowDia = ref(false);
+
+const poper = ref(null);
+
+const treeData = ref({});
+const nodeData = ref({});
+const dia_tit = ref("新增子级");
+
+const defaultProps = ref({
+  label: "IndustryMapName",
+  children: "Children",
+});
+
+/* 获取树节点 */
+const getNodeTree = async () => {
+  raiInterface.getMap().then((res) => {
+    if (res.Ret === 200) {
+      treeData.value = res.Data.Node || {};
+      showData.value = true;
+    }
+  });
+};
+
+/* 节点操作 */
+const nodeHandle = (type, data) => {
+  dia_tit.value = type;
+  nodeData.value = {
+    id: data.IndustryMapId,
+    name: data.IndustryMapName,
+    level: data.Level,
+  };
+  isShowDia.value = true;
+};
+/* 节点操作完成 */
+const handleOver = () => {
+  isShowDia.value = false;
+  getNodeTree();
+};
+
+// 是否超出盒子宽度
+const isOverflow = (box) => {
+  return box.scrollWidth > box.offsetWidth;
+};
+
+getNodeTree();
+</script>
+
+<template>
+  <div class="industryMap_container">
+    <div class="tree_cont">
+      <vue3-tree-org
+        :data="treeData"
+        :props="{
+          label: 'IndustryMapName',
+          id: 'ParentId',
+          children: 'Children',
+        }"
+        :toolBar="false"
+        :horizontal="true"
+        :scalable="false"
+      >
+        <!-- 自定义节点内容 -->
+        <template v-slot="{ node }">
+          <div class="tem_node_item" v-if="showData">
+        	<div class="title" :style="{ 'font-weight': node.id === 0 ? '600' : '' }">
+              {{ node.label }}
+            </div>
+            <div class="tem_footer" v-if="node.id !== 0">
+              <img @click.stop="nodeHandle('add', node)" src="~@/assets/img/set_m/add.png" alt="" style="width: 14px; height: 14px; margin-right: 8px" />
+              <img @click.stop="nodeHandle('edit', node)" src="~@/assets/img/set_m/edit.png" alt="" style="width: 14px; height: 14px; margin-right: 8px" />
+              <img v-if="!node.children || !node.children.length" @click.stop="nodeHandle('del', node)" src="~@/assets/img/set_m/del.png" alt="" style="width: 14px; height: 14px" />
+            </div>
+            <div class="tem_footer" v-else>
+              <img @click.stop="nodeHandle('add', node)" src="~@/assets/img/set_m/add.png" alt="" style="width: 14px; height: 14px; margin-right: 8px" />
+            </div>
+          </div>
+        </template>
+      </vue3-tree-org>
+    </div>
+    <m-dialog :isShowDia="isShowDia" :nodeData="nodeData" :title="dia_tit" :selectedKey="'医药1'" selectedClassName="active_node" @cancel="isShowDia = false" @over="handleOver" />
+  </div>
+</template>
+
+<style lang="scss">
+.industryMap_container {
+  padding: 20px 30px;
+  background: #fff;
+  min-height: calc(100vh - 200px);
+  /* tree css */
+  .zm-tree-org {
+    padding: 0;
+  }
+  .tree-org-node__content .tree-org-node__inner {
+    background: #e0eefd;
+    color: #409eff;
+    padding: 8px 10px;
+    .tem_node_item .title {
+      width: 110px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+  }
+  .horizontal .tree-org-node__children {
+    padding-left: 30px;
+  }
+  .horizontal .tree-org-node__children:before {
+    width: 30px;
+  }
+  .horizontal .tree-org-node:only-child:before {
+    top: 0;
+  }
+  .horizontal .tree-org-node.is-leaf,
+  .horizontal .tree-org-node.collapsed {
+    padding-top: 8px;
+    padding-bottom: 8px;
+  }
+  .tree_cont {
+    min-width: 900px;
+    margin-top: 50px;
+    height: 700px;
+    .tem_node_item {
+      display: flex;
+      align-items: center;
+      .title {
+        font-size: 14px;
+      }
+      .tem_footer {
+        display: flex;
+        cursor: pointer;
+        margin-left: 10px;
+      }
+    }
+  }
+  .zm-tree-org .zoom-container {
+    overflow-y: scroll;
+  }
+  .industryMap_top {
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 60px;
+  }
+  .poper {
+    position: absolute;
+    display: none;
+    color: #fff;
+    background-color: rgba(0, 0, 0, 0.7);
+    padding: 10px;
+    border-radius: 5px;
+  }
+}
+</style>

src/views/rai_manage/cygxManage/interviewList.vue

@@ -0,0 +1,196 @@
+<script>
+import { defineComponent } from "vue";
+export default defineComponent({
+  beforeRouteEnter(to, from, next) {
+    if (from.path != "/customDetail") {
+      sessionStorage.removeItem("interviewListBack");
+    }
+    next();
+  },
+});
+</script>
+
+<script setup>
+import { ref, watch, onMounted } from "vue";
+import { raiInterface } from "@/api/api.js";
+import { onBeforeRouteLeave, useRouter } from "vue-router";
+import { Search } from "@element-plus/icons-vue";
+// import mPage from "@/components/mPage.vue";
+// import intervewDia from "../components/interviewDia.vue";
+
+const router = useRouter();
+onBeforeRouteLeave((to, from, next) => {
+  let backData = {
+    page_no: this.page_no,
+    keyword: this.search_txt,
+  };
+  sessionStorage.setItem("interviewListBack", JSON.stringify(backData));
+  next();
+});
+
+const total = ref(0);
+const page_no = ref(sessionStorage.getItem("interviewListBack") ? JSON.parse(sessionStorage.getItem("interviewListBack")).page_no : 1);
+const pageSize = ref(10);
+const search_txt = ref("");
+const tableData = ref([]);
+const diaTit = ref("");
+const isShowDia = ref(false);
+const status = ref("");
+const applyId = ref("");
+const itemObj = ref([]);
+
+watch(
+  () => search_txt,
+  () => {
+    page_no.value = 1;
+    getTableData();
+  }
+);
+
+/* 获取表格数据 */
+const getTableData = () => {
+  raiInterface
+    .interviewList({
+      PageSize: pageSize.value,
+      CurrentIndex: page_no.value,
+      KeyWord: search_txt.value,
+    })
+    .then((res) => {
+      if (res.Ret === 200) {
+        tableData.value = res.Data.List || [];
+        total.value = res.Data.Paging.Totals;
+      }
+    });
+};
+
+/* 页码改变 */
+const handleCurrentChange = (page) => {
+  page_no.value = page;
+  getTableData();
+};
+
+/* 操作事件 */
+const dialogHandle = (item, type) => {
+  diaTit.value = type;
+  status.value = item.Status;
+  applyId.value = item.InterviewApplyId;
+  itemObj.value = type === "detail" ? [item] : [];
+  isShowDia.value = true;
+};
+/* 操作完成 */
+const diaOverHandle = () => {
+  isShowDia.value = false;
+  getTableData();
+};
+
+onMounted(() => {
+  if (sessionStorage.getItem("interviewListBack")) {
+    let backData = JSON.parse(sessionStorage.getItem("interviewListBack"));
+    search_txt.value = backData.keyword;
+    page_no.value = backData.page_no;
+  }
+  getTableData();
+});
+</script>
+
+<template>
+  <div class="interviewList_container">
+    <div class="interviewList_top">
+      <el-input placeholder="姓名/手机号" v-model="search_txt" clearable style="max-width: 500px">
+        <template #prefix>
+          <el-icon class="el-input__icon"><search /></el-icon>
+        </template>
+      </el-input>
+    </div>
+    <div class="interviewList_cont">
+      <el-table ref="userTable" :data="tableData" v-loading="isShowloadding" element-loading-text="数据加载中..." border>
+        <el-table-column prop="UserRealName" label="姓名" align="center">
+          <template #default="scope">
+            <span>{{ scope.row.UserRealName }}</span></template
+          >
+        </el-table-column>
+        <el-table-column prop="Mobile" label="手机号" align="center">
+          <template #default="scope">
+            <span>{{ scope.row.Mobile }}</span></template
+          >
+        </el-table-column>
+        <el-table-column prop="CompanyName" label="客户名称" align="center">
+          <template #default="scope">
+            <span
+              style="color: #409eff; cursor: pointer"
+              @click="
+                router.push({
+                  path: '/RaiDetail',
+                  query: {
+                    id: scope.row.CompanyId,
+                  },
+                })
+              "
+              >{{ scope.row.CompanyName }}</span
+            ></template
+          >
+        </el-table-column>
+        <el-table-column prop="SalesRealName" label="所属销售" align="center">
+          <template #default="scope">
+            <span>{{ scope.row.SalesRealName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Status" label="申请状态" align="center">
+          <template #default="scope">
+            <span>{{ scope.row.Status }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="CreateTime" label="申请时间" align="center">
+          <template #default="scope">
+            <span>{{ scope.row.CreateTime }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" min-width="110">
+          <template #default="scope">
+            <span class="editsty" style="marginright: 10px" @click="dialogHandle(scope.row, 'detail')">查看详情</span>
+            <template v-if="scope.row.Status === '待邀请' || scope.row.Status === '待访谈'">
+              <span class="editsty" style="marginright: 10px" @click="dialogHandle(scope.row, 'update')">状态更新</span>
+              <span class="editsty" style="marginright: 10px" @click="dialogHandle(scope.row, 'cancel')">取消</span>
+            </template>
+          </template>
+        </el-table-column>
+        <template #empty>
+          <div style="lineheight: 44px; margin: 60px 0; color: #999">
+            <img src="~@/assets/img/cus_m/nodata.png" alt="" style="display: block; width: 160px; height: 128px; margin: auto" />
+            <span>暂无数据</span>
+          </div>
+        </template>
+      </el-table>
+      <el-col :span="24" class="toolbar">
+        <!-- <m-page :total="total" :page_no="page_no" @handleCurrentChange="handleCurrentChange" /> -->
+      </el-col>
+    </div>
+    <!-- 弹窗操作 -->
+    <!-- <intervewDia :isShowDia="isShowDia" :title="diaTit" :status="status" :itemObj="itemObj" :applyId="applyId" @cancel="isShowDia = false" @over="diaOverHandle" /> -->
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.interviewList_container {
+  .interviewList_top {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    border: 1px solid #ececec;
+    padding: 20px 30px;
+    background: #fff;
+    border-radius: 4px;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+  }
+  .interviewList_cont {
+    min-height: calc(100vh - 320px);
+    padding: 20px 30px 80px;
+    background: #fff;
+    margin-top: 20px;
+    position: relative;
+    border: 1px solid #ececec;
+    border-radius: 4px;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+  }
+}
+</style>

src/views/rai_manage/cygxManage/lableManage.vue

@@ -0,0 +1,523 @@
+<template>
+  <div class="container lable-manage-page">
+    <el-card style="overflow: hidden">
+      <div class="top-comtent">
+        <div>
+          <span>当前标签</span>
+          <span>自定义标签</span>
+          <span>固定标签</span>
+        </div>
+        <el-button type="primary" @click="addOfEitdHandler('添加')">添加标签</el-button>
+      </div>
+      <div ref="lableSortable" class="lable-content">
+        <div :class="['lable-item', item.TagType > 0 && 'regular-lable']" v-for="item in lableList" :key="item.TagId">
+          <div class="text_oneLine">{{ item.TagName }}</div>
+          <div class="lable-img" v-if="item.TagType">
+            <img src="~@/assets/img/rai_m/edit_icon_GuDing.png" alt="" @click="addOfEitdHandler('编辑', item)" />
+            <img src="~@/assets/img/rai_m/remove_below_GuDing.png" alt="" @click="lableButtonHandel('撤下', item)" />
+          </div>
+          <div class="lable-img" v-else>
+            <img src="~@/assets/img/rai_m/edit_icon.png" alt="" @click="addOfEitdHandler('编辑', item)" />
+            <img src="~@/assets/img/rai_m/remove_below.png" alt="" @click="lableButtonHandel('撤下', item)" />
+          </div>
+        </div>
+      </div>
+    </el-card>
+    <el-card style="margin-top: 20px">
+      <div class="lable-select-box">
+        <div v-for="(item, index) in tableSelect" :key="item.value" @click="tableSelectHandel(item)" class="item">
+          <span :class="['name', tableSelectActive == item.value && 'active']">{{ item.name }}</span>
+          <span v-if="index == 0" class="divide">|</span>
+        </div>
+      </div>
+      <el-table border :data="tableList" @sort-change="sortChangeHandle">
+        <el-table-column align="center" key="name" prop="TagName" label="标签名称" width=""></el-table-column>
+        <el-table-column align="center" key="series" prop="ArticleTypes" label="报告类型" width=""></el-table-column>
+        <el-table-column align="center" key="type" prop="ActivityTypes" label="活动类型" width=""></el-table-column>
+        <el-table-column align="center" key="industry" prop="Industries" label="相关产业" width=""></el-table-column>
+        <el-table-column align="center" key="subject" prop="SubjectNames" label="相关标的" width=""></el-table-column>
+        <el-table-column align="center" key="tiem" prop="OnlineTime" label="上线时间" width="180"></el-table-column>
+        <el-table-column align="center" key="remove" prop="OfflineTime" label="撤下时间" width="180" v-if="tableSelectActive == 0"></el-table-column>
+        <el-table-column align="center" key="pvuv" prop="Sort" label="pv/uv" width="90" sortable="custom">
+          <template slot-scope="{ row }">
+            <div class="pv-uv-download">
+              <span>{{ row.Pv }}/{{ row.Uv }}</span>
+              <a :href="exportPvUv(row.TagId)" download>
+                <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+              </a>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" key="operate" label="操作" width="125" v-if="tableSelectActive == 0">
+          <template slot-scope="{ row }">
+            <span class="editsty" @click="lableButtonHandel('上线', row)">重新上线 &nbsp;&nbsp;</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <div>
+      <el-dialog :title="dlgTitle" @close="handleClose" :visible.sync="dialogVisible" width="566px" :close-on-click-modal="false" :modal-append-to-body="false">
+        <div>
+          <el-form :model="labelForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
+            <el-form-item prop="TagName">
+              <el-input style="width: 100%" :maxlength="8" v-model="labelForm.TagName" placeholder="请输入标签名称(8个字以内)"></el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-select
+                style="width: 100%"
+                v-model="labelForm.ArticleTypes"
+                multiple
+                filterable
+                remote
+                reserve-keyword
+                placeholder="请输入关联的报告类型（选填，可输入多个）"
+                :remote-method="remoteMethodArticle"
+              >
+                <el-option v-for="item in optionsArticle" :key="item.SubCategoryName" :label="item.SubCategoryName" :value="item.SubCategoryName"> </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-select style="width: 100%" multiple v-model="labelForm.ActivityTypes" placeholder="请输入关联的活动类型（选填，可输入多个）">
+                <el-option v-for="item in optionsActivity" :label="item.ActivityTypeName" :key="item.ActivityTypeName" :value="item.ActivityTypeName"></el-option
+              ></el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-select
+                style="width: 100%"
+                v-model="labelForm.Industries"
+                multiple
+                filterable
+                remote
+                reserve-keyword
+                placeholder="请输入相关产业（选填，可输入多个）"
+                :remote-method="remoteMethodIndustries"
+              >
+                <el-option v-for="item in optionsIndustries" :key="item.IndustryName" :label="item.IndustryName" :value="item.IndustryName"> </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-select
+                style="width: 100%"
+                v-model="labelForm.SubjectNames"
+                multiple
+                filterable
+                remote
+                reserve-keyword
+                placeholder="请输入相关标的（选填，可输入多个）"
+                :remote-method="remoteMethodSubject"
+              >
+                <el-option v-for="item in optionsSubject" :key="item.SubjectName" :label="item.SubjectName" :value="item.SubjectName"> </el-option>
+              </el-select>
+            </el-form-item>
+          </el-form>
+        </div>
+        <span slot="footer" class="dialog-footer">
+          <el-button @click="handleClose">取 消</el-button>
+          <el-button type="primary" @click="addTagHandler">确 定</el-button>
+        </span>
+      </el-dialog>
+    </div>
+    <lable-dlg :showRegularDlg.sync="showRegularDlg" :dataRegular.sync="dataRegular" />
+  </div>
+</template>
+
+<script>
+import Sortable from "sortablejs";
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+import LableDlg from "./components/lableDlg.vue";
+export default {
+  name: "",
+  components: { mPage, LableDlg },
+  props: {},
+  data() {
+    return {
+      labelForm: {
+        TagName: "",
+        ArticleTypes: "", //关联的报告系列
+        ActivityTypes: [],
+        Industries: "", //关联产业列表
+        SubjectNames: "",
+      },
+      rules: {
+        TagName: [{ required: true, message: "请输入标签名称", trigger: "blur" }],
+      },
+      dialogVisible: false,
+      page_no: 1,
+      total: 0,
+      pageSize: 10,
+      lableList: [],
+      tableList: [],
+      tableSelect: [
+        {
+          name: "当前标签数据",
+          value: 1,
+        },
+        {
+          name: "已撤下的标签",
+          value: 0,
+        },
+      ],
+      tableSelectActive: 1,
+      optionsArticle: [],
+      optionsActivity: [],
+      optionsIndustries: [],
+      optionsSubject: [],
+      dlgTitle: "添加",
+      showRegularDlg: false,
+      dataRegular: {},
+      sortType: "",
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    this.setupSortable();
+    this.getDataList();
+    this.getLableTagList();
+    this.activityType();
+  },
+  methods: {
+    // 获取表格列表
+    async getDataList() {
+      const res = await raiInterface.getLableTagList({
+        Status: this.tableSelectActive,
+        PageSize: this.pageSize,
+        CurrentIndex: this.page_no,
+        SortParam: "pv",
+        SortType: this.sortType,
+      });
+      if (res.Ret === 200) {
+        this.total = res.Data.Paging.Totals;
+        this.tableList = res.Data.List || [];
+      }
+    },
+    // 获取标签列表
+    async getLableTagList() {
+      const res = await raiInterface.getLableTagListCustom();
+      if (res.Ret === 200) {
+        this.lableList = res.Data || [];
+      }
+    },
+
+    // 获取活动类型
+    async activityType() {
+      const res = await raiInterface.getActivityType({
+        IsGetAll: true,
+      });
+      if (res.Ret === 200) {
+        this.optionsActivity = res.Data.List;
+      }
+    },
+
+    // 表格的切换点击事件
+    tableSelectHandel(item) {
+      if (this.tableSelectActive !== item.value) {
+        this.page_no = 1;
+        this.tableSelectActive = item.value;
+        this.getDataList();
+      }
+    },
+    // 重新上线    // 撤下标签
+    lableButtonHandel(type, item) {
+      this.$confirm(type == "撤下" ? "确定要撤下此标签吗?" : "确定要重新上线此标签吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = await raiInterface.getLableTagEnable({
+            Status: item.Status == 0 ? 1 : 0,
+            TagId: item.TagId,
+          });
+          if (res.Ret === 200) {
+            this.getLableTagList();
+            this.getDataList();
+            this.$message({
+              type: "success",
+              message: "操作成功!",
+            });
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消",
+          });
+        });
+    },
+    // 分页的事件
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getDataList();
+    },
+    // 拖拽的事件
+    setupSortable() {
+      const _this = this;
+      const sortableInstanceIs = Sortable.create(this.$refs.lableSortable, {
+        ghostClass: "sortable-ghost", // drop placeholder的css类名
+        sort: true,
+        onEnd(obj) {
+          const { newIndex, oldIndex } = obj;
+          const newList = _.cloneDeep(_this.lableList);
+          let PrevTagId = 0;
+          let NextTagId = 0;
+          if (newIndex === 0) {
+            PrevTagId = 0;
+            NextTagId = newList[newIndex].TagId;
+          } else if (newIndex === newList.length - 1) {
+            PrevTagId = newList[newIndex].TagId;
+            NextTagId = 0;
+          } else {
+            if (newIndex > oldIndex) {
+              NextTagId = newList[newIndex + 1].TagId;
+              PrevTagId = newList[newIndex].TagId;
+            } else {
+              NextTagId = newList[newIndex].TagId;
+              PrevTagId = newList[newIndex - 1].TagId;
+            }
+          }
+          let params = {
+            TagId: newList[oldIndex].TagId,
+            PrevTagId,
+            NextTagId,
+          };
+          _this.postLableTagMove(params);
+        },
+      });
+    },
+    // 拖拽的事件
+    async postLableTagMove(params) {
+      const res = await raiInterface.postLableTagMove(params);
+      if (res.Ret === 200) {
+        this.getLableTagList();
+        this.getDataList();
+        this.$message.success("移动成功");
+      }
+    },
+    // 添加或者编辑标签
+    addOfEitdHandler(type, item) {
+      if (item && item.TagType > 0) {
+        this.dataRegular = item;
+        this.showRegularDlg = true;
+        return;
+      }
+      this.dlgTitle = type;
+      if (item) {
+        const { TagName, ArticleTypes, ActivityTypes, Industries, SubjectNames, TagId } = item;
+        this.labelForm.TagName = TagName;
+        this.labelForm.ArticleTypes = ArticleTypes ? ArticleTypes.split(",") : [];
+        this.labelForm.ActivityTypes = ActivityTypes ? ActivityTypes.split(",") : [];
+        this.labelForm.Industries = Industries ? Industries.split(",") : [];
+        this.labelForm.SubjectNames = SubjectNames ? SubjectNames.split(",") : [];
+        this.labelForm.TagId = TagId;
+      }
+      this.dialogVisible = true;
+    },
+    // pv uv  下载
+    exportPvUv(id) {
+      const url = process.env.API_ROOT + `/cygx/tag/PvExport?TagId=${id}&${localStorage.getItem("auth") || ""}`;
+      return url;
+    },
+    // 添加标签
+    addTagHandler() {
+      this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          let { ArticleTypes, ActivityTypes, Industries, SubjectNames } = this.labelForm;
+          if (!ArticleTypes.length && !ActivityTypes.length && !SubjectNames.length && !Industries.length) return this.$message.error("请至少填写一个关联项");
+          let params = {
+            TagName: this.labelForm.TagName,
+            ArticleTypes: ArticleTypes ? ArticleTypes.join(",") : "",
+            ActivityTypes: ActivityTypes ? ActivityTypes.join(",") : "",
+            Industries: Industries ? Industries.join(",") : "",
+            SubjectNames: SubjectNames ? SubjectNames.join(",") : "",
+            TagId: this.dlgTitle == "添加" ? 0 : this.labelForm.TagId,
+          };
+          const res = await raiInterface.postLableTagSave(params);
+          if (res.Ret === 200) {
+            this.handleClose();
+            this.getLableTagList();
+            this.getDataList();
+            this.$message.success("操作成功");
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    // 关闭弹框
+    handleClose() {
+      this.optionsArticle = [];
+      this.optionsIndustries = [];
+      this.optionsSubject = [];
+      this.labelForm = {
+        TagName: "",
+        ArticleTypes: "", //关联的报告系列
+        ActivityTypes: [],
+        Industries: "", //关联产业列表
+        SubjectNames: "",
+      };
+      this.dialogVisible = false;
+      this.$refs.ruleForm.resetFields();
+    },
+    // 搜索所有的报告系列
+    async remoteMethodArticle(query) {
+      if (query !== "") {
+        const res = await raiInterface.getLableTagSubCategoryName({
+          KeyWord: query,
+        });
+        if (res.Ret === 200) {
+          this.optionsArticle = res.Data || [];
+        }
+      } else {
+        this.optionsArticle = [];
+      }
+    },
+    // 产业
+    async remoteMethodIndustries(query) {
+      if (query !== "") {
+        const res = await raiInterface.getLableTagIndustrialManagement({
+          KeyWord: query,
+        });
+        if (res.Ret === 200) {
+          this.optionsIndustries = res.Data.List || [];
+        }
+      } else {
+        this.optionsIndustries = [];
+      }
+    },
+    // 标的
+    async remoteMethodSubject(query) {
+      if (query !== "") {
+        const res = await raiInterface.industrialSubjectSearch({
+          KeyWord: query,
+        });
+        if (res.Ret === 200) {
+          this.optionsSubject = res.Data.List || [];
+        }
+      } else {
+        this.optionsSubject = [];
+      }
+    },
+    sortChangeHandle(column) {
+      this.sortType = column.order == "descending" ? "desc" : column.order == "ascending" ? "asc" : "";
+      this.getDataList();
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.lable-manage-page {
+  .top-comtent {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    div {
+      :nth-child(2),
+      :nth-child(3) {
+        font-size: 12px;
+        font-weight: 400;
+        text-align: center;
+        display: inline-block;
+        width: 80px;
+        height: 30px;
+        line-height: 30px;
+        background: #ecf5ff;
+        border: 1px solid #b3d8ff;
+        color: #409eff;
+        border-radius: 4px;
+        margin-left: 10px;
+      }
+      :nth-child(3) {
+        background-color: #fff8e4;
+        border: 1px solid #ffd9c2;
+        color: #e37318;
+      }
+    }
+    span {
+      font-weight: 500;
+      font-size: 16px;
+    }
+  }
+  .lable-content {
+    display: flex;
+    flex-wrap: wrap;
+    padding: 30px 0;
+    width: 105%;
+    .lable-item {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      width: 205px;
+      height: 40px;
+      background: #ecf5ff;
+      border: 1px solid #b3d8ff;
+      color: #409eff;
+      border-radius: 4px;
+      margin: 0 30px 20px 0;
+      padding: 0 10px;
+      cursor: move;
+      box-sizing: border-box;
+      .lable-img {
+        width: 38px;
+        flex-shrink: 0;
+        display: flex;
+        justify-content: space-between;
+        cursor: pointer;
+        img {
+          width: 14px;
+          height: 14px;
+        }
+      }
+    }
+    .sortable-ghost {
+      width: 100px;
+      height: 1px;
+      border: 2px solid #409eff;
+      overflow: hidden;
+    }
+    .regular-lable {
+      background-color: #fff8e4 !important;
+      border: 1px solid #ffd9c2;
+      color: #e37318;
+    }
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+  .lable-select-box {
+    display: flex;
+    margin-bottom: 20px;
+    .item {
+      display: flex;
+      line-height: 40px;
+      cursor: pointer;
+      .name {
+        width: 120px;
+        height: 40px;
+        text-align: center;
+      }
+      .divide {
+        padding: 0 20px;
+      }
+    }
+    .active {
+      background: #409eff;
+      border-radius: 4px;
+      color: #fff;
+    }
+  }
+}
+</style>

src/views/rai_manage/cygxManage/searchManage.vue

@@ -0,0 +1,100 @@
+<template>
+  <div class="container-search">
+    <el-card>
+      <div class="search-top">
+        <span>近7天热词</span>
+        <div>
+          <a :href="exportUser" download>
+            <el-button type="primary">下载明细</el-button>
+          </a>
+        </div>
+      </div>
+    </el-card>
+    <el-card style="margin-top: 20px">
+      <el-table style="width: 100%" border :data="searchList">
+        <el-table-column label="排序" align="center" width="84" prop="Sort">
+        </el-table-column>
+        <el-table-column align="center" label="关键词"  prop="KeyWord"> </el-table-column>
+        <el-table-column align="center" label="搜索次数"  prop="KeyWordNum"> </el-table-column>
+      </el-table>
+      <el-pagination
+        @current-change="handleCurrentChange"
+        background
+        layout="pager"
+        :page-size="12"
+        :total="total"
+      >
+      </el-pagination>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {},
+  data() {
+    return {
+      PageSize: 12,
+      CurrentIndex: 1,
+      searchList: [],
+      total:0
+    };
+  },
+  computed: {
+    // 导出地址
+    exportUser() {
+      return (
+        process.env.API_ROOT + "/cygx/hostKeyword/download?"+localStorage.getItem('auth')||''
+      );
+    },
+  },
+  watch: {},
+  created() {
+    
+  },
+  mounted() {
+    this.applyList()
+  },
+  methods: {
+     applyList() {
+      raiInterface.hostKeyword({
+        PageSize:this.PageSize,
+        CurrentIndex:this.CurrentIndex,
+      }).then((res=>{
+        if(res.Ret === 200){
+          this.total=res.Data.Paging.Totals
+          this.searchList=res.Data.List
+        }       
+      }))
+    },
+     handleCurrentChange(val) {
+       this.CurrentIndex=val;
+       this.applyList()
+    }
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-search {
+  .search-top {
+    display: flex;
+    justify-content: space-between;
+    span {
+      width: 122px;
+      height: 40px;
+      background: #f0f2f5;
+      opacity: 1;
+      line-height: 40px;
+      text-align: center;
+      color: #666666;
+    }
+  }
+  .el-pagination {
+    margin-top: 20px;
+    text-align: right;
+  }
+}
+</style>

src/views/rai_manage/reportManage/appletsReport.vue

@@ -0,0 +1,750 @@
+<template>
+  <div class="container-applets">
+    <!-- 头部根据条件查找 -->
+    <el-card class="top-card-box">
+      <div class="top-card">
+        <div>
+          <span v-for="item in tabsList" :key="item.index" :class="tabs_index == item.index ? 'tab_active' : ''" @click="tabActive(item)">{{ item.name }}</span>
+        </div>
+        <div class="input-box">
+          <el-input placeholder="请输入报告标题" v-model="listFrom.KeyWord" @input="listFromInput" clearable>
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+      </div>
+    </el-card>
+    <!-- 内容部分 -->
+    <el-card>
+      <!-- 筛选条件 -->
+      <div class="screen-box">
+        <div style="flex: 1">
+          <el-select style="margin-bottom: 20px" placeholder="行业" v-model="listFrom.ChartPermissionId" @clear="clearSelect" clearable @change="listChangeBtn">
+            <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+          </el-select>
+          <el-select placeholder="系列" v-model="listFrom.SubCategoryName" @focus="reportMappingist" clearable @change="listChangeBtn">
+            <el-option v-for="(item, index) in themeList" :label="item.SubCategoryName" :key="index" :value="item.SubCategoryName"></el-option>
+          </el-select>
+          <el-select placeholder="报告类型" v-model="listFrom.MatchTypeName" v-show="tabs_index == 1" @focus="reportMappingMatchTypeRep" clearable @change="listChangeBtn">
+            <el-option v-for="(item, index) in MatchTypeNameList" :label="item.MatchTypeName" :key="index" :value="item.MatchTypeName"></el-option>
+          </el-select>
+          <el-select placeholder="产业" v-model="listFrom.IndustrialManagementId" v-show="tabs_index == 1" @focus="getIndustrialManagement" clearable @change="listChangeBtn">
+            <template>
+              <el-option v-for="item in idustrialManagement" :label="item.IndustryName" :key="item.IndustrialManagementId" :value="item.IndustrialManagementId"></el-option>
+            </template>
+          </el-select>
+          <el-input v-if="tabs_index == 1" style="width: 230px; margin-right: 15px" placeholder="请输入报告标签" v-model="listFrom.relevance" @input="listFromInput" clearable>
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+          <el-input v-if="tabs_index != 2" style="width: 230px; margin-right: 15px" placeholder="请输入个股标签" v-model="listFrom.reportLabel" @input="listFromInput" clearable>
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+          <date-picker style="margin-bottom: 30px" type="date" range v-model="createdate" placeholder="发布时间" value-type="format" @change="listChangeBtn"> </date-picker>
+        </div>
+        <div style="width: 220px">
+          <el-button type="primary" style="margin-bottom: 30px" v-if="IsShowButton" @click="$router.push('/appIndustry')">产业管理</el-button>
+          <el-button style="float: right" type="primary" @click="addSummary('')">添加报告</el-button>
+        </div>
+      </div>
+      <!-- 表格 -->
+      <div>
+        <el-table style="width: 100%" border :data="getList">
+          <el-table-column align="center" label="报告标题" min-width="300">
+            <template slot-scope="scope">
+              <span style="cursor: pointer" class="title-table" @click="lookDetail(scope.row)">{{ scope.row.Title }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column min-width="80" align="center" label="行业" prop="PermissionName" key="permissionName"></el-table-column>
+          <el-table-column min-width="180" align="center" label="发布时间" prop="PublishDate" key="publishDate"></el-table-column>
+          <el-table-column min-width="180" v-if="tabs_index !== 2" align="center" label="产业标签" prop="FieldName" key="FieldName"></el-table-column>
+          <el-table-column min-width="180" v-if="tabs_index !== 2" align="center" label="个股标签" prop="Stock" key="Stock"></el-table-column>
+          <el-table-column min-width="100" align="center" label="系列" key="subCategoryName" prop="SubCategoryName"></el-table-column>
+          <el-table-column min-width="130" align="center" key="MatchTypeName" label="匹配类型">
+            <template slot-scope="scope">
+              <div>
+                <span>{{ scope.row.MatchTypeName }}</span>
+                <img @click="modification(scope.row.ReportId)" :src="$icons.amend" style="color: #fff; width: 12px; height: 12px; margin-left: 5px; vertical-align: middle" />
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column v-if="tabs_index == 1" min-width="200" align="center" label="报告标签">
+            <template slot-scope="{ row }"> {{ row.Label }} </template>
+          </el-table-column>
+          <el-table-column width="150" label="PV / UV" align="center" key="pvUv" :render-header="renderHeader">
+            <template slot-scope="{ row }">
+              <div class="pv-uv-download">
+                <span>{{ row.Pv }}/{{ row.Uv }}</span>
+                <span>&nbsp;&nbsp;+&nbsp;&nbsp;{{ row.ClPv }}/{{ row.ClUv }}</span>
+                <a :href="`${exportPvUv}${row.ArticleId}&${token}`" download>
+                  <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+                </a>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column key="collection" align="center" label="收藏数" min-width="80">
+            <template slot-scope="scope">
+              <span class="editsty" @click="collectionIsShow(scope.row.ArticleId, '收藏')">{{ scope.row.CollectionNum }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column v-if="tabs_index == 1" key="ask" width="60" label="留言" align="center">
+            <template slot-scope="scope">
+              <span @click="inquireBtn(scope.row.ArticleId)" class="editsty">{{ scope.row.CommentNum }}</span>
+            </template>
+          </el-table-column>
+          <!-- 其他的操作 -->
+          <el-table-column align="center" label="操作" min-width="120">
+            <template slot-scope="scope">
+              <div v-if="scope.row.SubCategoryName == '专项调研'">
+                <span class="editsty" @click="operationBtn(scope.row.ArticleId, '发布')">{{ scope.row.PublishStatus == 0 ? "发布" : "取消发布" }} &nbsp;&nbsp;</span>
+                <span class="editsty" @click="addSummary(scope.row.ArticleId)">编辑 &nbsp;&nbsp;</span>
+                <span class="deletesty" v-if="scope.row.PublishStatus == 0" @click="operationBtn(scope.row.ArticleId, '删除')">删除 &nbsp;&nbsp;</span>
+              </div>
+              <div v-else>
+                <el-button type="text" v-if="(tabs_index == 0 || tabs_index == 2) && IsShowButton" @click="classifyBtn(scope.row)">归类</el-button>
+                <el-button type="text" v-if="scope.row.ShowButton && tabs_index == 1 && IsShowButton" @click="classifyBtn(scope.row)">修改归类</el-button>
+                <el-button type="text" v-if="scope.row.ShowButton && (tabs_index == 0 || tabs_index == 1) && IsShowButton" @click="filtrationBtn(scope.row.ReportId)">过滤</el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-col :span="24" class="toolbar">
+          <m-page :total="total" :page_no="page_no" :pageSize="8" @handleCurrentChange="handleCurrentChange" />
+        </el-col>
+      </div>
+    </el-card>
+    <!-- 弹框部分 -->
+    <el-dialog
+      v-dialogDrag
+      :modal-append-to-body="false"
+      :center="true"
+      :close-on-press-escape="true"
+      :close-on-click-modal="false"
+      :visible.sync="dialogVisible"
+      width="561px"
+      @close="classifyDelete"
+    >
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="$icons.report" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">报告归类</span>
+      </div>
+      <el-form :model="chartPermissionPost" :rules="rules" ref="ruleForm">
+        <el-form-item prop="IndustrialManagementId">
+          <el-select clearable placeholder="请选择所属产业" style="width: 100%" filterable @clear="clearSelectChart" @change="chartPermissionPostChange" multiple v-model="chartPermissionPostOptins">
+            <el-option v-for="item in idustrialManagement" :label="item.IndustryName" :key="item.IndustrialManagementId" :value="item.IndustrialManagementId"></el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <el-select placeholder="请选择关联标的" v-model="optionS" style="width: 100%; margin-bottom: 40px; margin-top: 30px" @change="optionsChange" @focus="getIndustrialSubject" multiple clearable>
+        <el-option v-for="item in listSubject" :label="item.SubjectName" :key="item.IndustrialSubjectId" :value="item.IndustrialSubjectId"></el-option>
+      </el-select>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="classifyClick">保存</el-button>
+        <el-button @click="classifyDelete">取消</el-button>
+      </span>
+    </el-dialog>
+    <el-dialog
+      :modal-append-to-body="false"
+      :center="true"
+      :close-on-press-escape="false"
+      :close-on-click-modal="false"
+      :visible.sync="dialogAddindustry"
+      width="460px"
+      title="修改匹配类型"
+      @close="btnCancel"
+    >
+      <div style="margin-bottom: 40px">
+        <el-select v-model="modificationValue" placeholder="请选择" style="width: 380px">
+          <el-option v-for="item in modificationOptions" :key="item.MatchID" :label="item.MatchTypeName" :value="item.MatchID"> </el-option>
+        </el-select>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="modificationClick">保存</el-button>
+        <el-button @click="btnCancel">取消</el-button>
+      </span>
+    </el-dialog>
+    <focus-collection :collectionDlgShow="collectionDlgShow" :collectionId="collectionId" :collectionType="collectionType" />
+    <generation-ask :generaitondialogVisib.sync="generaitondialogVisib" :generaitonId="generaitonId" :generaitonType="generaitonType" />
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import GenerationAsk from "../components/generationAsk.vue";
+import FocusCollection from "../components/focusCollection.vue";
+import mPage from "@/components/mPage.vue";
+export default {
+  name: "",
+  components: { mPage, FocusCollection, GenerationAsk },
+  props: {},
+  data() {
+    return {
+      page_no: 1,
+      exchange: "未归类",
+      optionS: [],
+      dialogVisible: false,
+      themeList: [], //主题的数组
+      MatchTypeNameList: [], //报告类型
+      idustrialManagement: [], //产业的数组
+      listFrom: {
+        //获取列表的数据
+        PageSize: 8,
+        CurrentIndex: 1,
+        KeyWord: "", //搜索关键词
+        SubCategoryName: "", //主题
+        MatchTypeName: "", //匹配类型
+        IsClass: 1, //"是否归类 1是、0否"
+        IsFilter: 0, //"是否过滤 1是、0否"
+        ChartPermissionId: "", //行业ID
+        IndustrialManagementId: "", //产业ID
+        PublishDate: "", //时间
+        relevance: "", //关联
+        reportLabel: "", //报告标签
+      },
+      createdate: "",
+      getList: [], //获取到列表的数组
+      total: null,
+      listSubject: [], //标的数组
+      chartPermissionList: [], //产业
+      chartPermissionPost: {
+        IndustrialManagementId: "", //产业ID
+        IndustrialSubjectIdStr: "0", //标的ID
+        ReportId: null, //报告ID
+      },
+      chartPermissionPostOptins: [],
+      rules: {
+        IndustrialManagementId: [{ required: true, message: "请先选择行业", trigger: "change" }],
+      },
+      IsShowButton: true, //是否展示操作按钮
+      dialogAddindustry: false, //
+      modificationValue: "",
+      modificationId: "",
+      modificationOptions: [],
+      exportUser: process.env.API_ROOT + "/cygx/reportArticle/export?ReportId=",
+      auto: localStorage.getItem("auth") || "",
+      tabsList: [
+        { name: "已归类报告", query: "已归类", index: 1 },
+        { name: "未归类报告", query: "未归类", index: 0 },
+        { name: "过滤报告", query: "过滤", index: 2 },
+      ],
+      tabs_index: 1,
+      status: "", //状态
+      options: [
+        { id: 1, name: "已发布" },
+        { id: 0, name: "未发布" },
+      ],
+      collectionDlgShow: false, //关注 收藏 隐显
+      collectionId: "", //关注 收藏 id
+      collectionType: "", //关注 收藏 类型区分
+      token: localStorage.getItem("auth") || "",
+      generaitondialogVisib: false, //留言的弹框
+      generaitonId: "",
+      generaitonType: "已归类",
+    };
+  },
+  computed: {
+    sta() {
+      return this.status === 0 ? this.status : this.status === 1 ? this.status : 2;
+    },
+    exportPvUv() {
+      return process.env.API_ROOT + "/cygx/summaryManage/articleHistoryExport?ArticleId=";
+    },
+  },
+  created() {},
+  mounted() {
+    if (sessionStorage.getItem("appletsReportPageBack")) {
+      let { tabsIndex, page, KeyWord, ChartPermissionId, SubCategoryName, MatchTypeName, IndustrialManagementId, relevance, reportLabel, createdate, IsClass, IsFilter, chartPermissionList } =
+        JSON.parse(sessionStorage.getItem("appletsReportPageBack"));
+      this.tabs_index = tabsIndex;
+      this.page_no = page;
+      this.createdate = createdate;
+      this.chartPermissionList = chartPermissionList;
+      this.listFrom = {
+        PageSize: 8,
+        CurrentIndex: 1,
+        KeyWord, //搜索关键词
+        SubCategoryName, //主题
+        MatchTypeName, //匹配类型
+        IsClass, //"是否归类 1是、0否"
+        IsFilter, //"是否过滤 1是、0否"
+        ChartPermissionId, //行业ID
+        IndustrialManagementId, //产业ID
+        PublishDate: "", //时间
+        relevance, //关联
+        reportLabel, //报告标签
+      };
+    }
+    this.reportArticle();
+    this.getshowButton();
+    this.chartPermission();
+  },
+  methods: {
+    //输入框的input 事件
+    listFromInput() {
+      this.page_no = 1;
+      this.reportArticle();
+    },
+    //是否展示操作按钮接口
+    getshowButton() {
+      raiInterface.getshowButton().then((res) => {
+        if (res.Ret === 200) {
+          this.IsShowButton = res.Data.IsShowButton;
+        }
+      });
+    },
+    //table表头自定义
+    renderHeader(h, { column, $index }) {
+      return h("div", { attrs: { style: "padding:0;" } }, [
+        h("span", column.label),
+        h("el-tooltip", { props: { placement: "top" } }, [
+          h("p", { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } }, "pv：报告被打开的次数，每次打开都计算一次（只统计有权限用户）"),
+          h("p", { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } }, "uv：访问报告的人数，每篇报告同一个人访问只计算一次（只统计有权限用户）"),
+          h("el-button", { props: { icon: "el-icon-info" }, attrs: { style: "border:none;background:none;pading:2px" } }, ""),
+        ]),
+      ]);
+    },
+    //头部的tab的点击事件
+    tabActive(item) {
+      this.cutClick();
+      if (item.index !== this.tabs_index) {
+        this.tabs_index = item.index;
+      }
+      this.exchange = item.query;
+      this.chartPermissionList = [];
+      this.listFrom.IsClass = this.exchange == "已归类" ? 1 : 0;
+      this.listFrom.IsFilter = this.exchange == "过滤" ? 1 : 0;
+      this.page_no = 1;
+      this.reportArticle();
+      this.chartPermission();
+    },
+    //点击归类
+    classifyBtn(item) {
+      this.chartPermissionPost.ChartPermissionId = item.ChartPermissionId;
+      this.chartPermissionPost.ReportId = item.ReportId;
+      this.dialogVisible = true;
+      let IndustrialManagementIds = [];
+      item.ListIndustrial && item.ListIndustrial.forEach((key) => IndustrialManagementIds.push(key.IndustrialManagementId));
+      this.chartPermissionPostOptins = IndustrialManagementIds;
+      if (this.chartPermissionPostOptins.length > 0) {
+        this.chartPermissionPost.IndustrialManagementId = this.chartPermissionPostOptins.join();
+        this.getIndustrialSubject();
+      }
+      this.$nextTick(() => {
+        let IndustrialSubjectIds = [];
+        item.ListSubject && item.ListSubject.forEach((key) => IndustrialSubjectIds.push(key.IndustrialSubjectId));
+        this.optionS = IndustrialSubjectIds;
+        this.optionS.length > 0 ? (this.chartPermissionPost.IndustrialSubjectIdStr = this.optionS.toString()) : "";
+      });
+      this.getIndustrialManagementDalg();
+    },
+    //点击过滤
+    filtrationBtn(ReportId) {
+      this.$confirm("过滤报告不在小程序内显示，确定继续吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          raiInterface.reportArticleFilter({ ReportId }).then((res) => {
+            if (res.Ret !== 200) return;
+            this.page_no = 1;
+            this.reportArticle();
+            this.$message({
+              type: "success",
+              message: "过滤成功!",
+            });
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消过滤",
+          });
+        });
+    },
+    //获取主题
+    reportMappingist() {
+      if (this.listFrom.ChartPermissionId == "") return;
+      raiInterface
+        .reportMappingist({
+          ChartPermissionId: this.listFrom.ChartPermissionId - 0 || this.chartPermissionPost.ChartPermissionId - 0,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          if (res.Data.List) {
+            this.themeList = res.Data.List;
+          } else {
+            this.themeList = [];
+          }
+        });
+    },
+    //获取列表
+    reportArticle() {
+      raiInterface
+        .reportArticle({
+          PageSize: this.listFrom.PageSize,
+          CurrentIndex: this.page_no,
+          IsFilter: this.listFrom.IsFilter,
+          IsClass: this.listFrom.IsClass,
+          ChartPermissionId: this.listFrom.ChartPermissionId,
+          SubCategoryName: this.listFrom.SubCategoryName,
+          MatchTypeName: this.listFrom.MatchTypeName,
+          IndustrialManagementId: this.listFrom.IndustrialManagementId,
+          KeyWord: this.listFrom.KeyWord,
+          StartDate: this.createdate[0] ? this.createdate[0] : "",
+          EndDate: this.createdate[0] ? this.createdate[1] : "",
+          KeyWordStock: this.listFrom.reportLabel,
+          ReportLabel: this.listFrom.relevance,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.getList = res.Data.List;
+          this.total = res.Data.Paging.Totals;
+        });
+    },
+    optionsChange() {
+      this.chartPermissionPost.IndustrialSubjectIdStr = this.optionS.toString();
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.reportArticle();
+    },
+    //获取行业
+    chartPermission() {
+      this.listFrom.IndustrialManagementId = "";
+      this.themeList = [];
+      this.idustrialManagement = [];
+      if (this.exchange == "已归类" || this.tabs_index == 1) {
+        //要策略
+        raiInterface
+          .chartPermission({
+            HideMacro: true,
+            IsCeLueReport: true,
+          })
+          .then((res) => {
+            if (res.Ret === 200) {
+              this.chartPermissionList = res.Data.List;
+            }
+          });
+      } else {
+        //不要策略
+        raiInterface.getNoTacticsfirst().then((res) => {
+          if (res.Ret === 200) {
+            this.chartPermissionList = res.Data.List;
+          }
+        });
+      }
+      this.listFrom.ChartPermissionId = "";
+      this.listFrom.SubCategoryName = "";
+    },
+    //获取产业
+    getIndustrialManagement() {
+      if (this.listFrom.ChartPermissionId == "") return;
+      raiInterface.getIndustrialManagement({ ChartPermissionId: this.listFrom.ChartPermissionId - 0 || this.chartPermissionPost.ChartPermissionId - 0 }).then((res) => {
+        if (res.Ret !== 200) return;
+        if (res.Data.List) {
+          this.idustrialManagement = res.Data.List;
+        } else {
+          this.idustrialManagement = [];
+        }
+      });
+    },
+    //弹窗获取产业
+    getIndustrialManagementDalg() {
+      this.listSubject = [];
+      this.optionS = [];
+      raiInterface.getIndustrialManagement({ ChartPermissionId: this.listFrom.ChartPermissionId - 0 || this.chartPermissionPost.ChartPermissionId - 0 }).then((res) => {
+        if (res.Ret !== 200) return;
+        if (res.Data.List) {
+          this.idustrialManagement = res.Data.List;
+        } else {
+          this.idustrialManagement = [];
+        }
+      });
+    },
+    //弹窗获取标的
+    getIndustrialSubject() {
+      if (this.chartPermissionPost.IndustrialManagementId == "") return;
+      raiInterface.getindustrialSubjectlistIds({ IndustrialManagementIdStr: this.chartPermissionPost.IndustrialManagementId }).then((res) => {
+        if (res.Ret !== 200) return;
+        if (res.Data.List) {
+          this.listSubject = res.Data.List;
+        } else {
+          this.listSubject = [];
+        }
+      });
+    },
+    //弹窗产业的change事件
+    chartPermissionPostChange() {
+      this.chartPermissionPost.IndustrialManagementId = this.chartPermissionPostOptins.join();
+    },
+    //报告类型
+    reportMappingMatchTypeRep() {
+      if (!this.listFrom.ChartPermissionId) return this.$message.error("请先选择行业");
+      raiInterface
+        .reportMappingMatchTypeRep({
+          ChartPermissionId: this.listFrom.ChartPermissionId,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.MatchTypeNameList = res.Data.List;
+        });
+    },
+    //报告归类确定事件
+    classifyClick() {
+      this.$refs.ruleForm.validate((value) => {
+        if (value) {
+          raiInterface.reportArticleClassification(this.chartPermissionPost).then((res) => {
+            if (res.Ret == 200) {
+              this.$message.success("报告归类成功!");
+              this.reportArticle();
+            }
+            this.chartPermissionPost = {
+              IndustrialManagementId: "", //产业ID
+              IndustrialSubjectIdStr: "0", //标的ID
+              ReportId: null, //报告ID
+            };
+            this.chartPermissionPostOptins = [];
+            this.optionS = [];
+            this.dialogVisible = false;
+            this.$refs.ruleForm.resetFields();
+          });
+        }
+      });
+    },
+    //弹窗的取消事件
+    classifyDelete() {
+      this.listSubject = [];
+      this.optionS = [];
+      this.chartPermissionPostOptins = [];
+      this.chartPermissionPost.IndustrialManagementId = "";
+      this.chartPermissionPost = {
+        IndustrialManagementId: "", //产业ID
+        IndustrialSubjectIdStr: "0", //标的ID
+        ReportId: null, //报告ID
+      };
+      this.dialogVisible = false;
+      this.$refs.ruleForm.resetFields();
+    },
+    //所有筛选条件的change事件
+    listChangeBtn() {
+      this.page_no = 1;
+      this.reportArticle();
+    },
+    //头部不同报告的点击事件
+    cutClick() {
+      this.listFrom = {
+        //获取列表的数据
+        PageSize: 8,
+        CurrentIndex: 1,
+        KeyWord: "", //搜索关键词
+        SubCategoryName: "", //主题
+        MatchTypeName: "", //匹配类型
+        IsClass: 0, //"是否归类 1是、0否"
+        IsFilter: 0, //"是否过滤 1是、0否"
+        ChartPermissionId: "", //行业ID
+        IndustrialManagementId: "", //产业ID
+      };
+      this.status = "";
+    },
+    //文章详情
+    async lookDetail(item) {
+      if (item.PublishStatus === 1) {
+        let href = `${process.env.CYGX_WEB}/material/info/${item.ArticleId}`;
+        window.open(href, "_blank");
+      } else {
+        const res = await raiInterface.reportArticleDetail({ ArticleId: item.ArticleId });
+        if (res.Ret === 200) {
+          sessionStorage.setItem("summaryPre", JSON.stringify(res.Data));
+          let { href } = this.$router.resolve({ name: "预览研选报告" });
+          window.open(href, "_blank");
+        }
+      }
+    },
+    //筛选行业的清除事件
+    clearSelect() {
+      this.themeList = [];
+      this.idustrialManagement = [];
+      this.listFrom.IndustrialManagementId = "";
+      this.listFrom.ChartPermissionId = "";
+      this.listFrom.SubCategoryName = "";
+    },
+    //弹窗产业的清除事件
+    clearSelectChart() {
+      this.optionS = [];
+      this.chartPermissionPost.IndustrialManagementId = "";
+      this.listSubject = [];
+    },
+    //修改匹配类型
+    modification(id) {
+      this.modificationId = id;
+      raiInterface
+        .getMatchTypeName({
+          ReportId: id,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.modificationOptions = res.Data.List;
+          }
+        });
+      this.dialogAddindustry = true;
+    },
+    // 取消 匹配类型
+    btnCancel() {
+      this.modificationId = "";
+      this.modificationValue = "";
+      this.modificationOptions = "";
+      this.dialogAddindustry = false;
+    },
+    // 修改 匹配类型
+    modificationClick() {
+      raiInterface
+        .updateMatchTypeName({
+          MatchID: Number(this.modificationValue),
+          ReportId: this.modificationId,
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            this.$message.success("修改成功");
+            this.modificationId = "";
+            this.modificationValue = "";
+            this.modificationOptions = "";
+            this.dialogAddindustry = false;
+            this.page_no = 1;
+            this.reportArticle();
+          }
+        });
+    },
+    //收藏  点击事件
+    collectionIsShow(id, type) {
+      this.collectionId = id; //关注 收藏 id
+      this.collectionType = type; //关注 收藏 类型区分
+      this.collectionDlgShow = true;
+    },
+    // 点击添加报告
+    addSummary(id = "") {
+      this.$router.push({
+        path: id ? "editSummaryHz" : "/addSummaryHz",
+        query: {
+          type: "HZ",
+          id,
+        },
+      });
+    },
+    //操作按键 发布 取消发布 删除
+    operationBtn(id, value) {
+      this.$confirm(`确定${value}该报告吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          if (value == "删除") {
+            const res = await raiInterface.getsummaryManagedelete({ ArticleId: id });
+            if (res.Ret !== 200) return;
+            this.$message.success("删除成功！");
+            let page_num = Math.ceil((this.total - 1) / this.PageSize);
+            if (this.page_no > page_num) {
+              this.page_no = page_num;
+            }
+            this.reportArticle();
+          } else {
+            const res = await raiInterface.publishAndCancel({ ArticleId: id });
+            if (res.Ret !== 200) return;
+            this.$message.success(`${value}成功！`);
+            this.reportArticle();
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消${value}`,
+          });
+        });
+    },
+    //点击代问的弹框
+    inquireBtn(id) {
+      this.generaitondialogVisib = true;
+      this.generaitonId = id;
+    },
+  },
+  beforeRouteLeave(to, from, next) {
+    let obj = {
+      tabsIndex: this.tabs_index,
+      page: this.page_no,
+      KeyWord: this.listFrom.KeyWord,
+      ChartPermissionId: this.listFrom.ChartPermissionId,
+      SubCategoryName: this.listFrom.SubCategoryName,
+      MatchTypeName: this.listFrom.MatchTypeName,
+      IndustrialManagementId: this.listFrom.IndustrialManagementId,
+      relevance: this.listFrom.relevance,
+      reportLabel: this.listFrom.reportLabel,
+      createdate: this.createdate,
+      IsFilter: this.listFrom.IsFilter,
+      IsClass: this.listFrom.IsClass,
+      chartPermissionList: this.chartPermissionList,
+    };
+    sessionStorage.setItem("appletsReportPageBack", JSON.stringify(obj));
+    next();
+  },
+  beforeRouteEnter(to, from, next) {
+    if (from.path != "/addSummaryHz" && from.path != "/editSummaryHz") {
+      sessionStorage.removeItem("appletsReportPageBack");
+    }
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-applets {
+  .top-card-box {
+    margin-bottom: 20px;
+  }
+  .top-card {
+    display: flex;
+    justify-content: space-between;
+    .tab_active {
+      background-color: #409eff;
+      color: #fff;
+    }
+    span {
+      display: inline-block;
+      box-sizing: border-box;
+      padding: 0 24px;
+      line-height: 38px;
+      height: 40px;
+      background: #ecf5ff;
+      border: 1px solid #b3d8ff;
+      opacity: 1;
+      font-weight: 500;
+      font-size: 16px;
+      color: #409eff;
+      border-radius: 4px;
+      margin-right: 30px;
+      cursor: pointer;
+    }
+  }
+  .screen-box {
+    display: flex;
+    justify-content: space-between;
+    .el-select {
+      margin-right: 25px;
+    }
+  }
+  .title-table {
+    color: #409eff !important;
+  }
+  .mx-datepicker {
+    width: 220px !important;
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/components/addHaveReport.vue

@@ -0,0 +1,375 @@
+<template>
+  <div class="container-summary">
+    <el-form :model="addOfEditForm" :rules="rulesOption" ref="addOfEditForm">
+      <el-card class="card-top">
+        <el-form-item prop="regions">
+          <el-input placeholder="标题栏名称（限10字以内)" :maxlength="10" clearable v-model="addOfEditForm.regions" style="width: 360px"> </el-input>
+        </el-form-item>
+        <el-form-item prop="title">
+          <el-input style="width: 360px" clearable v-model="addOfEditForm.title" placeholder="请输入报告标题"></el-input>
+        </el-form-item>
+        <el-form-item prop="publishTime">
+          <el-date-picker style="width: 360px" v-model="addOfEditForm.publishTime" type="date" placeholder="请选择发布时间" format="yyyy-MM-dd" value-format="yyyy-MM-dd"> </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-input style="width: 360px" clearable v-model="addOfEditForm.department" placeholder="请输入作者(选填)"></el-input>
+        </el-form-item>
+        <el-form-item prop="industry">
+          <el-select placeholder="请选择行业" style="width: 360px" clearable v-model="addOfEditForm.industry" @change="industryChangeHandler">
+            <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId" />
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="property">
+          <el-select v-model="addOfEditForm.property" multiple placeholder="请选择关联产业（选填）" @change="propertyChangeHandler" clearable filterable style="width: 360px">
+            <el-option :label="item.IndustryName" :value="item.IndustrialManagementId" v-for="item in selectedIndustryArr" :key="item.IndustrialManagementId" />
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="subject">
+          <el-select v-model="addOfEditForm.subject" multiple placeholder="请选择关联标的（选填）" clearable filterable style="width: 360px">
+            <el-option v-for="item in subjectData" :key="item.IndustrialSubjectId" :label="item.SubjectName" :value="item.IndustrialSubjectId" />
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="matchTypeName">
+          <el-select v-model="addOfEditForm.matchTypeName" placeholder="请选择报告类型" clearable filterable style="width: 360px">
+            <el-option v-for="item in matchTypeNameList" :label="item.MatchTypeName" :key="item.Id" :value="item.Id" />
+          </el-select>
+          <img src="~@/assets/img/set_m/add_ico.png" style="margin: 5px 0px 0 10px" @click="addMatchTypeDlgIsShow" />
+        </el-form-item>
+        <el-form-item>
+          <el-input style="width: 755px" clearable v-model="addOfEditForm.synopsis" placeholder="请输入摘要(选填)"></el-input>
+        </el-form-item>
+        <froala id="froala-editor" ref="froalaEditor" :tag="'textarea'" :config="froalaConfig" v-model="addOfEditForm.content"></froala>
+        <div class="form-item-bootm">
+          <el-button type="primary" @click="submitForm('保存')">保存</el-button>
+          <el-button type="primary" @click="submitForm('发布')" v-if="isShowStatus">发布</el-button>
+          <el-button @click="cancelBtn">取消</el-button>
+        </div>
+      </el-card>
+    </el-form>
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="新建报告类型" :visible.sync="addMatchTypeDlg" :before-close="confirmMatchType" width="500px">
+      <p style="margin-bottom: 10px">所属行业：{{ dlgTextRender }}</p>
+      <el-form :model="addMatchTypeData" :rules="matchTypeRules" ref="addMatchTypeData">
+        <el-form-item prop="type">
+          <el-radio-group v-model="addMatchTypeData.type">
+            <el-radio :label="2">产业报告</el-radio>
+            <el-radio :label="1">行业综述报告</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item prop="name">
+          <el-input style="width: 100%" clearable v-model="addMatchTypeData.name" placeholder="输入类型名称"></el-input>
+        </el-form-item>
+      </el-form>
+      <div class="form-item-bootm" style="margin-bottom: 30px">
+        <el-button type="primary" @click="addMatchSubmitForm">确定</el-button>
+        <el-button @click="confirmMatchType">取消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import RichTextMixins from "../../components/reportComponents/RichTextMixins";
+export default {
+  name: "",
+  data() {
+    return {
+      addOfEditForm: {
+        content: "",
+        title: "",
+        synopsis: "",
+        department: "", // 作者
+        regions: "",
+        publishTime: "",
+        industry: "", //行业
+        property: [], //产业
+        subject: [], // 标的
+        matchTypeName: "", //报告类型
+      },
+      rulesOption: {
+        regions: [{ required: true, message: "请输入标题栏名称（限10字以内）", trigger: "blur" }],
+        title: [{ required: true, message: "请输入标题", trigger: "blur" }],
+        publishTime: [{ required: true, message: "请选择发布时间", trigger: "change" }],
+        industry: [{ required: true, message: "请选择行业", trigger: "change" }],
+        matchTypeName: [{ required: true, message: "请选择报告类型", trigger: "change" }],
+      },
+      chartPermissionList: [], //行业的数组
+      selectedIndustryArr: [], //产业的数组
+      subjectData: [], //标的的数组
+      matchTypeNameList: [], //报告类型的数组
+      isShowStatus: true,
+      addMatchTypeDlg: false,
+      addMatchTypeData: {
+        name: "",
+        type: "",
+      },
+      matchTypeRules: {
+        name: [{ required: true, message: "输入类型名称", trigger: "blur" }],
+        type: [{ required: true, message: "请选择类型归属", trigger: "change" }],
+      },
+      dlgTextRender: "",
+      timeInterval: null,
+    };
+  },
+  mixins: [RichTextMixins],
+  computed: {},
+  created() {},
+  mounted() {
+    if (this.$route.query.id) {
+      // 编辑进来的
+      this.getDetail();
+    } else {
+      this.dataInit();
+    }
+    this.chartPermission();
+  },
+  methods: {
+    // 报告的缓存处理数据
+    dataInit() {
+      if (sessionStorage.getItem("addHaveReportQY")) {
+        let data = JSON.parse(sessionStorage.getItem("addHaveReportQY"));
+        setTimeout(async () => {
+          this.addOfEditForm = {
+            regions: data.Detail.ColumnName,
+            content: data.Detail.Body,
+            title: data.Detail.Title,
+            synopsis: data.Detail.Abstract,
+            department: data.Detail.Department,
+            publishTime: data.Detail.PublishTime,
+            property: data.Detail.ListIndustrial,
+            subject: data.Detail.ListSubject,
+            industry: data.Detail.ChartPermissionId,
+            matchTypeName: data.Detail.MatchTypeId,
+          };
+          this.isShowStatus = data.Detail.Status == 0;
+          await this.industryChangeHandler();
+          await this.propertyChangeHandler();
+        }, 200);
+      }
+      this.timeInterval = setInterval(() => {
+        let params = {
+          PublishTime: this.addOfEditForm.publishTime,
+          ColumnName: this.addOfEditForm.regions,
+          Title: this.addOfEditForm.title,
+          Abstract: this.addOfEditForm.synopsis,
+          Department: this.addOfEditForm.department,
+          Body: this.addOfEditForm.content,
+          IndustrialManagementIds: this.addOfEditForm.property,
+          IndustrialSubjectIds: this.addOfEditForm.subject,
+          ChartPermissionId: this.addOfEditForm.industry,
+          MatchTypeId: this.addOfEditForm.matchTypeName,
+        };
+        sessionStorage.setItem("addHaveReportQY", JSON.stringify(params));
+      }, 120000);
+    },
+    // 产业的change事件
+    propertyChangeHandler(val) {
+      if (this.addOfEditForm.property && this.addOfEditForm.property.length) {
+        if (val) {
+          this.subjectData = [];
+          this.addOfEditForm.subject = [];
+        }
+        this.getSubjectList();
+      } else {
+        this.subjectData = [];
+        this.addOfEditForm.subject = [];
+      }
+    },
+    // 行业的change事件
+    industryChangeHandler(value) {
+      if (this.addOfEditForm.industry) {
+        if (value) {
+          this.industryDataInit();
+        }
+        this.getIndustryList();
+        this.getMatchTypeNameList();
+        this.chartPermissionList.forEach((item) => item.ChartPermissionId === this.addOfEditForm.industry && (this.dlgTextRender = item.PermissionName));
+      } else {
+        this.industryDataInit();
+      }
+    },
+    // 行业的筛选框发生change事件后 清理联动的数据
+    industryDataInit() {
+      this.selectedIndustryArr = [];
+      this.addOfEditForm.property = "";
+      //关联报告
+      this.matchTypeNameList = [];
+      this.addOfEditForm.matchTypeName = "";
+      this.dlgTextRender = "";
+      this.subjectData = [];
+      this.addOfEditForm.subject = [];
+    },
+    //添加报告类型
+    addMatchTypeDlgIsShow() {
+      if (!this.addOfEditForm.industry) return this.$message.error("请先选择行业");
+      this.addMatchTypeDlg = true;
+    },
+    //获取报告类型
+    async getMatchTypeNameList() {
+      const res = await raiInterface.reportMappingMatchTypeRep({
+        ChartPermissionId: this.addOfEditForm.industry,
+      });
+      if (res.Ret !== 200) return;
+      this.matchTypeNameList = res.Data.List || [];
+    },
+    // 获取标的
+    async getSubjectList() {
+      const res = await raiInterface.getindustrialSubjectlistIds({
+        IndustrialManagementIdStr: this.addOfEditForm.property.join(","),
+      });
+      if (res.Ret === 200) {
+        this.subjectData = res.Data.List || [];
+      }
+    },
+    // 获取产业
+    async getIndustryList() {
+      const res = await raiInterface.getIndustrialManagement({
+        ChartPermissionId: this.addOfEditForm.industry,
+      });
+      if (res.Ret === 200) {
+        this.selectedIndustryArr = res.Data.List || [];
+      }
+    },
+    //获取行业
+    async chartPermission() {
+      const res = await raiInterface.reportChartPermissionFirstProduct();
+      if (res.Ret === 200) {
+        this.chartPermissionList = res.Data.List || [];
+      }
+    },
+    //进来编辑的 获取内容的事件
+    async getDetail() {
+      const res = await raiInterface.internalProductInteriorDetail({
+        ProductInteriorId: Number(this.$route.query.id),
+      });
+      if (res.Ret !== 200) return;
+      this.addOfEditForm = {
+        regions: res.Data.Detail.ColumnName,
+        content: res.Data.Detail.Body,
+        title: res.Data.Detail.Title,
+        synopsis: res.Data.Detail.Abstract,
+        department: res.Data.Detail.Department,
+        publishTime: res.Data.Detail.PublishTime,
+        property: res.Data.Detail.ListIndustrial ? res.Data.Detail.ListIndustrial.map((item) => item.IndustrialManagementId) : [],
+        subject: res.Data.Detail.ListSubject ? res.Data.Detail.ListSubject.map((item) => item.IndustrialSubjectId) : [],
+        industry: res.Data.Detail.ChartPermissionId,
+        matchTypeName: res.Data.Detail.MatchTypeId,
+      };
+      this.isShowStatus = res.Data.Detail.Status == 0;
+      await this.industryChangeHandler();
+      await this.propertyChangeHandler();
+    },
+    //表单保存发布事件
+    submitForm: _.debounce(async function (type) {
+      this.$refs.addOfEditForm.validate(async (valid) => {
+        if (valid) {
+          let params = {
+            ProductInteriorId: this.$route.query.id ? Number(this.$route.query.id) : 0,
+            DoType: type == "保存" ? 0 : 1,
+            PublishTime: this.addOfEditForm.publishTime,
+            ColumnName: this.addOfEditForm.regions,
+            Title: this.addOfEditForm.title,
+            Abstract: this.addOfEditForm.synopsis,
+            Department: this.addOfEditForm.department,
+            Body: this.addOfEditForm.content.replace(/<p data-f-id=\"pbf\".*?<\/p>/g, ""),
+            IndustrialManagementIds: this.addOfEditForm.property ? this.addOfEditForm.property.join(",") : "",
+            IndustrialSubjectIds: this.addOfEditForm.subject ? this.addOfEditForm.subject.join(",") : "",
+            ChartPermissionId: this.addOfEditForm.industry,
+            MatchTypeId: this.addOfEditForm.matchTypeName,
+          };
+          const res = await raiInterface.internalPreserveAndPublish(params);
+          if (res.Ret === 200) {
+            this.$message.success("操作成功！");
+            clearInterval(this.timeInterval);
+            sessionStorage.removeItem("addHaveReportQY");
+            this.$refs.addOfEditForm.resetFields();
+            this.$router.push("/internalTesting");
+          }
+        }
+      });
+    }, 500),
+    //表单取消事件
+    cancelBtn() {
+      clearInterval(this.timeInterval);
+      sessionStorage.removeItem("addHaveReportQY");
+      this.$refs.addOfEditForm.resetFields();
+      this.$router.push("/internalTesting");
+    },
+    // 新增报告类型的确定事件
+    addMatchSubmitForm() {
+      this.$refs.addMatchTypeData.validate(async (valid) => {
+        if (valid) {
+          console.log("ok");
+          const res = await raiInterface.reportMappingAdd({
+            ReportType: this.addMatchTypeData.type,
+            MatchTypeName: this.addMatchTypeData.name,
+            ChartPermissionId: this.addOfEditForm.industry,
+            ChartPermissionName: this.dlgTextRender,
+          });
+          if (res.Ret === 200) {
+            await this.getMatchTypeNameList();
+            this.$message.success("添加成功");
+            this.addOfEditForm.matchTypeName = res.Data.Id;
+            this.confirmMatchType();
+          }
+        }
+      });
+    },
+    //关闭弹框事件
+    confirmMatchType() {
+      this.addMatchTypeDlg = false;
+      this.$refs.addMatchTypeData.resetFields();
+      this.addMatchTypeData = {
+        name: "",
+        type: "",
+      };
+    },
+  },
+  // 路由离开了 清除定时器
+  beforeRouteLeave(to, from, next) {
+    clearInterval(this.timeInterval);
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-summary {
+  .card-top {
+    .el-card__body {
+      padding-bottom: 0 !important;
+    }
+    .el-form-item {
+      display: inline-block;
+      margin-right: 30px;
+    }
+    .inline-input {
+      margin-right: 10px;
+    }
+    .el-input {
+      width: 360px;
+    }
+  }
+  .fr-second-toolbar {
+    display: none;
+  }
+  .report-link {
+    display: flex;
+    align-items: center;
+    .report-word {
+      flex-shrink: 0;
+    }
+    .el-input {
+      display: inline-block;
+    }
+  }
+  .form-item-bootm {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-top: 50px;
+    .el-button {
+      margin-right: 20px;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/components/appIndustry.vue

@@ -0,0 +1,785 @@
+<template>
+  <div class="container container-industry">
+    <el-card>
+      <div class="top-card-box">
+        <div class="tabs-box">
+          <span v-for="item in listOne" :key="item.ChartPermissionId" @click="tabsBoxBtn(item)" :class="tabActiveFrom.PermissionName == item.PermissionName ? 'pitch' : ''">{{
+            item.PermissionName
+          }}</span>
+        </div>
+        <div class="card-box">
+          <div class="editsty" @click="dialogVisibleSubject = true">查询标的</div>
+          <a :href="exportUser" download>
+            <el-button type="primary">全局预览</el-button>
+          </a>
+        </div>
+      </div>
+    </el-card>
+    <!-- 产业分类 -->
+    <el-card>
+      <div style="padding-bottom: 30px" class="tabs-box-top" @click="detailShowHandel">
+        <p style="color: #333333; font-size: 16px">产业分类</p>
+        <el-tabs v-model="activeName" @tab-click="handleClick">
+          <el-tab-pane label="按添加时间排序" name="AddTime"></el-tab-pane>
+          <el-tab-pane label="按推荐指数排序" name="Recommended"></el-tab-pane>
+          <el-tab-pane label="按报告更新排序" name="ReportTime"></el-tab-pane>
+        </el-tabs>
+        <div style="width: 60%"></div>
+      </div>
+      <div class="classification" style="padding-bottom: 130px" @click="detailShowHandel">
+        <div
+          v-for="item in industryList"
+          :key="item.IndustrialManagementId"
+          class="industrial"
+          @click="ificationIndustrialBtn(item)"
+          :class="[industryActiveFrom.IndustrialManagementId == item.IndustrialManagementId ? 'pitch' : '']"
+        >
+          <span style="margin-right: 19px">{{ item.IndustryName }}（{{ item.RecommendedIndex }}）</span>
+          <span style="justify-content: flex-end" v-if="industryActiveFrom.IndustrialManagementId == item.IndustrialManagementId">
+            <img v-if="tabActiveFrom.ChartPermissionId == 31" src="~@/assets/img/rai_m/rai_move_icon.png" style="width: 12px; height: 12px; margin-right: 10px" @click.stop="moveHzcoverHandler(item)" />
+            <img src="~@/assets/img/icons/edit1.png" alt="" style="width: 12px; height: 12px; margin-right: 10px" @click.stop="industryAddOfEdit(item)" />
+            <i class="el-icon-close" @click.stop="deleteClassify(item)"></i>
+          </span>
+          <div class="label-tag-item">
+            <span v-if="item.HzCover" style="background: #ffab31">弘则覆盖</span>
+            <span v-if="!item.IsRelevance" style="background: #d74f4f">无关联报告/活动</span>
+          </div>
+          <div class="content-industrial" v-if="industryActiveFrom.IndustrialManagementId == item.IndustrialManagementId && isShowDetail" @click.stop>
+            <p v-if="detailData.LayoutTime">布局时间：{{ detailData.LayoutTime }}</p>
+            <p v-if="detailData.ArtTotalNum">报告总数：{{ detailData.ArtTotalNum }}</p>
+            <p v-for="(item, index) in detailData.List" :key="index">{{ item.MatchTypeName }}：{{ item.ArtNum }}</p>
+            <div class="content-sjx"></div>
+          </div>
+        </div>
+        <!-- 单独的添加 -->
+        <div class="addIndustrial" @click="industryAddOfEdit('', '添加产业')">
+          <i class="el-icon-plus"></i>
+          <span>添加产业</span>
+        </div>
+      </div>
+    </el-card>
+    <div v-if="isConcealHide" @click="detailShowHandel">
+      <!-- 分析师 -->
+      <el-card>
+        <p style="margin-bottom: 30px; color: #333333; font-size: 16px">分析师</p>
+        <div class="classification">
+          <div v-for="(item, index) in analystList" :key="item.IndustrialAnalystId" class="industrial" @click="analyseBtn(index)" :class="index == analyseDomain ? 'pitch' : ''">
+            <span style="margin-right: 19px">{{ item.AnalystName }}</span>
+            <span v-if="index == analyseDomain">
+              <img src="~@/assets/img/icons/edit1.png" alt="" style="width: 12px; height: 12px; marginright: 10px" @click="multiAddOfEdit(item, '', '分析师')" />
+              <i class="el-icon-close" @click="deleteIfication(item.IndustrialAnalystId)"></i>
+            </span>
+          </div>
+          <!-- 单独的添加 -->
+          <div class="addIndustrial" @click="multiAddOfEdit('', '添加分析师', '分析师')">
+            <i class="el-icon-plus"></i>
+            <span>添加分析师</span>
+          </div>
+        </div>
+      </el-card>
+      <!-- 覆盖标的 -->
+      <div class="subject-content">
+        <p style="margin-bottom: 30px; color: #333333; font-size: 16px">覆盖标的</p>
+        <div class="classification">
+          <div v-for="(item, index) in targetList" :key="item.IndustrialSubjectId" class="industrial" @click="icoverageBtn(index, item)" :class="index == icoverageDomain ? 'pitch' : ''">
+            <span style="margin-right: 19px">{{ item.SubjectName }}</span>
+            <span v-if="index == icoverageDomain">
+              <img src="~@/assets/img/icons/edit1.png" alt="" style="width: 12px; height: 12px; margin-right: 10px" @click.stop="multiAddOfEdit(item, '', '标的')" />
+              <i class="el-icon-close" @click.stop="deleteCover(item)"></i>
+            </span>
+            <div class="content-industrial" v-if="index == icoverageDomain && isShowDetailObject" @click.stop>
+              <p v-if="industrialDetail.LayoutTime">布局时间：{{ industrialDetail.LayoutTime }}</p>
+              <p v-if="industrialDetail.ArtTotalNum">报告总数：{{ industrialDetail.ArtTotalNum }}</p>
+              <p v-for="(item, index) in industrialDetail.List" :key="index">{{ item.MatchTypeName }}：{{ item.ArtNum }}</p>
+              <div class="content-sjx"></div>
+            </div>
+          </div>
+          <!-- 单独的添加 -->
+          <div class="addIndustrial" @click="multiAddOfEdit('', '添加标的', '标的')">
+            <i class="el-icon-plus"></i>
+            <span>添加标的</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- 添加/编辑 的弹框 产业、分析师、标的-->
+    <el-dialog :modal-append-to-body="false" :center="true" :close-on-press-escape="false" :close-on-click-modal="false" :visible.sync="dialogAddindustry" width="561px" @close="btnCancel">
+      <div slot="title" style="display: flex; align-items: center">
+        <img :src="dialogVisibleText ? $icons.addicon : $icons.editicon" style="color: #fff; width: 16px; height: 16px; margin-right: 5px" />
+        <span style="font-size: 16px">{{ dialogVisibleText ? dialogVisibleText : "编辑" }}</span>
+      </div>
+
+      <div>
+        <div v-if="dialogVisibleText">
+          <p class="dialogpicker" style="margin-bottom: 30px" v-if="dialogVisibleText == '添加产业'">所属行业:{{ tabActiveFrom.PermissionName }}</p>
+          <p class="dialogpicker" style="margin-bottom: 30px" v-else>所属产业:{{ industryActiveFrom.IndustryName }}</p>
+        </div>
+        <el-form :model="addOfEdit" :rules="addOfEditRules" ref="addOfEditForm" class="demo-ruleForm">
+          <template v-if="isTypeDialog == '产业'">
+            <el-form-item prop="IndustryName">
+              <el-input style="width: 100%" placeholder="请输入产业名称（最多输入10个字）" v-model="addOfEdit.IndustryName" maxlength="10"></el-input>
+            </el-form-item>
+            <el-form-item prop="RecommendedIndex">
+              <el-input style="width: 100%; margin-top: 20px" placeholder="请设置推荐指数（0-100）" v-model="addOfEdit.RecommendedIndex"></el-input>
+            </el-form-item>
+          </template>
+          <el-form-item prop="analystAnalystName" v-if="isTypeDialog == '分析师'">
+            <el-input v-model="addOfEdit.analystAnalystName" style="width: 100%" placeholder="请输入分析师名称" maxlength="6"></el-input>
+          </el-form-item>
+          <el-form-item prop="analystAnalystNameBd" v-if="isTypeDialog == '标的'">
+            <el-input v-model="addOfEdit.analystAnalystNameBd" style="width: 100%" placeholder="请输入标的名称（最多输入6个字）" maxlength="6"></el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="addOfEditConfirm">确定</el-button>
+        <el-button @click="btnCancel">取消</el-button>
+      </span>
+    </el-dialog>
+    <!-- //查询标的 -->
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="查询标的" :visible.sync="dialogVisibleSubject" width="500px" :before-close="handleCloseSubject">
+      <div>
+        <el-select style="width: 100%" v-model="addSubjectName" remote :remote-method="remoteMethod" clearable filterable @change="searchInfo" placeholder="请输入标的名称">
+          <el-option v-for="item in addSubjectOptions" :key="item.IndustrialSubjectId" :label="item.SubjectName" :value="item.SubjectName"> </el-option>
+        </el-select>
+      </div>
+      <p class="subject-text" v-if="isShowSubject">暂无数据</p>
+      <template v-else>
+        <p class="subject-text" v-for="(item, index) in nameSubjectOptions" :key="index">{{ item.Name }} : {{ item.value }}</p>
+      </template>
+      <p style="padding-bottom: 50px"></p>
+    </el-dialog>
+    <!-- //移动至弘则覆盖 -->
+    <el-dialog v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center title="移至弘则覆盖" :visible.sync="dialogCoverHz" width="500px" :before-close="handleCloseCoverHz">
+      <el-select placeholder="请选择行业" clearable v-model="industryCover" style="width: 100%; margin-bottom: 20px">
+        <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+      </el-select>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="coverHzConfirm">确定</el-button>
+        <el-button @click="handleCloseCoverHz">取消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {},
+  data() {
+    return {
+      listOne: [], //top tabs
+      tabActiveFrom: {}, //
+      activeName: "AddTime", //产业分类的 tabs
+      industryList: [], //产业的数据
+      analystList: [], //分析师
+      targetList: [], //标的
+      industryActiveFrom: {},
+      addOfEdit: {
+        IndustryName: "", //产业名称
+        RecommendedIndex: "", //推荐指数
+        analystAnalystName: "", //分析师名称
+        analystAnalystNameBd: "", //标的名称
+      },
+      addOfEditRules: {
+        IndustryName: [{ required: true, message: "请输入产业名称", trigger: "blur" }],
+        RecommendedIndex: [{ required: true, message: "请输入推荐指数", trigger: "blur" }],
+        analystAnalystName: [{ required: true, message: "请输入分析师名称", trigger: "blur" }],
+        analystAnalystNameBd: [{ required: true, message: "请输入标的名称", trigger: "blur" }],
+      },
+      dialogAddindustry: false, //
+      dialogVisibleText: "",
+      isTypeDialog: "产业",
+      industryAddOfEditForm: {}, //编辑的时候的产业
+      isConcealHide: false, //是否显示 标的 分析师
+      analyseDomain: null, //分析师
+      icoverageDomain: null, //覆盖标的
+      dialogVisibleSubject: false, //查询标的
+      addSubjectName: "", //
+      addSubjectOptions: "",
+      nameSubjectOptions: "",
+      dialogCoverHz: false, //移至弘则覆盖
+      chartPermissionList: [], //移至弘则覆盖的行业
+      industryCover: "",
+      detailData: {
+        //点击每一项后的显示
+      },
+      isShowDetail: false,
+      industrialDetail: {}, //标的的详情
+      isShowDetailObject: false, //标的的隐藏显示
+    };
+  },
+  computed: {
+    // 导出地址
+    exportUser() {
+      return process.env.API_ROOT + "/cygx/industrialManagement/export?" + localStorage.getItem("auth") || "";
+    },
+  },
+  watch: {},
+  created() {},
+  mounted() {
+    this.chartPermission();
+  },
+  methods: {
+    //获取一级分类
+    async chartPermission() {
+      const res = await raiInterface.getNoTacticsfirst();
+      if (res.Ret === 200) {
+        this.listOne = res.Data.List || [];
+        this.tabActiveFrom = this.listOne.length && this.listOne[0];
+        this.getIndustrialManagement();
+      }
+    },
+    //获取产业分类
+    async getIndustrialManagement() {
+      const res = await raiInterface.getIndustrialManagement({
+        ChartPermissionId: this.tabActiveFrom.ChartPermissionId,
+        OrderColumn: this.activeName,
+      });
+      if (res.Ret === 200) {
+        this.industryList = res.Data.List;
+      }
+    },
+    //获取分析师
+    async getIndustrialAnalyst() {
+      const res = await raiInterface.getIndustrialAnalyst({ IndustrialManagementId: this.industryActiveFrom.IndustrialManagementId });
+      if (res.Ret === 200) {
+        this.analystList = res.Data.List;
+      }
+    },
+    //获取标的
+    async getIndustrialSubject() {
+      const res = await raiInterface.getIndustrialSubject({ IndustrialManagementId: this.industryActiveFrom.IndustrialManagementId });
+      if (res.Ret === 200) {
+        this.targetList = res.Data.List;
+      }
+    },
+    //产业分类的tabs
+    handleClick() {
+      this.isConcealHide = false;
+      this.industryList = [];
+      this.getIndustrialManagement();
+      this.industryActiveFrom = {};
+    },
+    //头部tabs
+    tabsBoxBtn(item) {
+      this.tabActiveFrom = item;
+      this.isConcealHide = false;
+      this.industryList = [];
+      this.getIndustrialManagement();
+      this.industryActiveFrom = {};
+      this.activeName = "AddTime";
+    },
+    //产业的点击事件
+    async ificationIndustrialBtn(item) {
+      if (item.IndustrialManagementId) {
+        const res = await raiInterface.industrialManagementDetail({
+          IndustrialManagementId: item.IndustrialManagementId,
+        });
+        if (res.Ret !== 200) return;
+        this.detailData = res.Data;
+        this.isShowDetail = true;
+      }
+      this.analyseDomain = null;
+      this.icoverageDomain = null;
+      this.industryActiveFrom = item;
+      await this.getIndustrialAnalyst();
+      this.getIndustrialSubject();
+      this.isConcealHide = true;
+    },
+    //分析师
+    analyseBtn(index) {
+      this.analyseDomain = index;
+    },
+    //覆盖标的
+    async icoverageBtn(index, item) {
+      const res = await raiInterface.industrialSubjectCountDetail({
+        SubjectId: item.IndustrialSubjectId,
+      });
+      if (res.Ret === 200) {
+        this.industrialDetail = res.Data;
+        this.isShowDetailObject = true;
+      }
+      this.icoverageDomain = index;
+    },
+    //产业的添加或者编辑
+    industryAddOfEdit(item, text) {
+      this.isShowDetail = false;
+      if (item) {
+        this.addOfEdit.IndustryName = item.IndustryName;
+        this.addOfEdit.RecommendedIndex = item.RecommendedIndex;
+      } else {
+        this.addOfEditInit();
+      }
+      this.isTypeDialog = "产业";
+      this.industryAddOfEditForm = item;
+      this.dialogVisibleText = text;
+      this.dialogAddindustry = true;
+    },
+    //分析师 、标的
+    multiAddOfEdit(item, text, type) {
+      this.isShowDetailObject = false;
+      if (item) {
+        this.addOfEdit.analystAnalystName = item.AnalystName || "";
+        this.addOfEdit.analystAnalystNameBd = item.SubjectName || "";
+      } else {
+        this.addOfEditInit();
+      }
+      this.isTypeDialog = type;
+      this.industryAddOfEditForm = item;
+      this.dialogVisibleText = text;
+      this.dialogAddindustry = true;
+    },
+
+    //数据的格式化
+    addOfEditInit() {
+      this.addOfEdit = {
+        IndustryName: "", //产业名称
+        RecommendedIndex: "", //推荐指数
+        analystAnalystName: "", //分析师名称
+        analystAnalystNameBd: "", //标的名称
+      };
+    },
+    //添加或者编辑的确定事件
+    async addOfEditConfirm() {
+      let isValidate = this.isTypeDialog == "产业" ? ["IndustryName", "RecommendedIndex"] : this.isTypeDialog == "分析师" ? ["analystAnalystName"] : ["analystAnalystNameBd"];
+      let validateFieldList = [];
+      this.$refs.addOfEditForm.validateField(isValidate, (valid) => {
+        validateFieldList.push(valid);
+      });
+      let isPost = validateFieldList.every((item) => item === "");
+      if (this.isTypeDialog == "产业" && isPost) {
+        if (this.industryAddOfEditForm.IndustrialManagementId) {
+          //编辑产业的
+          const res = await raiInterface.industrialManagementEdit({
+            ChartPermissionId: this.tabActiveFrom.ChartPermissionId,
+            IndustryName: this.addOfEdit.IndustryName,
+            IndustrialManagementId: this.industryAddOfEditForm.IndustrialManagementId,
+            RecommendedIndex: this.addOfEdit.RecommendedIndex - 0,
+          });
+          if (res.Ret === 200) {
+            this.$message.success("添加成功");
+            this.getIndustrialManagement();
+          }
+        } else {
+          //添加
+          const res = await raiInterface.industrialManagement({
+            ChartPermissionId: this.tabActiveFrom.ChartPermissionId,
+            IndustryName: this.addOfEdit.IndustryName,
+            RecommendedIndex: this.addOfEdit.RecommendedIndex - 0,
+          });
+          if (res.Ret === 200) {
+            this.$message.success("添加成功");
+            this.getIndustrialManagement();
+          }
+        }
+        this.dialogAddindustry = false;
+      } else if (this.isTypeDialog == "分析师" && isPost) {
+        if (this.industryAddOfEditForm.IndustrialAnalystId) {
+          const res = await raiInterface.industrialAnalystEdit({
+            IndustrialManagementId: this.industryAddOfEditForm.IndustrialManagementId,
+            AnalystName: this.addOfEdit.analystAnalystName,
+            IndustrialAnalystId: this.industryAddOfEditForm.IndustrialAnalystId,
+          });
+
+          if (res.Ret === 200) {
+            this.getIndustrialAnalyst(this.industryActiveFrom.IndustrialManagementId);
+          }
+        } else {
+          const res = await raiInterface.industrialAnalyst({
+            AnalystName: this.addOfEdit.analystAnalystName,
+            IndustrialManagementId: this.industryActiveFrom.IndustrialManagementId,
+          });
+          if (res.Ret === 200) {
+            this.getIndustrialAnalyst(this.industryActiveFrom.IndustrialManagementId);
+          }
+        }
+        this.dialogAddindustry = false;
+      } else if (isPost && this.isTypeDialog == "标的") {
+        if (this.industryAddOfEditForm.IndustrialSubjectId) {
+          const res = await raiInterface.industrialSubjectEdit({
+            IndustrialManagementId: this.industryAddOfEditForm.IndustrialManagementId,
+            SubjectName: this.addOfEdit.analystAnalystNameBd,
+            IndustrialSubjectId: this.industryAddOfEditForm.IndustrialSubjectId,
+          });
+          if (res.Ret === 200) {
+            this.getIndustrialSubject(this.industryActiveFrom.IndustrialManagementId);
+          }
+        } else {
+          const res = await raiInterface.industrialSubjectAdd({
+            SubjectName: this.addOfEdit.analystAnalystNameBd,
+            IndustrialManagementId: this.industryActiveFrom.IndustrialManagementId,
+          });
+          if (res.Ret === 200) {
+            this.getIndustrialSubject(this.industryActiveFrom.IndustrialManagementId);
+          }
+        }
+        this.dialogAddindustry = false;
+      }
+    },
+    //弹框的取消事件
+    btnCancel() {
+      this.addOfEditInit();
+      this.dialogAddindustry = false;
+      this.$refs.addOfEditForm.clearValidate();
+    },
+    //分析师删除事件
+    deleteIfication(id) {
+      this.$confirm("确定要删除该分析师吗？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = await raiInterface.industrialAnalystDelete({
+            IndustrialAnalystId: id,
+          });
+          if (res.Ret !== 200) return;
+          this.getIndustrialAnalyst();
+          this.$message({
+            type: "success",
+            message: "删除成功!",
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+    //产业删除事件
+    deleteClassify(item) {
+      this.isShowDetail = false;
+      if (item.IsRelevance) {
+        this.$alert("当前产业下有关联报告或活动，请将相关报告或活动重新归类后再删除。", "提示", {
+          confirmButtonText: "知道了",
+        });
+      } else {
+        this.$confirm("确定删除该产业吗？", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            const res = await raiInterface.getIndustrialManagementDelete({
+              IndustrialManagementId: item.IndustrialManagementId,
+            });
+            if (res.Ret !== 200) return;
+            this.isConcealHide = false;
+            this.getIndustrialManagement();
+            this.$message({
+              type: "success",
+              message: "删除成功!",
+            });
+          })
+          .catch(() => {
+            this.$message({
+              type: "info",
+              message: "已取消删除",
+            });
+          });
+      }
+    },
+    //标删除事件
+    deleteCover(item) {
+      this.isShowDetailObject = false;
+      if (item.IsRelevance) {
+        this.$alert("当前标的下有关联报告或活动，请将相关报告或活动重新归类后再删除。", "提示", {
+          confirmButtonText: "知道了",
+        });
+      } else {
+        this.$confirm("确定删除该标的吗？", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(async () => {
+            const res = await raiInterface.industrialSubjectDelete({
+              IndustrialSubjectId: item.IndustrialSubjectId,
+            });
+            if (res.Ret !== 200) return;
+            this.getIndustrialSubject();
+            this.$message({
+              type: "success",
+              message: "删除成功!",
+            });
+          })
+          .catch(() => {
+            this.$message({
+              type: "info",
+              message: "已取消删除",
+            });
+          });
+      }
+    },
+    //添加标的的查询事件
+    async remoteMethod(query) {
+      if (query !== "") {
+        const res = await raiInterface.industrialSubjectSearch({
+          KeyWord: query,
+        });
+        if (res.Ret === 200) {
+          this.addSubjectOptions = res.Data.List || [];
+        }
+      }
+    },
+    //处理查询来的标的
+    async searchInfo(val) {
+      if (val !== "") {
+        const res = await raiInterface.industrialSubjectSearchInfo({
+          KeyWord: val,
+        });
+        console.log(res);
+        if (res.Ret === 200) {
+          this.isShowSubject = res.Data.List ? false : true;
+          let arrList = [];
+          arrList = res.Data.List
+            ? res.Data.List.map((item) => {
+                let arr = [];
+                item.List.forEach((key) => {
+                  arr.push(key.Name);
+                });
+                return {
+                  ...item,
+                  value: arr.join(","),
+                };
+              })
+            : [];
+          this.nameSubjectOptions = arrList;
+        }
+      } else {
+        this.nameSubjectOptions = [];
+      }
+    },
+    //查询标的的关闭事件
+    handleCloseSubject() {
+      this.nameSubjectOptions = [];
+      this.addSubjectName = "";
+      this.addSubjectOptions = [];
+      this.dialogVisibleSubject = false;
+    },
+    //点击取消详情的展示
+    detailShowHandel() {
+      this.isShowDetail = false;
+      this.isShowDetailObject = false;
+    },
+    //移至弘则覆盖
+    moveHzcoverHandler(item) {
+      this.isShowDetail = false;
+      this.dialogCoverHz = true;
+      this.getIndustryList();
+    },
+    //获取行业  移至弘则覆盖
+    async getIndustryList() {
+      const res = await raiInterface.chartPermissionFirstHaveIco();
+      if (res.Ret === 200) {
+        this.chartPermissionList = res.Data.List;
+      }
+    },
+    //关闭 移至弘则覆盖 的弹框
+    handleCloseCoverHz() {
+      this.industryCover = "";
+      this.dialogCoverHz = false;
+    },
+    //确定 移至弘则覆盖 的弹框
+    async coverHzConfirm() {
+      if (!this.industryCover) return this.$message.error("请选择行业");
+      const res = await raiInterface.industrialManagementMove({
+        ChartPermissionId: this.industryCover,
+        IndustrialManagementId: this.industryActiveFrom.IndustrialManagementId,
+      });
+      if (res.Ret === 200) {
+        this.$message.success("移动成功");
+        this.industryList = [];
+        this.getIndustrialManagement();
+        this.industryCover = "";
+        this.dialogCoverHz = false;
+      }
+    },
+  },
+};
+</script>
+<style lang="scss">
+.container-industry {
+  .el-card {
+    margin-bottom: 20px;
+  }
+  .tabs-box-top {
+    display: flex;
+    p {
+      line-height: 40px;
+      width: 130px;
+    }
+    .el-tabs__item {
+      font-weight: 400;
+      color: #666666;
+    }
+    .is-active {
+      color: #409eff !important;
+    }
+  }
+  .top-card-box {
+    display: flex;
+    justify-content: space-between;
+    .tabs-box {
+      span {
+        display: inline-block;
+        padding: 9px 24px;
+        background-color: #e9f4ff;
+        border: 1px solid #b3d8ff;
+        border-radius: 4px;
+        margin-right: 30px;
+        color: #409eff;
+        cursor: pointer;
+      }
+      .pitch {
+        background-color: #409eff;
+        border: none;
+        color: #fff;
+      }
+    }
+  }
+  .classification {
+    display: flex;
+    flex-wrap: wrap;
+    .industrial {
+      position: relative;
+      box-sizing: border-box;
+      margin-bottom: 30px;
+      width: 290px;
+      height: 60px;
+      line-height: 60px;
+      text-align: center;
+      background: #ecf5ff;
+      font-size: 14px;
+      margin-right: 30px;
+      color: #409eff;
+      border-radius: 4px;
+      border: 1px solid #b3d8ff;
+      cursor: pointer;
+      .label-tag-item {
+        position: absolute;
+        right: -1px;
+        top: -1px;
+        color: #fff;
+        font-size: 12px;
+        height: 17px;
+        line-height: 17px;
+        border-radius: 0 4px 0 0;
+        overflow: hidden;
+        span {
+          padding: 0 12px;
+        }
+      }
+      .content-industrial {
+        position: absolute;
+        box-sizing: border-box;
+        left: 0px;
+        bottom: -10px;
+        z-index: 999;
+        width: 180px;
+        transform: translateY(100%);
+        background: #646566;
+        text-align: left;
+        padding-left: 25px;
+        padding-top: 10px;
+        line-height: 16px;
+        color: #fff;
+        p {
+          height: 16px;
+          font-size: 12px;
+          margin-bottom: 6px;
+        }
+        .content-sjx {
+          position: absolute;
+          left: 50%;
+          top: -6px;
+          transform: translateX(-50%);
+          width: 0;
+          height: 0;
+          border-left: 10px solid transparent;
+          border-right: 10px solid transparent;
+          border-bottom: 10px solid #646566;
+        }
+      }
+    }
+    .pitch {
+      display: flex;
+      padding: 0 20px;
+      justify-content: space-between;
+      background-color: #409eff;
+      border: none;
+      color: #fff !important;
+    }
+    .addIndustrial {
+      box-sizing: border-box;
+      width: 96px;
+      height: 60px;
+      padding-top: 10px;
+      text-align: center;
+      background: #ecf5ff;
+      border: 1px solid #b3d8ff;
+      opacity: 1;
+      border-radius: 4px;
+      color: #409eff;
+      cursor: pointer;
+      i {
+        color: #409eff;
+        font-weight: 700;
+        padding-bottom: 5px;
+      }
+      span {
+        display: inline-block;
+        width: 100%;
+      }
+    }
+  }
+  .dialog-h {
+    height: 30px;
+  }
+  .dialogp {
+    margin-bottom: 30px;
+  }
+  /deep/.el-tabs__nav-wrap::after {
+    content: none;
+  }
+  .card-box {
+    display: flex;
+    align-items: center;
+    div {
+      margin-right: 20px;
+    }
+  }
+  .subject-text {
+    padding-top: 20px;
+  }
+  .subject-content {
+    background: #ffffff;
+    padding: 20px;
+    box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
+    border-radius: 4px;
+  }
+}
+
+.el-tabs__nav-wrap::after {
+  display: none;
+  content: none;
+}
+.el-popover__reference {
+  width: 258px;
+}
+.popover-industry {
+  background: #646566;
+  color: #fff;
+  font-size: 12px;
+  .popper__arrow {
+    &::after {
+      border-bottom-color: #646566 !important;
+      border-top-color: #646566 !important;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/components/collectFansDlg.vue

@@ -0,0 +1,79 @@
+<template>
+  <div class="container">
+    <!-- 选择图片的弹框 -->
+    <el-dialog :title="collectFansDlgText" :visible.sync="iscollectFansDlgShow" width="50%" :before-close="handleClose" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center>
+      <div>
+        <el-table :data="tableData" style="width: 100%; margin-bottom: 20px" border>
+          <el-table-column prop="RealName" align="center" label="姓名"></el-table-column>
+          <el-table-column prop="CompanyName" align="center" label="公司名称"></el-table-column>
+          <el-table-column prop="SellerName" align="center" label="所属销售"></el-table-column>
+          <el-table-column width="160" prop="CreateTime" align="center" :label="this.collectFansDlgText == '收藏详情' ? '收藏时间' : '关注时间'"></el-table-column>
+        </el-table>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="handleClose">关闭</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+
+export default {
+  name: "",
+  components: {},
+  props: {
+    iscollectFansDlgShow: {
+      type: Boolean,
+      default: false,
+    },
+    collectFansDlgText: {
+      type: String,
+      default: "",
+    },
+    collectFansDlgItem: {
+      type: Object,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      tableData: [],
+    };
+  },
+  computed: {},
+  watch: {
+    iscollectFansDlgShow: {
+      handler(newVal) {
+        newVal && this.getTableList();
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    // 关闭弹框
+    handleClose() {
+      this.$emit("update:iscollectFansDlgShow", false);
+      this.$emit("update:collectFansDlgText", "");
+      this.$emit("update:collectFansDlgItem", {});
+    },
+    // 获取表格数据
+    async getTableList() {
+      const res =
+        this.collectFansDlgText == "收藏详情"
+          ? await raiInterface.getYanxuanSpecialCollect({
+              SpecialId: this.collectFansDlgItem.Id,
+            })
+          : await raiInterface.getYanxuanSpecialFans({
+              SpecialAuthorId: this.collectFansDlgItem.Id,
+            });
+      if (res.Ret === 200) {
+        this.tableData = res.Data.List || [];
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss"></style>

src/views/rai_manage/reportManage/components/roadshowApplyDlg.vue

@@ -0,0 +1,67 @@
+<template>
+  <div class="container">
+    <!-- 选择图片的弹框 -->
+    <el-dialog title="路演申请" :visible.sync="isRadshowApplyShow" width="50%" :before-close="handleClose" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center>
+      <div>
+        <el-table :data="tableData" style="width: 100%; margin-bottom: 20px" border>
+          <el-table-column prop="SubjectName" align="center" label="申请标的"></el-table-column>
+          <el-table-column prop="RealName" align="center" label="申请人"></el-table-column>
+          <el-table-column prop="CompanyName" align="center" label="公司名称"></el-table-column>
+          <el-table-column prop="SellerName" align="center" label="所属销售"></el-table-column>
+          <el-table-column width="160" prop="CreateTime" align="center" label="申请时间"></el-table-column>
+        </el-table>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+
+export default {
+  name: "",
+  components: {},
+  props: {
+    isRadshowApplyShow: {
+      type: Boolean,
+      default: false,
+    },
+    radshowApplyId: {
+      type: Number,
+      default: 0,
+    },
+  },
+  data() {
+    return {
+      tableData: [],
+    };
+  },
+  computed: {},
+  watch: {
+    isRadshowApplyShow: {
+      handler(newVal) {
+        newVal && this.getTableList();
+      },
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    // 关闭弹框
+    handleClose() {
+      this.$emit("update:isRadshowApplyShow", false);
+      this.$emit("update:radshowApplyId", 0);
+    },
+    // 获取表格数据
+    async getTableList() {
+      const res = await raiInterface.reportSelectionTarryList({
+        ArticleId: this.radshowApplyId,
+      });
+      if (res.Ret === 200) {
+        this.tableData = res.Data.List || [];
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss"></style>

src/views/rai_manage/reportManage/components/specialDlg.vue

@@ -0,0 +1,140 @@
+<template>
+  <div class="container special-dlg-container">
+    <el-dialog title="新建专栏作者" :visible.sync="addAuthorDlgVisible" width="500px" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center @close="handleCloseAuthor">
+      <el-autocomplete
+        class="inline-input"
+        style="width: 100%; margin-bottom: 20px"
+        v-model="keyAuthor"
+        :fetch-suggestions="querySearchHandler"
+        @blur="changeHandler"
+        @select="selectCompany"
+        placeholder="请输入客户姓名"
+        :trigger-on-focus="false"
+      ></el-autocomplete>
+      <p v-show="!isShowKey" style="color: #f00">系统中无此人，请先将其添加到对应公司的联系人列表下</p>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleCloseAuthor">取 消</el-button>
+        <el-button type="primary" @click="addAuthorHandler">确 定</el-button>
+      </span>
+    </el-dialog>
+    <el-dialog title="驳回" :visible.sync="submitRejectDlgVisible" width="500px" v-dialogDrag :close-on-click-modal="false" :modal-append-to-body="false" center @close="handleCloseReject">
+      <el-input type="textarea" :rows="4" style="margin-bottom: 20px" v-model.trim="textReject" placeholder="请输入驳回原因"></el-input>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleCloseReject">取 消</el-button>
+        <el-button type="primary" @click="submitRejectHandler">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: {},
+  props: {
+    addAuthorDlgVisible: {
+      default: false,
+      type: Boolean,
+    },
+    submitRejectDlgVisible: {
+      default: false,
+      type: Boolean,
+    },
+    submitRejectId: {
+      default: 0,
+      type: Number,
+    },
+  },
+  data() {
+    return {
+      keyAuthor: "",
+      companyList: [],
+      textReject: "",
+      isShowKey: true,
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {},
+  methods: {
+    // 关闭添加作者的弹框
+    handleCloseAuthor() {
+      this.keyAuthor = "";
+      this.$emit("update:addAuthorDlgVisible", false);
+    },
+    // 作者弹框的搜索事件
+    async querySearchHandler(query, cb) {
+      cb([]);
+      if (!query) return;
+      const res = await raiInterface.activitySignupUserList({ KeyWord: query });
+      if (res.Ret === 200) {
+        console.log(res);
+        let arr =
+          res.Data.List && res.Data.List.length
+            ? res.Data.List.map((item) => {
+                return {
+                  ...item,
+                  value: item.RealName + " - " + item.Mobile + " - " + item.CompanyName,
+                };
+              })
+            : [];
+        this.companyList = arr;
+        cb(arr);
+      }
+    },
+    // 作者添加的事件
+    async addAuthorHandler() {
+      const isKey = this.companyList.some((item) => item.value === this.keyAuthor);
+      if (!isKey) return this.$message.error("请输入客户姓名!");
+      let params = this.companyList.filter((item) => item.value === this.keyAuthor);
+      const res = await raiInterface.yanxuan_specialAuthorAdd({
+        UserId: params[0].UserId,
+        RealName: params[0].RealName,
+        Mobile: params[0].Mobile,
+      });
+      if (res.Ret === 200) {
+        this.handleCloseAuthor();
+        this.$message.success("添加成功！");
+        this.$parent.getyanxuanReportSpecial();
+      }
+    },
+    /* **************************************************** */
+    // 驳回的弹框关闭事件
+    handleCloseReject() {
+      this.textReject = "";
+      this.$emit("update:submitRejectDlgVisible", false);
+    },
+    // 驳回的弹框确定事件
+    async submitRejectHandler() {
+      if (!this.textReject) return this.$message.error("请输入驳回原因");
+      // 提交成功后刷新页面
+      const res = await raiInterface.yanxuan_specialEnable({
+        Id: this.submitRejectId,
+        Status: 2,
+        Reason: this.textReject,
+      });
+      if (res.Ret === 200) {
+        this.handleCloseReject();
+        this.$message.success("操作成功！");
+        this.$parent.getSpecialList();
+      }
+    },
+    changeHandler() {
+      if (!this.keyAuthor) return;
+      this.isShowKey = this.companyList.some((item) => item.value === this.keyAuthor);
+    },
+    selectCompany() {
+      this.isShowKey = this.companyList.some((item) => item.value === this.keyAuthor);
+    },
+  },
+};
+</script>
+<style lang="scss">
+.special-dlg-container {
+  .el-dialog .el-input {
+    width: 100%;
+  }
+}
+</style>

src/views/rai_manage/reportManage/components/yanXuanLable.js

@@ -0,0 +1,183 @@
+export const TopLableList = [
+  {
+    name: "文章管理",
+    value: 1,
+  },
+  {
+    name: "作者管理",
+    value: 2,
+  },
+];
+export const ReportStutsList = [
+  {
+    name: "待审核",
+    value: 1,
+  },
+  {
+    name: "已发布",
+    value: 2,
+  },
+  {
+    name: "驳回记录",
+    value: 3,
+  },
+];
+
+export const TableColums = (type) => {
+  return type === 1
+    ? [
+        {
+          label: "文章标题",
+          key: "Title",
+        },
+        {
+          label: "文章类型",
+          key: "Type",
+          widthsty: 80,
+        },
+        {
+          label: "专栏名称",
+          key: "SpecialName",
+        },
+        {
+          label: "作者昵称",
+          key: "NickName",
+        },
+        {
+          label: "提交审核时间",
+          key: "PublishTime",
+          widthsty: 160,
+        },
+      ]
+    : type === 2
+    ? [
+        {
+          label: "文章标题",
+          key: "Title",
+        },
+        {
+          label: "文章类型",
+          key: "Type",
+          widthsty: 80,
+        },
+        {
+          label: "专栏名称",
+          key: "SpecialName",
+        },
+        {
+          label: "作者昵称",
+          key: "NickName",
+        },
+        {
+          label: "发布（审核通过）时间",
+          key: "PublishTime",
+          widthsty: 200,
+        },
+        {
+          label: "审核人",
+          key: "AdminName",
+          widthsty: 100,
+        },
+        {
+          label: "PV/UV",
+          key: "pv",
+          widthsty: 100,
+        },
+        {
+          label: "收藏数",
+          key: "ArticleCollectNum",
+          widthsty: 100,
+        },
+      ]
+    : [
+        {
+          label: "文章标题",
+          key: "Title",
+        },
+        {
+          label: "文章类型",
+          key: "Type",
+          widthsty: 80,
+        },
+        {
+          label: "文章ID",
+          key: "YanxuanSpecialId",
+          widthsty: 100,
+        },
+        {
+          label: "专栏名称",
+          key: "SpecialName",
+        },
+        {
+          label: "作者昵称",
+          key: "NickName",
+        },
+        {
+          label: "审核时间",
+          key: "CreateTime",
+          widthsty: 160,
+        },
+        {
+          label: "审核人",
+          key: "AdminName",
+          widthsty: 100,
+        },
+      ];
+};
+export const AuthorTableColums = [
+  {
+    label: "专栏名称",
+    key: "SpecialName",
+    // widthsty: 200,
+  },
+  {
+    label: "作者昵称",
+    key: "NickName",
+    widthsty: 90,
+  },
+  {
+    label: "姓名",
+    key: "RealName",
+    widthsty: 90,
+  },
+  {
+    label: "手机号",
+    key: "Mobile",
+    widthsty: 130,
+  },
+  {
+    label: "公司名称",
+    key: "CompanyName",
+    widthsty: 200,
+  },
+  {
+    label: "开通时间",
+    key: "CreateTime",
+    widthsty: 170,
+  },
+  {
+    label: "最近发布时间",
+    key: "ArticlePublishTime",
+    widthsty: 170,
+  },
+  {
+    label: "已发布文章",
+    key: "ArticleNum",
+    widthsty: 130,
+  },
+  {
+    label: "总PV/UV",
+    key: "pv",
+    widthsty: 160,
+  },
+  {
+    label: "被收藏",
+    key: "ArticleCollectNum",
+    widthsty: 80,
+  },
+  {
+    label: "粉丝",
+    key: "FansNum",
+    widthsty: 80,
+  },
+];

src/views/rai_manage/reportManage/internalTesting.vue

@@ -0,0 +1,242 @@
+<template>
+  <div class="container-internal-testing">
+    <el-card>
+      <div class="top-box">
+        <div class="top-container">
+          <el-select placeholder="发布状态" clearable v-model="status" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="发布时间" value-type="format" @change="conditionChange"> </date-picker>
+        </div>
+        <div>
+          <el-button type="primary" @click="$router.push('/addHaveReport')">添加</el-button>
+        </div>
+      </div>
+      <el-table :data="tableData" style="width: 100%" border>
+        <el-table-column prop="ColumnName" align="center" width="180" label="标题栏名称"></el-table-column>
+        <el-table-column prop="" align="center" label="报告标题" min-width="260">
+          <template slot-scope="scope">
+            <span v-if="scope.row.Status == 1" class="editsty" @click="goDetail(scope.row)">{{ scope.row.Title }}</span>
+            <span v-else>{{ scope.row.Title }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="ChartPermissionName" align="center" label="行业" width="100"></el-table-column>
+        <el-table-column prop="MatchTypeName" align="center" label="报告类型" width="100"></el-table-column>
+        <el-table-column prop="Label" align="center" label="关联产业/标的" width="200"></el-table-column>
+        <el-table-column prop="PublishTime" align="center" label="发布时间" width="160"></el-table-column>
+        <el-table-column prop="ModifyTime" align="center" label="更新时间" width="200"></el-table-column>
+        <el-table-column align="center" label="发布状态" width="108">
+          <template slot-scope="scope">
+            {{ scope.row.Status == 1 ? "已发布" : scope.row.Status == 3 ? "已下线" : "未发布" }}
+          </template>
+        </el-table-column>
+        <el-table-column width="135" label="PV / UV" align="center">
+          <template slot-scope="scope">
+            <div class="pv-uv-download">
+              <span>{{ scope.row.Pv }}/{{ scope.row.Uv }}</span>
+              <a :href="exportPvUv(scope.row.ProductInteriorId)" download>
+                <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+              </a>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column key="VisibleRange" width="180" label="可见范围" align="center">
+          <template slot-scope="{ row }" v-if="row.Status === 1">
+            <el-radio-group v-model="row.VisibleRange" @input="reportVisibleRange(row)">
+              <el-radio :label="1">全部</el-radio>
+              <el-radio :label="0">内部</el-radio>
+            </el-radio-group>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="操作" width="180">
+          <template slot-scope="{ row }">
+            <span v-if="row.Status == 0" class="editsty" @click="operationBtn(row.ProductInteriorId, '发布')">发布&nbsp;&nbsp;</span>
+            <span v-if="row.Status == 1" class="editsty" @click="operationBtn(row.ProductInteriorId, '取消发布')">取消发布&nbsp;&nbsp;</span>
+            <span v-if="row.Status == 3" class="editsty" @click="operationBtn(row.ProductInteriorId, '重新发布')">重新发布&nbsp;&nbsp;</span>
+            <span class="editsty" @click="editReport(row.ProductInteriorId)">编辑&nbsp;&nbsp;</span>
+            <span v-if="row.Status == 0" class="deletesty" @click="operationBtn(row.ProductInteriorId, '删除')"> 删除 </span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: { mPage },
+  props: {},
+  data() {
+    return {
+      page_no: sessionStorage.getItem("internalTestingBack") ? JSON.parse(sessionStorage.getItem("internalTestingBack")).page_no : 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      status: "", //发布状态
+      issueTime: "", //时间
+      options: [
+        { id: "未发布", name: "未发布" },
+        { id: "已发布", name: "已发布" },
+      ], //发布的数组
+      tableData: [], //表格
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    if (sessionStorage.getItem("internalTestingBack")) {
+      const initialize = JSON.parse(sessionStorage.getItem("internalTestingBack"));
+      this.status = initialize.status;
+      this.issueTime = initialize.issueTime;
+    }
+    this.getList();
+  },
+  methods: {
+    //获取list数组
+    async getList() {
+      const res = await raiInterface.internalProductInteriorList({
+        CurrentIndex: this.page_no,
+        PageSize: this.PageSize,
+        Status: this.status == "未发布" ? 0 : this.status == "已发布" ? 1 : 2,
+        StartDate: this.issueTime[0],
+        EndDate: this.issueTime[1],
+      });
+      if (res.Ret === 200) {
+        this.tableData = res.Data.List;
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    //选择后的事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getList();
+    },
+    //发布，取消发布，删除
+    operationBtn(id, value) {
+      this.$confirm(`确定${value}该文章吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          if (value == "删除") {
+            const res = await raiInterface.internalProductInteriorDelete({ ProductInteriorId: id });
+            if (res.Ret === 200) {
+              this.$message.success("删除成功！");
+              let page_num = Math.ceil((this.total - 1) / this.PageSize);
+              if (this.page_no > page_num) {
+                this.page_no = page_num;
+              }
+              this.getList();
+            }
+          } else {
+            const res = await raiInterface.internalProductInteriorPublish({ ProductInteriorId: id });
+            if (res.Ret === 200) {
+              this.$message.success(value + "成功！");
+              this.getList();
+            }
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消${value}`,
+          });
+        });
+    },
+    //文章详情
+    goDetail(row) {
+      let url =
+        process.env.NODE_ENV === "production"
+          ? "https://web.hzinsights.com/internal/article"
+          : process.env.NODE_ENV === "test"
+          ? "https://clpttest.hzinsights.com/internal/article"
+          : "https://clpttest.hzinsights.com/internal/article";
+      let href = `${url}/${row.ProductInteriorId}`;
+      window.open(href, "_blank");
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getList();
+    },
+    editReport(id) {
+      this.$router.push({
+        path: "/editHaveReport",
+        query: { id },
+      });
+    },
+    init() {
+      this.status = ""; //发布状态
+      this.issueTime = ""; //时间
+    },
+    //导出pv uv
+    exportPvUv(id) {
+      const url = process.env.API_ROOT + "/cygx/productInterior/PvExport?ProductInteriorId=" + id + "&" + localStorage.getItem("auth") || "";
+      return url;
+    },
+    // 可见范围
+    async reportVisibleRange(item) {
+      const res = await raiInterface.internalProductInteriorVisibleRange({
+        ProductInteriorId: item.ProductInteriorId,
+      });
+      if (res.Ret === 200) {
+        this.$message.success("操作成功");
+        this.getList();
+      } else {
+        this.getList();
+      }
+    },
+  },
+  beforeRouteEnter(to, from, next) {
+    if (from.path != "/editHaveReport") {
+      sessionStorage.removeItem("internalTestingBack");
+    }
+    next();
+  },
+  beforeRouteLeave(to, from, next) {
+    let backData = {
+      page_no: this.page_no,
+      status: this.status, //状态
+      issueTime: this.issueTime, //时间
+    };
+    sessionStorage.setItem("internalTestingBack", JSON.stringify(backData));
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-internal-testing {
+  .top-box {
+    display: flex;
+    justify-content: space-between;
+    .top-container {
+      .el-select {
+        width: 240px;
+        margin-right: 20px;
+      }
+    }
+  }
+  .mx-datepicker {
+    width: 230px !important;
+    margin-right: 25px;
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/morningMeetingManage.vue

@@ -0,0 +1,262 @@
+<template>
+  <!-- 晨会精华管理 -->
+  <div class="moring-meeting-wrap">
+    <div class="add-btn">
+      <el-button type="primary" @click="handleTableClick({}, 'add')">添加报告</el-button>
+    </div>
+    <div class="meeting-wrap">
+      <div class="select-box">
+        <div class="select">
+          <el-select placeholder="请选择发布状态" v-model="searchPublish" clearable @change="changeSelect">
+            <el-option
+              v-for="item in [
+                { label: '已发布', value: 1 },
+                { label: '未发布', value: 0 },
+              ]"
+              :label="item.label"
+              :key="item.value"
+              :value="item.value"
+            />
+          </el-select>
+          <!-- <date-picker  type="date" range placeholder="晨会时间" v-model="searchDate" value-type="format"/> -->
+          <el-date-picker v-model="searchDate" type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" @change="changeSelect" class="date-pick" placeholder="晨会时间"> </el-date-picker>
+        </div>
+
+        <el-input placeholder="请输入产业标签" clearable v-model="searchLabel" @input="changeSelect">
+          <i slot="prefix" class="el-input__icon el-icon-search"></i>
+        </el-input>
+      </div>
+
+      <div class="table-wrap">
+        <el-table :data="tableData" border>
+          <el-table-column v-for="item in tableColumn" :key="item.key" :prop="item.key" :label="item.label" align="center" :min-width="item.minWidth">
+            <template slot-scope="{ row }">
+              <span v-if="item.key === 'meetingTime' && row[item.key]">{{ $moment(row[item.key]).format("YYYY.MM.DD") }}</span>
+              <span v-else-if="item.key === 'status'">{{ row[item.key] === 1 ? "已发布" : "未发布" }}</span>
+              <span v-else>{{ row[item.key] || "-" }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column width="150" label="PV / UV" align="center" key="pvUv" :render-header="renderHeader">
+            <template slot="header" slot-scope="scope">
+              <div class="todolabel" style="width: 100%; display: flex; justify-content: center; align-items: center">
+                <span>PV / UV</span>
+                <el-tooltip style="margin-left: 10px" effect="dark" placement="top-start">
+                  <template slot="content">
+                    <p>pv：报告被打开的次数，每次打开都计算一次（只统计有权限用户）</p>
+                    <p>uv：访问报告的人数，每篇报告同一个人访问只计算一次（只统计有权限用户）</p>
+                  </template>
+                  <i class="el-icon-info" />
+                </el-tooltip>
+              </div>
+            </template>
+            <template slot-scope="{ row }">
+              <div class="pv-uv-download">
+                <span>{{ row.Pv }}/{{ row.Uv }}</span>
+                <a :href="`${exportPvUv(row)}`" download>
+                  <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+                </a>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" min-width="160">
+            <template slot-scope="{ row }">
+              <div style="color: #4099ef; font-size: 24px">
+                <span class="editsty" @click="handleTableClick(row, 'publish')">{{ row.status === 1 ? "取消发布" : "发布" }}</span>
+                <span class="editsty" @click="handleTableClick(row, 'edit')">编辑</span>
+                <span class="deletesty" style="cursor: pointer; color: #d1433a" v-if="row.status === 0" @click="handleTableClick(row, 'delete')">删除</span>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-pagination
+          layout="total,prev,pager,next,jumper"
+          background
+          :current-page="page_no"
+          @current-change="handleCurrentChange"
+          :page-size="pageSize"
+          :total="total"
+          style="text-align: end; margin-top: 20px"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+export default {
+  data() {
+    return {
+      tableColumn: [
+        {
+          key: "meetingTime",
+          label: "晨会日期",
+        },
+        {
+          key: "partNums",
+          label: "段落数",
+        },
+        {
+          key: "industryName",
+          label: "相关产业",
+          minWidth: 160,
+        },
+        {
+          key: "publishTime",
+          label: "发布时间",
+        },
+        {
+          key: "modifyTime",
+          label: "更新时间",
+        },
+        {
+          key: "status",
+          label: "发布状态",
+        },
+      ],
+      tableData: [],
+      //分页相关
+      page_no: 1,
+      pageSize: 10,
+      total: 11,
+      //搜索相关
+      searchPublish: "",
+      searchDate: "",
+      searchLabel: "",
+    };
+  },
+  watch: {},
+  methods: {
+    handleTableClick(data, type) {
+      if (type === "delete") {
+        this.$confirm("确定要删除这篇报告吗？", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }).then(() => {
+          this.deleteMeeting(data.Id);
+        });
+      }
+      if (type === "add") {
+        this.$router.push("/addMorningMeeting");
+      }
+      if (type === "edit") {
+        this.$router.push({
+          path: "/editMorningMeeting",
+          query: { id: data.Id },
+        });
+      }
+      if (type === "publish") {
+        this.publishMeeting(data);
+      }
+    },
+    handleCurrentChange(current) {
+      this.page_no = current;
+      this.getListData();
+    },
+    async getListData() {
+      const res = await raiInterface.getMorningMeetingList({
+        PageSize: this.pageSize,
+        CurrentIndex: this.page_no,
+        KeyWord: this.searchLabel,
+        MeetingTime: this.searchDate,
+        Status: this.searchPublish,
+      });
+      if (res.Ret !== 200) return;
+      const { CurrentIndex, Totals } = res.Data.Paging;
+      this.tableData = res.Data.List || [];
+      this.page_no = CurrentIndex;
+      this.total = Totals;
+    },
+    //删除晨会
+    async deleteMeeting(id) {
+      const res = await raiInterface.deleteListMeeting({ ReviewId: id });
+      if (res.Ret !== 200) return;
+      this.$message.success("删除成功");
+      let page_num = Math.ceil((this.total - 1) / this.pageSize);
+      if (this.page_no > page_num) {
+        this.page_no = page_num;
+      }
+      this.getListData();
+    },
+    //发布/取消发布晨会
+    async publishMeeting(data) {
+      let res = null;
+      if (data.status === 1) {
+        res = await raiInterface.cancelPublish({ ReviewId: data.Id });
+      } else {
+        res = await raiInterface.publishListMeeting({ ReviewIds: data.Id + "" });
+      }
+      if (res.Ret !== 200) return;
+      this.$message.success(`${data.status === 0 ? "" : "取消"}发布成功`);
+      this.searchPublish = "";
+      this.searchDate = "";
+      this.searchLabel = "";
+      this.getListData();
+    },
+    //筛选条件更改
+    changeSelect() {
+      this.page_no = 1;
+      this.getListData();
+    },
+    exportPvUv(row) {
+      return process.env.API_ROOT + "/cygx/morningMeeting/list_pv?MeetingId=" + row.Id + "&" + localStorage.getItem("auth") + `&IsExport=${true}`;
+    },
+  },
+  computed: {},
+  mounted() {
+    this.getListData();
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.moring-meeting-wrap {
+  .add-btn,
+  .meeting-wrap {
+    background-color: #fff;
+    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
+    border-radius: 4px;
+    padding: 20px 30px;
+    box-sizing: border-box;
+  }
+  .add-btn {
+    text-align: right;
+    height: 80px;
+    margin-bottom: 20px;
+  }
+  .meeting-wrap {
+    min-height: calc(100vh - 220px);
+    .select-box {
+      display: flex;
+      margin-bottom: 20px;
+      justify-content: space-between;
+      .el-select,
+      .date-pick {
+        width: 210px !important;
+        margin-right: 20px;
+      }
+      .el-input {
+        width: 420px !important;
+        margin-right: 0;
+      }
+      .date-pick {
+        &.el-input {
+          width: 210px !important;
+          margin-right: 20px;
+        }
+      }
+    }
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/reportChoiceness.vue

@@ -0,0 +1,287 @@
+<template>
+  <div class="container-choiceness">
+    <el-card>
+      <div class="top-box">
+        <div class="top-container">
+          <el-select placeholder="发布状态" clearable v-model="status" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="发布时间" value-type="format" @change="conditionChange"> </date-picker>
+        </div>
+        <div>
+          <el-button type="primary" @click="$router.push('/addChoiceness')">添加</el-button>
+        </div>
+      </div>
+
+      <el-table :data="tableData" style="width: 100%" border>
+        <el-table-column prop="" align="center" label="标题" min-width="260">
+          <template slot-scope="scope">
+            <span class="editsty" @click="goDetail(scope.row.ArticleId)">{{ scope.row.Title }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Periods" align="center" label="期数" width="118"></el-table-column>
+        <el-table-column prop="PublishDate" align="center" label="发布时间" min-width="165"></el-table-column>
+        <el-table-column prop="LastUpdatedTime" align="center" label="更新时间" min-width="165"></el-table-column>
+        <el-table-column prop="" align="center" label="发布状态" width="118">
+          <template slot-scope="scope">
+            {{ scope.row.PublishStatus == 1 ? "已发布" : "未发布" }}
+          </template>
+        </el-table-column>
+        <el-table-column width="135" label="PV / UV" align="center" :render-header="renderHeader">
+          <template slot-scope="scope">
+            <div class="pv-uv-download">
+              <span>{{ scope.row.Pv }}/{{ scope.row.Uv }}</span>
+              <a :href="exportPvUv(scope.row.ArticleId)" download>
+                <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+              </a>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Periods" align="center" label="路演申请" width="100">
+          <template slot-scope="{ row }">
+            <span class="editsty" @click="roadshowApplyHandler(row)">{{ row.ApplyTotal }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column key="VisibleRange" width="156" label="可见范围" align="center">
+          <template slot-scope="{ row }" v-if="row.PublishStatus === 1">
+            <el-radio-group v-model="row.VisibleRange" @input="reportVisibleRange(row)">
+              <el-radio :label="1">全部</el-radio>
+              <el-radio :label="0">内部</el-radio>
+            </el-radio-group>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="操作" width="140">
+          <template slot-scope="scope">
+            <span v-if="scope.row.PublishStatus !== 1" class="editsty" @click="operationBtn(scope.row.ArticleId, '发布')">发布&nbsp;&nbsp;</span>
+            <span v-else class="editsty" @click="operationBtn(scope.row.ArticleId, '取消发布')">取消发布&nbsp;&nbsp;</span>
+            <span class="editsty" @click="editReport(scope.row.ArticleId, scope.row.PublishStatus)">编辑&nbsp;&nbsp;</span>
+            <span v-if="scope.row.PublishStatus == 1" class="editsty" @click="clickCompanyDetail(scope.row.ArticleId)">公司点击详情&nbsp;&nbsp;</span>
+            <span v-if="scope.row.PublishStatus !== 1 && !scope.row.Periods" class="deletesty" @click="operationBtn(scope.row.ArticleId, '删除')">删除</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <CompanyDetail :isCompanyDetailShow.sync="isCompanyDetailShow" :companyDetailId.sync="companyDetailId" />
+    <roadshow-apply-dlg :isRadshowApplyShow.sync="isRadshowApplyShow" :radshowApplyId.sync="radshowApplyId" />
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+import CompanyDetail from "../components/reportComponents/CompanyDetail.vue";
+import RoadshowApplyDlg from "./components/roadshowApplyDlg.vue";
+export default {
+  name: "",
+  components: { mPage, CompanyDetail, RoadshowApplyDlg },
+  props: {},
+  data() {
+    return {
+      page_no: sessionStorage.getItem("choicenessListBack") ? JSON.parse(sessionStorage.getItem("choicenessListBack")).page_no : 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      industry: "", //行业
+      status: "", //发布状态
+      issueTime: "", //时间
+      //chartPermissionList: [], //行业的数组
+      options: [
+        { id: 0, name: "未发布" },
+        { id: 1, name: "已发布" },
+      ], //发布的数组
+      tableData: [], //表格
+      isCompanyDetailShow: false, //公司点击详情弹框
+      companyDetailId: 0,
+      isRadshowApplyShow: false, // 路演申请
+      radshowApplyId: 0, // 路演申请查看的ID
+    };
+  },
+  computed: {
+    sta() {
+      return this.status === 0 ? this.status : this.status === 1 ? this.status : 2;
+    },
+  },
+  watch: {},
+  created() {},
+  mounted() {
+    if (sessionStorage.getItem("choicenessListBack")) {
+      const initialize = JSON.parse(sessionStorage.getItem("choicenessListBack"));
+      this.industry = initialize.industry;
+      this.status = initialize.status;
+      this.issueTime = initialize.issueTime;
+    }
+    this.getList();
+    //this.getIndustryList()
+  },
+  methods: {
+    //获取list数组
+    async getList() {
+      const res = await raiInterface.reportSelectionList({
+        CurrentIndex: this.page_no,
+        PageSize: this.PageSize,
+        PublishStatus: this.sta - 0,
+        CategoryName: this.industry,
+        StartDate: this.issueTime[0],
+        EndDate: this.issueTime[1],
+      });
+      if (res.Ret === 200) {
+        this.tableData = res.Data.List;
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    //导出pv uv
+    exportPvUv(id) {
+      const url = process.env.API_ROOT + "/cygx/reportSelection/articleHistoryExport?ArticleId=" + id + "&Source=1&" + localStorage.getItem("auth") || "";
+      return url;
+    },
+    //选择后的事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getList();
+    },
+    //发布，取消发布，删除
+    operationBtn(id, value) {
+      this.$confirm(`确定${value}该文章吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          if (value == "删除") {
+            const res = await raiInterface.reportSelectionDelete({ ArticleId: id });
+            if (res.Ret === 200) {
+              this.$message.success("删除成功！");
+              let page_num = Math.ceil((this.total - 1) / this.PageSize);
+              if (this.page_no > page_num) {
+                this.page_no = page_num;
+              }
+              this.getList();
+            }
+          } else {
+            const res = await raiInterface.reportSelectionPublishAndCancel({ ArticleId: id });
+            if (res.Ret === 200) {
+              this.$message.success(value + "成功！");
+              this.getList();
+            }
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消${value}`,
+          });
+        });
+    },
+    //文章详情
+    goDetail(ArticleId) {
+      let url =
+        process.env.NODE_ENV === "production"
+          ? "https://web.hzinsights.com/recent"
+          : process.env.NODE_ENV === "test"
+          ? "https://clpttest.hzinsights.com/recent"
+          : "https://clpttest.hzinsights.com/recent";
+      let href = `${url}/${ArticleId}`;
+      window.open(href, "_blank");
+    },
+    //去往编辑页面
+    editReport(id, status) {
+      this.$router.push({
+        path: "/editChoiceness",
+        query: { id, status },
+      });
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getList();
+    },
+    //table表头Pu/Uv自定义
+    renderHeader(h, { column, $index }) {
+      return h("div", { attrs: { style: "padding:0;" } }, [
+        h("span", column.label),
+        h("el-tooltip", { props: { placement: "top" } }, [
+          h("p", { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } }, "pv：报告被打开的次数，每次打开都计算一次（只统计有权限用户）"),
+          h("p", { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } }, "uv：访问报告的人数，每篇报告同一个人访问只计算一次（只统计有权限用户）"),
+          h("el-button", { props: { icon: "el-icon-info" }, attrs: { style: "border:none;background:none" } }, ""),
+        ]),
+      ]);
+    },
+    // 公司点击详情的弹框
+    clickCompanyDetail(id) {
+      this.companyDetailId = id;
+      this.isCompanyDetailShow = true;
+    },
+    // 可见范围
+    async reportVisibleRange(item) {
+      const res = await raiInterface.reportSelectionVisibleRange({
+        ArticleId: item.ArticleId,
+      });
+      if (res.Ret === 200) {
+        this.$message.success("操作成功");
+        this.getList();
+      } else {
+        this.getList();
+      }
+    },
+    // 路演申请的弹框
+    roadshowApplyHandler(item) {
+      this.radshowApplyId = item.ArticleId;
+      this.isRadshowApplyShow = true;
+    },
+  },
+  /* 页面跳转前记录参数 */
+  beforeRouteLeave(to, form, next) {
+    let backData = {
+      page_no: this.page_no,
+      industry: this.industry, //行业
+      status: this.status, //状态
+      issueTime: this.issueTime, //时间
+    };
+    sessionStorage.setItem("choicenessListBack", JSON.stringify(backData));
+    next();
+  },
+  /* 页面进入前是否清除参数 */
+  beforeRouteEnter(to, from, next) {
+    if (from.path !== "/editChoiceness") {
+      sessionStorage.removeItem("choicenessListBack");
+    }
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-choiceness {
+  .top-box {
+    display: flex;
+    justify-content: space-between;
+    height: 40px;
+    margin-bottom: 30px;
+    .top-container {
+      .el-select {
+        margin-right: 20px;
+      }
+    }
+    .el-button {
+      padding: 0 30px;
+      height: 40px;
+    }
+  }
+  .mx-datepicker {
+    width: 220px !important;
+    margin-right: 25px;
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/roadshowEssence.vue

@@ -0,0 +1,262 @@
+<template>
+  <div class="container-essence">
+    <el-card>
+      <div class="top-box">
+        <div class="top-container">
+          <el-select placeholder="行业" clearable v-model="industry" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+          </el-select>
+          <el-select placeholder="发布状态" clearable v-model="status" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="发布时间" value-type="format" @change="conditionChange"> </date-picker>
+          <div class="top-input">
+            <el-input @input="keyValueInpt" v-model="keyWord" placeholder="请输入报告标题" clearable style="display: inline-block">
+              <i slot="prefix" class="el-input__icon el-icon-search"></i>
+            </el-input>
+          </div>
+        </div>
+        <div>
+          <el-button type="primary" @click="$router.push('/addRoadshow')">添加</el-button>
+        </div>
+      </div>
+      <el-table :data="tableData" style="width: 100%" border>
+        <el-table-column prop="" align="center" label="标题" min-width="260">
+          <template slot-scope="scope">
+            <span class="editsty" @click="goDetail(scope.row)">{{ scope.row.Title }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Periods" align="center" label="期数" width="108"></el-table-column>
+        <el-table-column prop="PublishDate" align="center" label="发布时间" min-width="160"></el-table-column>
+        <el-table-column prop="LastUpdatedTime" align="center" label="更新时间" min-width="160"></el-table-column>
+        <el-table-column align="center" label="发布状态" min-width="108">
+          <template slot-scope="scope">
+            {{ scope.row.PublishStatus == 1 ? "已发布" : "未发布" }}
+          </template>
+        </el-table-column>
+        <el-table-column width="135" label="PV / UV" align="center" :render-header="renderHeader">
+          <template slot-scope="scope">
+            <div class="pv-uv-download">
+              <span>{{ scope.row.Pv }}/{{ scope.row.Uv }}</span>
+              <a :href="exportPvUv(scope.row.ArticleId)" download>
+                <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+              </a>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="操作" min-width="165">
+          <template slot-scope="scope">
+            <span v-if="scope.row.PublishStatus !== 1" class="editsty" @click="operationBtn(scope.row.ArticleId, '发布')">发布&nbsp;&nbsp;</span>
+            <span v-else class="editsty" @click="operationBtn(scope.row.ArticleId, '取消发布')">取消发布&nbsp;&nbsp;</span>
+            <span class="editsty" @click="editReport(scope.row.ArticleId)">编辑&nbsp;&nbsp;</span>
+            <span v-if="scope.row.PublishStatus !== 1 && !scope.row.Periods" class="deletesty" @click="operationBtn(scope.row.ArticleId, '删除')">删除</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: { mPage },
+  props: {},
+  data() {
+    return {
+      page_no: sessionStorage.getItem("roadshowEssenceBack") ? JSON.parse(sessionStorage.getItem("roadshowEssenceBack")).page_no : 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      industry: "", //行业
+      status: "", //发布状态
+      issueTime: "", //时间
+      chartPermissionList: [], //行业的数组
+      options: [
+        { id: 0, name: "未发布" },
+        { id: 1, name: "已发布" },
+      ], //发布的数组
+      tableData: [], //表格
+      keyWord: "",
+    };
+  },
+  computed: {
+    sta() {
+      return this.status === 0 ? this.status : this.status === 1 ? this.status : 2;
+    },
+  },
+  watch: {},
+  created() {},
+  mounted() {
+    if (sessionStorage.getItem("roadshowEssenceBack")) {
+      const initialize = JSON.parse(sessionStorage.getItem("roadshowEssenceBack"));
+      this.status = initialize.status;
+      this.issueTime = initialize.issueTime;
+      this.industry = initialize.industry;
+      this.keyWord = initialize.keyWord;
+    }
+    this.getList();
+    this.getIndustryList();
+  },
+  methods: {
+    //获取list数组
+    async getList() {
+      const res = await raiInterface.roadshowEssenceList({
+        CurrentIndex: this.page_no,
+        PageSize: this.PageSize,
+        PublishStatus: this.sta - 0,
+        ChartPermissionId: this.industry,
+        StartDate: this.issueTime[0],
+        EndDate: this.issueTime[1],
+        KeyWord: this.keyWord,
+      });
+      if (res.Ret === 200) {
+        this.tableData = res.Data.List;
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    //获取行业
+    async getIndustryList() {
+      const res = await raiInterface.chartPermissionFirstHaveIco();
+      if (res.Ret === 200) {
+        this.chartPermissionList = res.Data.List;
+      }
+    },
+    //选择后的事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getList();
+    },
+    //发布，取消发布，删除
+    operationBtn(id, value) {
+      this.$confirm(`确定${value}该文章吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          if (value == "删除") {
+            const res = await raiInterface.roadshowEssenceDelete({ ArticleId: id });
+            if (res.Ret === 200) {
+              this.$message.success("删除成功！");
+              let page_num = Math.ceil((this.total - 1) / this.PageSize);
+              if (this.page_no > page_num) {
+                this.page_no = page_num;
+              }
+              this.getList();
+            }
+          } else {
+            const res = await raiInterface.roadshowEssencePublishAndCancel({ ArticleId: id });
+            if (res.Ret === 200) {
+              this.$message.success(value + "成功！");
+              this.getList();
+            }
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消${value}`,
+          });
+        });
+    },
+    //文章详情
+    goDetail(row) {
+      let { href } = this.$router.resolve({ name: "预览路演精华", query: { ArticleId: row.ArticleId } });
+      window.open(href, "_blank");
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getList();
+    },
+    editReport(id, status) {
+      this.$router.push({
+        path: "/editRoadshow",
+        query: { id },
+      });
+    },
+    keyValueInpt() {
+      this.page_no = 1;
+      this.getList();
+      this.init();
+    },
+    init() {
+      this.industry = ""; //行业
+      this.status = ""; //发布状态
+      this.issueTime = ""; //时间
+    },
+    //table表头Pu/Uv自定义
+    renderHeader(h, { column, $index }) {
+      return h("div", { attrs: { style: "padding:0;" } }, [
+        h("span", column.label),
+        h("el-tooltip", { props: { placement: "top" } }, [
+          h("p", { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } }, "pv：报告被打开的次数，每次打开都计算一次（只统计有权限用户）"),
+          h("p", { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } }, "uv：访问报告的人数，每篇报告同一个人访问只计算一次（只统计有权限用户）"),
+          h("el-button", { props: { icon: "el-icon-info" }, attrs: { style: "border:none;background:none" } }, ""),
+        ]),
+      ]);
+    },
+    //导出pv uv
+    exportPvUv(id) {
+      const url = process.env.API_ROOT + "/cygx/reportSelection/articleHistoryExport?ArticleId=" + id + "&Source=2&" + localStorage.getItem("auth") || "";
+      return url;
+    },
+  },
+  beforeRouteEnter(to, from, next) {
+    if (from.path != "/editRoadshow") {
+      sessionStorage.removeItem("roadshowEssenceBack");
+    }
+    next();
+  },
+  beforeRouteLeave(to, from, next) {
+    let backData = {
+      page_no: this.page_no,
+      status: this.status, //状态
+      issueTime: this.issueTime, //时间
+      industry: this.industry,
+      keyWord: this.keyWord,
+    };
+    sessionStorage.setItem("roadshowEssenceBack", JSON.stringify(backData));
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-essence {
+  .top-box {
+    display: flex;
+    justify-content: space-between;
+    .top-container {
+      .el-select {
+        width: 240px;
+        margin-right: 20px;
+      }
+      .top-input {
+        display: inline-block;
+        width: 521px;
+        margin-bottom: 20px;
+      }
+    }
+  }
+  .mx-datepicker {
+    width: 230px !important;
+    margin-right: 25px;
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/summaryManage.vue

@@ -0,0 +1,457 @@
+<template>
+  <div class="container-summary">
+    <!-- 内容el-card -->
+    <el-card>
+      <!-- 选择部分 -->
+      <div class="screen-box">
+        <div style="margin-bottom: 20px">
+          <el-select placeholder="请选择报告类型" clearable v-model="industry" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in chartPermissionList" :label="item.ArticleTypeName" :key="item.ArticleTypeId" :value="item.ArticleTypeId"></el-option>
+          </el-select>
+          <el-select placeholder="发布状态" clearable v-model="status" @change="conditionChange">
+            <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="发布时间" value-type="format" @change="conditionChange"> </date-picker>
+          <el-input v-model="titleValue" placeholder="请输入报告标题" clearable style="display: inline-block; width: 240px">
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+          <el-input v-model="labelSearch" placeholder="请输入报告标签" clearable style="display: inline-block; width: 240px">
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+          <el-select v-model="valueAuthor" filterable clearable @change="conditionChange" :filter-method="remoteMethodAuthor" placeholder="作者昵称" @clear="clearAuthor">
+            <el-option v-for="item in authorOptions" :key="item.DepartmentId" :label="item.Content" :value="item.DepartmentId"> </el-option>
+          </el-select>
+        </div>
+        <div class="screen-right">
+          <el-button type="primary" @click="$router.push('/addSummary')">添加报告</el-button>
+        </div>
+      </div>
+      <!-- 表格部分 -->
+      <el-table :data="dataList" style="width: 100%" border>
+        <el-table-column key="title" align="center" label="报告标题" min-width="300">
+          <template slot-scope="scope">
+            <span class="editsty" style="color: #409eff" @click="lookDetail(scope.row)">{{ scope.row.Title }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column key="category" prop="ArticleTypeName" align="center" label="报告类型" min-width="95"></el-table-column>
+        <el-table-column key="label" prop="IndustryName" align="center" label="标签" min-width="160"></el-table-column>
+        <el-table-column key="nickName" prop="NickName" align="center" label="作者昵称" min-width="90">
+          <template slot-scope="scope">
+            <span class="editsty" @click="collectionIsShow(scope.row.DepartmentId, '关注')">{{ scope.row.NickName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column key="PublishDate" min-width="160" prop="PublishDate" align="center" label="发布时间"></el-table-column>
+        <el-table-column key="LastUpdatedTime" min-width="160" prop="LastUpdatedTime" align="center" label="更新时间"></el-table-column>
+        <el-table-column key="status" align="center" label="发布状态" min-width="100">
+          <template slot-scope="scope">
+            {{ scope.row.PublishStatus == 0 ? "未发布" : "已发布" }}
+          </template>
+        </el-table-column>
+        <el-table-column key="pvUv" width="130" label="PV / UV" align="center" :render-header="renderHeader">
+          <template slot-scope="scope">
+            <div class="pv-uv-download">
+              <span>{{ scope.row.Pv }}/{{ scope.row.Uv }}</span>
+              <a :href="`${exportPvUv}${scope.row.ArticleId}&${token}`" download>
+                <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+              </a>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column key="collection" align="center" label="收藏数" min-width="80">
+          <template slot-scope="scope">
+            <span class="editsty" @click="collectionIsShow(scope.row.ArticleId, '收藏')">{{ scope.row.CollectionNum }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column key="ask" width="60" label="留言" align="center">
+          <template slot-scope="scope">
+            <span @click="inquireBtn(scope.row.ArticleId)" class="editsty">{{ scope.row.CommentNum }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column key="operation" align="center" label="操作" width="150">
+          <template slot-scope="scope">
+            <span class="editsty" @click="operationBtn(scope.row.ArticleId, '发布')">{{ scope.row.PublishStatus == 0 ? "发布" : "取消发布" }} &nbsp;&nbsp;</span>
+            <span class="editsty" @click="editBtn(scope.row.ArticleId)">编辑 &nbsp;&nbsp;</span>
+            <span class="deletesty" v-if="scope.row.PublishStatus == 0" @click="operationBtn(scope.row.ArticleId, '删除')">删除 &nbsp;&nbsp;</span>
+            <span class="editsty" v-if="scope.row.PublishStatus != 0" @click="toppingHandler(scope.row)">{{ scope.row.TopTime > 0 ? "取消置顶" : "置顶" }} &nbsp;&nbsp;</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <shortcut-dialog :shortcutIsDialog.sync="shortcutIsDialog" />
+    <generation-ask :generaitondialogVisib.sync="generaitondialogVisib" :generaitonId="generaitonId" :generaitonType="generaitonType" />
+    <focus-collection :collectionDlgShow="collectionDlgShow" :collectionId="collectionId" :collectionType="collectionType" />
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+import ShortcutDialog from "../components/shortcutDialog.vue";
+import GenerationAsk from "../components/generationAsk.vue";
+import FocusCollection from "../components/focusCollection.vue";
+export default {
+  name: "",
+  components: { mPage, ShortcutDialog, GenerationAsk, FocusCollection },
+  props: {},
+  watch: {
+    titleValue(newval) {
+      this.page_no = 1;
+      this.getsummaryManageList();
+    },
+    labelSearch(newval) {
+      this.page_no = 1;
+      this.getsummaryManageList();
+    },
+    valueAuthor: {
+      handler(newval) {
+        if (newval === "") {
+          this.authorOptions = [];
+        }
+      },
+    },
+  },
+  data() {
+    return {
+      page_no: sessionStorage.getItem("summaryManageBack") ? JSON.parse(sessionStorage.getItem("summaryManageBack")).page_no : 1,
+      dataList: [], //表格内容
+      industry: "", //行业
+      status: "", //状态
+      issueTime: "", //时间
+      valueAuthor: "", //作者昵称
+      authorOptions: [], //作者数组
+      options: [
+        { id: 0, name: "未发布" },
+        { id: 1, name: "已发布" },
+      ],
+      titleValue: "", //标题关键词
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      chartPermissionList: [], //行业的数组
+      shortcutIsDialog: false, //
+      isClientSwitch: false, //
+      generaitondialogVisib: false, //代问的弹框
+      generaitonId: "",
+      generaitonType: "纪要",
+      tabsList: [
+        { id: 1, name: "纪要" },
+        { id: 2, name: "观点" },
+      ],
+      tabsIndex: 1,
+      collectionDlgShow: false, //关注 收藏 隐显
+      collectionId: "", //关注 收藏 id
+      collectionType: "", //关注 收藏 类型区分
+      token: localStorage.getItem("auth") || "",
+      labelSearch: "",
+    };
+  },
+  computed: {
+    sta() {
+      return this.status === 0 ? this.status : this.status === 1 ? this.status : 2;
+    },
+    exportPvUv() {
+      return process.env.API_ROOT + "/cygx/summaryManage/articleHistoryExport?ArticleId=";
+    },
+  },
+
+  created() {
+    this.routerInit();
+  },
+  mounted() {
+    this.chartPermission();
+    this.sustainableDetailSummaryManage();
+    this.remoteMethodAuthor();
+    this.getsummaryManageList();
+  },
+  methods: {
+    //页面缓存 路由
+    routerInit() {
+      if (sessionStorage.getItem("summaryManageBack")) {
+        const { keyword, status, issueTime, tabs, industry, valueAuthor, labelSearch } = JSON.parse(sessionStorage.getItem("summaryManageBack"));
+        this.titleValue = keyword;
+        this.status = status; //状态
+        this.issueTime = issueTime; //时间
+        this.tabsIndex = tabs;
+        this.industry = industry;
+        this.valueAuthor = valueAuthor;
+        this.labelSearch = labelSearch;
+      }
+    },
+    //获取观点
+    sustainableDetailSummaryManage() {
+      raiInterface.sustainableDetailSummaryManage().then((res) => {
+        if (res.Ret === 200) {
+          this.isClientSwitch = !res.Data.OperationButton;
+        }
+      });
+    },
+    //table表头Pu/Uv自定义
+    renderHeader(h, { column, $index }) {
+      return h("div", { attrs: { style: "padding:0;" } }, [
+        h("span", column.label),
+        h("el-tooltip", { props: { placement: "top" } }, [
+          h("p", { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } }, "pv：报告被打开的次数，每次打开都计算一次（只统计有权限用户）"),
+          h("p", { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } }, "uv：访问报告的人数，每篇报告同一个人访问只计算一次（只统计有权限用户）"),
+          h("el-button", { props: { icon: "el-icon-info" }, attrs: { style: "border:none;background:none;padding:5px" } }, ""),
+        ]),
+      ]);
+    },
+    //操作按键 发布 取消发布 删除
+    operationBtn(id, value) {
+      this.$confirm(`确定${value}该纪要吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          if (value == "删除") {
+            const res = await raiInterface.getsummaryManagedelete({ ArticleId: id });
+            if (res.Ret !== 200) return;
+            this.$message.success("删除成功！");
+            let page_num = Math.ceil((this.total - 1) / this.PageSize);
+            if (this.page_no > page_num) {
+              this.page_no = page_num;
+            }
+            this.getsummaryManageList();
+          } else {
+            const res = await raiInterface.publishAndCancel({ ArticleId: id });
+            if (res.Ret !== 200) return;
+            this.$message.success(`${value}成功！`);
+            this.getsummaryManageList();
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消${value}`,
+          });
+        });
+    },
+    //编辑按钮
+    editBtn(id) {
+      console.log(id);
+      this.$router.push({
+        path: "/editSummary",
+        query: { id: id },
+      });
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getsummaryManageList();
+    },
+    //获取行业
+    chartPermission() {
+      raiInterface.summaryManageArticleType().then((res) => {
+        if (res.Ret === 200) {
+          this.chartPermissionList = res.Data.List;
+        }
+      });
+    },
+    //文章详情
+    async lookDetail(item) {
+      if (item.PublishStatus === 1) {
+        let href = `${process.env.CYGX_WEB}/material/info/${item.ArticleId}`;
+        window.open(href, "_blank");
+      } else {
+        const res = await raiInterface.getsummaryManagedetail({ ArticleId: item.ArticleId });
+        if (res.Ret === 200) {
+          sessionStorage.setItem("summaryPre", JSON.stringify(res.Data));
+          let { href } = this.$router.resolve({ name: "预览研选报告" });
+          window.open(href, "_blank");
+        }
+      }
+    },
+    //列表
+    getsummaryManageList() {
+      raiInterface
+        .getsummaryManageList({
+          CurrentIndex: this.page_no,
+          PageSize: this.PageSize,
+          PublishStatus: this.sta - 0,
+          ArticleTypeId: this.industry,
+          StartDate: this.issueTime[0],
+          EndDate: this.issueTime[1],
+          KeyWord: this.titleValue,
+          Departmentİd: this.valueAuthor,
+          Label: this.labelSearch,
+        })
+        .then((res) => {
+          if (res.Ret !== 200) return;
+          this.dataList = res.Data.List;
+          this.total = res.Data.Paging.Totals;
+        });
+    },
+    //change 事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getsummaryManageList();
+    },
+    switchClickClient(value) {
+      const str = value ? "开放" : "隐藏";
+      this.$confirm(`【研选】系列纪要、报告、专家电话会将对永续客户${str}，是否继续？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          raiInterface.sustainableEditSummaryManage().then((res) => {
+            if (res.Ret === 200) {
+              this.sustainableDetailSummaryManage();
+              this.$message.success("操作成功");
+            }
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消操作",
+          });
+        });
+    },
+    //点击代问的弹框
+    inquireBtn(id) {
+      this.generaitondialogVisib = true;
+      this.generaitonId = id;
+    },
+    tabsClick(item) {
+      if (this.tabsIndex !== item.id) {
+        this.tabsIndex = item.id;
+      }
+      this.page_no = 1;
+      this.init();
+      this.getsummaryManageList();
+      this.remoteMethodAuthor();
+    },
+    init() {
+      this.status = "";
+      this.industry = "";
+      this.issueTime = "";
+      this.titleValue = "";
+      this.valueAuthor = "";
+      this.labelSearch = "";
+      this.authorOptions = [];
+    },
+    //收藏 作者关注 点击事件
+    collectionIsShow(id, type) {
+      this.collectionId = id; //关注 收藏 id
+      this.collectionType = type; //关注 收藏 类型区分
+      this.collectionDlgShow = true;
+    },
+    //作者的搜索
+    async remoteMethodAuthor(query) {
+      const res = await raiInterface.departmentList({ KeyWord: query });
+      if (res.Ret === 200) {
+        this.authorOptions = res.Data.List || [];
+      }
+    },
+    //清除作者的某一项后要有原有的数据
+    clearAuthor() {
+      this.remoteMethodAuthor();
+    },
+    // 置顶 取消置顶
+    async toppingHandler(item) {
+      const res = await raiInterface.summaryManageTopChange({ ArticleId: item.ArticleId });
+      if (res.Ret === 200) {
+        this.getsummaryManageList();
+        this.$message.success("操作成功");
+      }
+    },
+  },
+  //路由离开
+  beforeRouteLeave(to, from, next) {
+    let backData = {};
+    if (to.path == "/editSummary") {
+      backData = {
+        page_no: this.page_no,
+        keyword: this.titleValue,
+        status: this.status, //状态
+        issueTime: this.issueTime, //时间
+        tabs: this.tabsIndex,
+        industry: this.industry,
+        valueAuthor: this.valueAuthor,
+        labelSearch: this.labelSearch,
+      };
+      sessionStorage.setItem("summaryManageBack", JSON.stringify(backData));
+    }
+    next();
+  },
+  //路由进入
+  beforeRouteEnter(to, from, next) {
+    if (from.path != "/editSummary") {
+      sessionStorage.removeItem("summaryManageBack");
+    }
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-summary {
+  .el-card {
+    min-height: calc(100vh - 118px);
+  }
+  .top-card-box {
+    display: flex;
+    justify-content: space-between;
+  }
+  .screen-box {
+    display: flex;
+    justify-content: space-between;
+    .el-select,
+    .el-input {
+      margin-right: 25px;
+    }
+  }
+  .mx-datepicker {
+    width: 220px !important;
+    margin-right: 25px;
+  }
+  .content-top-tabs {
+    width: 100%;
+    box-sizing: border-box;
+    padding: 0 30px;
+    height: 80px;
+    background: #ffffff;
+    border: 1px solid #ececec;
+    border-radius: 4px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 30px;
+    .tabs-top {
+      display: flex;
+      span {
+        box-sizing: border-box;
+        padding: 0 24px;
+        line-height: 38px;
+        height: 40px;
+        background: #ecf5ff;
+        border: 1px solid #b3d8ff;
+        opacity: 1;
+        font-weight: 500;
+        font-size: 16px;
+        color: #409eff;
+        border-radius: 4px;
+        margin-right: 30px;
+      }
+      .active {
+        background-color: #409eff;
+        color: #fff;
+      }
+    }
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/tacticsTimeLine.vue

@@ -0,0 +1,296 @@
+<template>
+  <div class="container tactics-time-line">
+    <!-- 头部 -->
+    <el-card style="margin-bottom: 20px">
+      <div style="display: flex; justify-content: space-between; align-items: center">
+        <el-radio-group v-model="visibleRange" @input="tacticsTimeLineAllCancel">
+          <el-radio :label="0">内部可见</el-radio>
+          <el-radio :label="1">全部可见</el-radio>
+        </el-radio-group>
+        <el-button @click="addReport" type="primary">添加</el-button>
+      </div>
+    </el-card>
+    <!-- 表格部分 -->
+    <el-card>
+      <el-select v-model="statusValue" placeholder="请选择状态" @change="listChangeHandel" clearable style="margin-bottom: 20px">
+        <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
+      </el-select>
+      <el-table :data="dataTableList" border align="center">
+        <el-table-column prop="PublishTime" label="日期" width="130" align="center"> </el-table-column>
+        <el-table-column min-width="350">
+          <template #header>
+            <div style="text-align: center">文本</div>
+          </template>
+          <template slot-scope="{ row }">
+            <span v-html="row.Content"></span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Title" label="报告/图表标题" min-width="250" align="center"> </el-table-column>
+        <el-table-column label="pv/uv" width="100" align="center">
+          <template slot-scope="{ row }">
+            <div class="pv-uv-download">
+              <span>{{ row.Pv }}/{{ row.Uv }}</span>
+              <a :href="exportPvUv(row)" download>
+                <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+              </a>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" width="180" align="center">
+          <template slot-scope="{ row }">
+            <el-radio-group v-model="row.Status" @input="tacticsTimeLineCancel(row)">
+              <el-radio :label="0">隐藏</el-radio>
+              <el-radio :label="1">显示</el-radio>
+            </el-radio-group>
+          </template>
+        </el-table-column>
+
+        <el-table-column prop="ModifyTime" label="更新时间" width="180" align="center"> </el-table-column>
+        <el-table-column label="操作" width="100" align="center">
+          <template slot-scope="{ row }">
+            <span class="editsty" @click="editReport(row)">编辑&nbsp;&nbsp;</span>
+            <span v-if="row.Status === 0" class="deletesty" @click="deleteBtn(row)">删除</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+    <!-- 弹框部分 -->
+    <el-dialog
+      :visible.sync="addOfEditDialog"
+      :title="addOfEditText"
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      center
+      width="661px"
+      @close="handleClose"
+    >
+      <el-form :model="dataForm" :rules="dataRules" ref="ruleForm">
+        <el-form-item prop="PublishTime">
+          <el-date-picker
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="请选择日期"
+            v-model="dataForm.PublishTime"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item prop="Content">
+          <div class="fr-wrapper">
+            <froala id="froala-editor" ref="froalaEditor" :tag="'textarea'" :config="froalaConfig" v-model="dataForm.Content"></froala>
+          </div>
+        </el-form-item>
+        <el-form-item>
+          <el-input type="textarea" placeholder="请输入报告或图表链接（网页版详情链接）" v-model="dataForm.Link"></el-input>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmPerson">确定</el-button>
+        <el-button @click="handleClose">取消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { raiInterface } from "@/api/api.js";
+import mPage from "@/components/mPage.vue";
+
+export default {
+  name: "",
+  components: {
+    mPage,
+  },
+  data() {
+    var that = this;
+    return {
+      page_no: 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      visibleRange: 3, //可见范围
+      dataTableList: [],
+      statusValue: "",
+      statusOptions: [
+        {
+          label: "显示",
+          value: 1,
+        },
+        {
+          label: "隐藏",
+          value: 0,
+        },
+      ],
+      addOfEditDialog: false, //添加或者编辑
+      addOfEditText: "",
+      dataForm: {
+        Link: "", // 链接
+        PublishTime: "", //日期
+        Content: "", //文本内容
+        TimeLineId: 0,
+      },
+      dataRules: {
+        PublishTime: [{ required: true, message: "请选择日期", trigger: "change" }],
+        Content: [{ required: true, message: "请输入文本内容", trigger: "blur" }],
+      },
+      editor: null,
+      froalaConfig: {
+        toolbarButtons: ["bold", "italic", "underline", "strikeThrough", "insertHR", "fontSize", "align", "undo", "redo"],
+        height: 200,
+        fontSizeDefaultSelection: "16",
+        quickInsertEnabled: false,
+        theme: "dark", //主题
+        placeholderText: "请输入文本内容",
+        language: "zh_cn",
+        events: {
+          initialized: function () {
+            that.editor = this;
+            that.editor.toolbar.hide();
+          },
+        },
+      },
+    };
+  },
+  mounted() {
+    this.getDataList();
+  },
+  computed: {},
+  methods: {
+    // 获取数据
+    async getDataList() {
+      const res = await raiInterface.getTacticsTimeLineList({
+        PageSize: this.PageSize,
+        CurrentIndex: this.page_no,
+        Status: this.statusValue === 0 || this.statusValue === 1 ? this.statusValue : 2,
+      });
+      if (res.Ret === 200) {
+        this.total = res.Data.Paging.Totals || 0;
+        this.dataTableList = res.Data.List;
+        this.visibleRange = res.Data.Status;
+      }
+    },
+    // 添加
+    addReport() {
+      this.addOfEditDialog = true;
+      this.addOfEditText = "添加";
+    },
+    // 编辑
+    editReport(item) {
+      this.dataForm = {
+        Link: item.Link, // 链接
+        PublishTime: item.PublishTime.replace(/\./g, "-"), //日期
+        Content: item.Content, //文本内容
+        TimeLineId: item.TimeLineId,
+      };
+      this.addOfEditText = "编辑";
+      this.addOfEditDialog = true;
+    },
+    // 关闭弹框
+    handleClose() {
+      this.$refs.ruleForm.resetFields();
+      this.addOfEditDialog = false;
+      this.dataForm = {
+        Link: "", // 链接
+        PublishTime: "", //日期
+        Content: "", //文本内容
+        TimeLineId: 0,
+      };
+    },
+    // 弹框的保存事件
+    confirmPerson() {
+      this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          this.dataForm.Content = this.dataForm.Content.replace(/<p data-f-id=\"pbf\".*?<\/p>/g, "");
+          const res = await raiInterface.tacticsTimeLinePreserveAndPublish({
+            ...this.dataForm,
+          });
+          if (res.Ret === 200) {
+            this.$message.success("操作成功");
+            this.handleClose();
+            this.getDataList();
+          }
+        }
+      });
+    },
+    // 导出pv uv
+    exportPvUv(item) {
+      const url = process.env.API_ROOT + "/cygx/tacticsTimeLine/PvExport?TimeLineId=" + item.TimeLineId + "&" + localStorage.getItem("auth") || "";
+      return url;
+    },
+    // 删除
+    deleteBtn(item) {
+      this.$confirm(`确定删除这条内容吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = await raiInterface.tacticsTimeLineDelete({ TimeLineId: item.TimeLineId });
+          if (res.Ret === 200) {
+            this.$message.success("删除成功！");
+            let page_num = Math.ceil((this.total - 1) / this.PageSize);
+            if (this.page_no > page_num) {
+              this.page_no = page_num;
+            }
+            this.getDataList();
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消删除`,
+          });
+        });
+    },
+    // 分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getDataList();
+    },
+    // 选择的change 事件
+    listChangeHandel() {
+      this.page_no = 1;
+      this.getDataList();
+    },
+    // 一键发布/取消发布报告接口
+    async tacticsTimeLineAllCancel() {
+      const res = await raiInterface.tacticsTimeLineAllCancel();
+      if (res.Ret === 200) {
+        this.$message.success("操作成功");
+      }
+      this.getDataList();
+    },
+    // 发布/取消发布报告 显示隐藏
+    async tacticsTimeLineCancel(item) {
+      const res = await raiInterface.tacticsTimeLineCancel({
+        TimeLineId: item.TimeLineId,
+      });
+      if (res.Ret === 200) {
+        this.$message.success("操作成功");
+      }
+      this.getDataList();
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.tactics-time-line {
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+.fr-wrapper {
+  border-top: 1px solid #cccccc !important;
+  border-bottom: 1px solid #cccccc !important;
+}
+</style>

src/views/rai_manage/reportManage/theLastWeek.vue

@@ -0,0 +1,294 @@
+<template>
+  <div class="container-the-last-week">
+    <!-- 上周研究汇总 -->
+    <el-card>
+      <div class="top-box">
+        <div class="top-container">
+          <el-select placeholder="发布状态" clearable v-model="status" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="发布时间" value-type="format" @change="conditionChange"> </date-picker>
+        </div>
+        <div>
+          <el-button type="primary" @click="$router.push('/addSummarizing')">添加</el-button>
+        </div>
+      </div>
+      <el-table :data="tableData" style="width: 100%" border>
+        <el-table-column prop="" align="center" label="标题" min-width="260">
+          <template slot-scope="scope">
+            <span class="editsty" @click="goDetail(scope.row)">{{ scope.row.Title }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Periods" align="center" label="期数" width="118"></el-table-column>
+        <el-table-column prop="PublishDate" align="center" label="发布时间" min-width="118"></el-table-column>
+        <el-table-column prop="LastUpdatedTime" align="center" label="更新时间" min-width="165"></el-table-column>
+        <el-table-column prop="" align="center" label="发布状态" width="118">
+          <template slot-scope="scope">
+            <span>{{ scope.row.PublishStatus == 1 ? "已发布" : "未发布" }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column width="135" label="PV / UV" align="center" :render-header="renderHeader">
+          <template slot-scope="scope">
+            <div class="pv-uv-download">
+              <span>{{ scope.row.Pv }}/{{ scope.row.Uv }}</span>
+              <a :href="exportPvUv(scope.row.ArticleId)" download>
+                <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+              </a>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column key="VisibleRange" width="156" label="可见范围" align="center">
+          <template slot-scope="{ row }" v-if="row.PublishStatus === 1">
+            <el-radio-group v-model="row.VisibleRange" @input="reportVisibleRange(row)">
+              <el-radio :label="1">全部</el-radio>
+              <el-radio :label="0">内部</el-radio>
+            </el-radio-group>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="操作" min-width="168">
+          <template slot-scope="scope">
+            <span v-if="scope.row.PublishStatus !== 1" class="editsty" @click="operationBtn(scope.row.ArticleId, '发布')">发布&nbsp;&nbsp;</span>
+            <span v-else class="editsty" @click="operationBtn(scope.row.ArticleId, '取消发布')">取消发布&nbsp;&nbsp;</span>
+            <span class="editsty" @click="editReport(scope.row.ArticleId)">编辑&nbsp;&nbsp;</span>
+            <span v-if="scope.row.PublishStatus !== 1 && !scope.row.Periods" class="deletesty" @click="operationBtn(scope.row.ArticleId, '删除')"
+              >删除</span
+            >
+            <span v-if="scope.row.PublishStatus == 1" class="editsty" @click="emailGroup(scope.row)">群发邮件</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: { mPage },
+  props: {},
+  data() {
+    return {
+      page_no: sessionStorage.getItem("theLastWeek") ? JSON.parse(sessionStorage.getItem("theLastWeek")).page_no : 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      //industry: "", //行业
+      status: "", //发布状态
+      issueTime: "", //时间
+      //chartPermissionList: [], //行业的数组
+      options: [
+        { id: 0, name: "未发布" },
+        { id: 1, name: "已发布" },
+      ], //发布的数组
+      tableData: [], //表格
+    };
+  },
+  computed: {
+    sta() {
+      return this.status === 0 ? this.status : this.status === 1 ? this.status : 2;
+    },
+  },
+  watch: {},
+  created() {},
+  mounted() {
+    if (sessionStorage.getItem("theLastWeek")) {
+      const initialize = JSON.parse(sessionStorage.getItem("theLastWeek"));
+      this.status = initialize.status;
+      this.issueTime = initialize.issueTime;
+    }
+    this.getList();
+    //this.getIndustryList()
+  },
+  methods: {
+    //获取list数组
+    async getList() {
+      const res = await raiInterface.minutesSummaryList({
+        CurrentIndex: this.page_no,
+        PageSize: this.PageSize,
+        PublishStatus: this.sta - 0,
+        CategoryName: this.industry,
+        StartDate: this.issueTime[0],
+        EndDate: this.issueTime[1],
+      });
+      if (res.Ret === 200) {
+        this.tableData = res.Data.List;
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    //导出pv uv
+    exportPvUv(id) {
+      const url =
+        process.env.API_ROOT + "/cygx/reportSelection/articleHistoryExport?ArticleId=" + id + "&Source=4&" + localStorage.getItem("auth") || "";
+      return url;
+    },
+    //选择后的事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getList();
+    },
+    //发布，取消发布，删除
+    operationBtn(id, value) {
+      this.$confirm(`确定${value}该文章吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          if (value == "删除") {
+            const res = await raiInterface.minutesSummaryDelete({ ArticleId: id });
+            if (res.Ret === 200) {
+              this.$message.success("删除成功！");
+              let page_num = Math.ceil((this.total - 1) / this.PageSize);
+              if (this.page_no > page_num) {
+                this.page_no = page_num;
+              }
+              this.getList();
+            }
+          } else {
+            const res = await raiInterface.minutesSummaryPublishAndCancel({ ArticleId: id });
+            if (res.Ret === 200) {
+              this.$message.success(value + "成功！");
+              this.getList();
+            }
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消${value}`,
+          });
+        });
+    },
+    //文章详情
+    goDetail(row) {
+      let url =
+        process.env.NODE_ENV === "production"
+          ? "https://web.hzinsights.com/summary/3"
+          : process.env.NODE_ENV === "test"
+          ? "https://clpttest.hzinsights.com/summary/3"
+          : "https://clpttest.hzinsights.com/summary/3";
+      let href = `${url}/${row.ArticleId}`;
+      window.open(href, "_blank");
+    },
+    //去往编辑页面
+    editReport(id) {
+      this.$router.push({
+        path: "/editSummarizing",
+        query: { id },
+      });
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getList();
+    },
+    //table表头Pu/Uv自定义
+    renderHeader(h, { column, $index }) {
+      return h("div", { attrs: { style: "padding:0;" } }, [
+        h("span", column.label),
+        h("el-tooltip", { props: { placement: "top" } }, [
+          h(
+            "p",
+            { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } },
+            "pv：报告被打开的次数，每次打开都计算一次（只统计有权限用户）"
+          ),
+          h(
+            "p",
+            { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } },
+            "uv：访问报告的人数，每篇报告同一个人访问只计算一次（只统计有权限用户）"
+          ),
+          h("el-button", { props: { icon: "el-icon-info" }, attrs: { style: "border:none;background:none" } }, ""),
+        ]),
+      ]);
+    },
+    emailGroup(row) {
+      this.$confirm("确定要对正式/试用客户群发该报告吗？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = await raiInterface.minutesSummarySendMail({
+            ArticleId: row.ArticleId,
+          });
+          if (res.Ret === 200) {
+            this.$message.success("发送成功");
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消`,
+          });
+        });
+    },
+    // 可见范围
+    async reportVisibleRange(item) {
+      const res = await raiInterface.minutesSummaryVisibleRange({
+        ArticleId: item.ArticleId,
+      });
+      if (res.Ret === 200) {
+        this.$message.success("操作成功");
+        this.getList();
+      } else {
+        this.getList();
+      }
+    },
+  },
+  /* 页面进入前是否清除参数 */
+  beforeRouteEnter(to, from, next) {
+    if (from.path != "/editSummarizing") {
+      sessionStorage.removeItem("theLastWeek");
+    }
+    next();
+  },
+  /* 页面跳转前记录参数 */
+  beforeRouteLeave(to, from, next) {
+    let backData = {
+      page_no: this.page_no,
+      status: this.status, //状态
+      issueTime: this.issueTime, //时间
+    };
+    sessionStorage.setItem("theLastWeek", JSON.stringify(backData));
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-the-last-week {
+  .top-box {
+    display: flex;
+    justify-content: space-between;
+    height: 40px;
+    margin-bottom: 30px;
+    .top-container {
+      .el-select {
+        margin-right: 20px;
+      }
+    }
+    .el-button {
+      padding: 0 30px;
+      height: 40px;
+    }
+  }
+  .mx-datepicker {
+    width: 220px !important;
+    margin-right: 25px;
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/thisWeek.vue

@@ -0,0 +1,297 @@
+<template>
+  <div class="container-the-last-week">
+    <!-- 本周研究汇总 -->
+    <el-card>
+      <div class="top-box">
+        <div class="top-container">
+          <!-- <el-select placeholder="行业" clearable v-model="industry" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in chartPermissionList" :label="item.PermissionName" :key="item.ChartPermissionId" :value="item.ChartPermissionId"></el-option>
+          </el-select> -->
+          <el-select placeholder="发布状态" clearable v-model="status" @change="conditionChange" style="margin-bottom: 20px">
+            <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          </el-select>
+          <date-picker v-model="issueTime" type="date" range placeholder="发布时间" value-type="format" @change="conditionChange"> </date-picker>
+        </div>
+        <div>
+          <el-button type="primary" @click="$router.push('/addThisWeek')">添加</el-button>
+        </div>
+      </div>
+      <el-table :data="tableData" style="width: 100%" border>
+        <el-table-column prop="" align="center" label="标题" min-width="260">
+          <template slot-scope="scope">
+            <span class="editsty" @click="goDetail(scope.row)">{{ scope.row.Title }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Periods" align="center" label="期数" width="118"></el-table-column>
+        <el-table-column prop="PublishDate" align="center" label="发布时间" min-width="118"></el-table-column>
+        <el-table-column prop="LastUpdatedTime" align="center" label="更新时间" min-width="165"></el-table-column>
+        <el-table-column prop="" align="center" label="发布状态" width="118">
+          <template slot-scope="scope">
+            <span>{{ scope.row.PublishStatus == 1 ? "已发布" : "未发布" }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column width="135" label="PV / UV" align="center" :render-header="renderHeader">
+          <template slot-scope="scope">
+            <div class="pv-uv-download">
+              <span>{{ scope.row.Pv }}/{{ scope.row.Uv }}</span>
+              <a :href="exportPvUv(scope.row.ArticleId)" download>
+                <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+              </a>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column key="VisibleRange" width="156" label="可见范围" align="center">
+          <template slot-scope="{ row }" v-if="row.PublishStatus === 1">
+            <el-radio-group v-model="row.VisibleRange" @input="reportVisibleRange(row)">
+              <el-radio :label="1">全部</el-radio>
+              <el-radio :label="0">内部</el-radio>
+            </el-radio-group>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="操作" min-width="168">
+          <template slot-scope="scope">
+            <span v-if="scope.row.PublishStatus !== 1" class="editsty" @click="operationBtn(scope.row.ArticleId, '发布')">发布&nbsp;&nbsp;</span>
+            <span v-else class="editsty" @click="operationBtn(scope.row.ArticleId, '取消发布')">取消发布&nbsp;&nbsp;</span>
+            <span class="editsty" @click="editReport(scope.row.ArticleId)">编辑&nbsp;&nbsp;</span>
+            <span v-if="scope.row.PublishStatus !== 1 && !scope.row.Periods" class="deletesty" @click="operationBtn(scope.row.ArticleId, '删除')"
+              >删除&nbsp;&nbsp;</span
+            >
+            <span v-if="scope.row.PublishStatus == 1" class="editsty" @click="emailGroup(scope.row)">群发邮件</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-col :span="24" class="toolbar">
+        <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+      </el-col>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import mPage from "@/components/mPage.vue";
+import { raiInterface } from "@/api/api.js";
+export default {
+  name: "",
+  components: { mPage },
+  props: {},
+  data() {
+    return {
+      page_no: sessionStorage.getItem("theLastWeek") ? JSON.parse(sessionStorage.getItem("theLastWeek")).page_no : 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      //industry: "", //行业
+      status: "", //发布状态
+      issueTime: "", //时间
+      //chartPermissionList: [], //行业的数组
+      options: [
+        { id: 0, name: "未发布" },
+        { id: 1, name: "已发布" },
+      ], //发布的数组
+      tableData: [], //表格
+    };
+  },
+  computed: {
+    sta() {
+      return this.status === 0 ? this.status : this.status === 1 ? this.status : 2;
+    },
+  },
+  watch: {},
+  created() {},
+  mounted() {
+    if (sessionStorage.getItem("theLastWeek")) {
+      const initialize = JSON.parse(sessionStorage.getItem("theLastWeek"));
+      this.status = initialize.status;
+      this.issueTime = initialize.issueTime;
+    }
+    this.getList();
+    //this.getIndustryList()
+  },
+  methods: {
+    //获取list数组
+    async getList() {
+      const res = await raiInterface.researchSummaryList({
+        CurrentIndex: this.page_no,
+        PageSize: this.PageSize,
+        PublishStatus: this.sta - 0,
+        CategoryName: this.industry,
+        StartDate: this.issueTime[0],
+        EndDate: this.issueTime[1],
+      });
+      if (res.Ret === 200) {
+        this.tableData = res.Data.List;
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    //导出pv uv
+    exportPvUv(id) {
+      const url =
+        process.env.API_ROOT + "/cygx/reportSelection/articleHistoryExport?ArticleId=" + id + "&Source=3&" + localStorage.getItem("auth") || "";
+      return url;
+    },
+    //选择后的事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getList();
+    },
+    //发布，取消发布，删除
+    operationBtn(id, value) {
+      this.$confirm(`确定${value}该文章吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          if (value == "删除") {
+            const res = await raiInterface.researchSummaryDelete({ ArticleId: id });
+            if (res.Ret === 200) {
+              this.$message.success("删除成功！");
+              let page_num = Math.ceil((this.total - 1) / this.PageSize);
+              if (this.page_no > page_num) {
+                this.page_no = page_num;
+              }
+              this.getList();
+            }
+          } else {
+            const res = await raiInterface.researchSummaryPublishAndCancel({ ArticleId: id });
+            if (res.Ret === 200) {
+              this.$message.success(value + "成功！");
+              this.getList();
+            }
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消${value}`,
+          });
+        });
+    },
+    //文章详情
+    goDetail(row) {
+      let url =
+        process.env.NODE_ENV === "production"
+          ? "https://web.hzinsights.com/summary/2"
+          : process.env.NODE_ENV === "test"
+          ? "https://clpttest.hzinsights.com/summary/2"
+          : "https://clpttest.hzinsights.com/summary/2";
+      let href = `${url}/${row.ArticleId}`;
+      window.open(href, "_blank");
+    },
+    //去往编辑页面
+    editReport(id) {
+      this.$router.push({
+        path: "/editThisWeek",
+        query: { id },
+      });
+    },
+    //分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getList();
+    },
+    //table表头Pu/Uv自定义
+    renderHeader(h, { column, $index }) {
+      return h("div", { attrs: { style: "padding:0;" } }, [
+        h("span", column.label),
+        h("el-tooltip", { props: { placement: "top" } }, [
+          h(
+            "p",
+            { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } },
+            "pv：报告被打开的次数，每次打开都计算一次（只统计有权限用户）"
+          ),
+          h(
+            "p",
+            { slot: "content", attrs: { style: "display:block;padding:5px 0;width:420px;" } },
+            "uv：访问报告的人数，每篇报告同一个人访问只计算一次（只统计有权限用户）"
+          ),
+          h("el-button", { props: { icon: "el-icon-info" }, attrs: { style: "border:none;background:none" } }, ""),
+        ]),
+      ]);
+    },
+    emailGroup(row) {
+      this.$confirm("确定要对正式/试用客户群发该报告吗？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = await raiInterface.researchSummarySendMail({
+            ArticleId: row.ArticleId,
+          });
+          if (res.Ret === 200) {
+            this.$message.success("发送成功");
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: `已取消`,
+          });
+        });
+    },
+    // 可见范围
+    async reportVisibleRange(item) {
+      const res = await raiInterface.researchSummaryVisibleRange({
+        ArticleId: item.ArticleId,
+      });
+      if (res.Ret === 200) {
+        this.$message.success("操作成功");
+        this.getList();
+      } else {
+        this.getList();
+      }
+    },
+  },
+  /* 页面进入前是否清除参数 */
+  beforeRouteEnter(to, from, next) {
+    if (from.path != "/editThisWeek") {
+      sessionStorage.removeItem("theLastWeek");
+    }
+    next();
+  },
+  /* 页面跳转前记录参数 */
+  beforeRouteLeave(to, from, next) {
+    let backData = {
+      page_no: this.page_no,
+      status: this.status, //状态
+      issueTime: this.issueTime, //时间
+    };
+    sessionStorage.setItem("theLastWeek", JSON.stringify(backData));
+    next();
+  },
+};
+</script>
+<style scoped lang="scss">
+.container-the-last-week {
+  .top-box {
+    display: flex;
+    justify-content: space-between;
+    height: 40px;
+    margin-bottom: 30px;
+    .top-container {
+      .el-select {
+        margin-right: 20px;
+      }
+    }
+    .el-button {
+      padding: 0 30px;
+      height: 40px;
+    }
+  }
+  .mx-datepicker {
+    width: 220px !important;
+    margin-right: 25px;
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>

src/views/rai_manage/reportManage/yanXuanSpecial.vue

@@ -0,0 +1,414 @@
+<template>
+  <div class="container yanxuan-special_container">
+    <el-card style="margin-bottom: 20px">
+      <span @click="tlableClickHandler(item)" :class="['top-table-item', item.value == topLableActive && 'top-table-item-active']" v-for="item in topLableList" :key="item.value">{{ item.name }}</span>
+    </el-card>
+    <el-card>
+      <template v-if="topLableActive == 1">
+        <div class="report-stuts-content">
+          <span
+            @click="reportStatusClickHandler(item)"
+            :class="['top-table-item', 'report-stuts-list', item.value == reportStatusActive && 'top-table-item-active']"
+            v-for="item in reportStutsList"
+            :key="item.value"
+            >{{ item.name }}</span
+          >
+        </div>
+        <div style="margin-bottom: 20px" v-if="reportStatusActive == 2">
+          <el-select placeholder="请选择文章类型" clearable v-model="reportStatus" @change="conditionChange">
+            <el-option
+              v-for="item in [
+                { label: '笔记', value: 1 },
+                { label: '观点', value: 2 },
+              ]"
+              :label="item.label"
+              :key="item.value"
+              :value="item.value"
+            />
+          </el-select>
+          <date-picker style="margin: 0 20px; width: 240px" v-model="issueTime" type="date" range placeholder="发布时间" value-type="format" @change="conditionChange"> </date-picker>
+          <el-input @input="reportTitleHandle" v-model="reportTitle" placeholder="请输入文章标题" clearable style="display: inline-block; width: 240px">
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+      </template>
+      <div v-else style="margin-bottom: 20px; display: flex; justify-content: space-between">
+        <div>
+          <el-select style="margin-right: 20px" placeholder="作者状态" clearable v-model="authorStatus" @change="conditionChange">
+            <el-option
+              v-for="item in [
+                { label: '启用', value: 1 },
+                { label: '禁用', value: 2 },
+              ]"
+              :label="item.label"
+              :key="item.value"
+              :value="item.value"
+            />
+          </el-select>
+          <el-input @input="authorColumnValueHandler" v-model="authorColumnValue" placeholder="请输入专栏名称" clearable style="display: inline-block; width: 240px">
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+        <div>
+          <el-button type="primary" @click="addAuthorDlgVisible = true">新建作者</el-button>
+        </div>
+      </div>
+      <div>
+        <el-table :data="tableData" border @sort-change="sortChangeHandle">
+          <template v-if="topLableActive == 1">
+            <el-table-column
+              v-for="item in reportTableColums"
+              :width="item.widthsty"
+              :key="item.key"
+              :prop="item.key"
+              :label="item.label"
+              align="center"
+              :sortable="item.label == 'PV/UV' ? 'custom' : false"
+            >
+              <template slot-scope="{ row }">
+                <span v-if="item.label != 'PV/UV'" @click="handleRowClick(row, item.key)" :style="handleRowStyle(item.key)">{{ handleRowContent(row, item.key) }}</span>
+                <div class="pv-uv-download" v-else>
+                  <span>{{ row.Pv }} / {{ row.Uv }}</span>
+                  <a :href="exportPvUv(row.Id)" download>
+                    <img src="~@/assets/img/rai_m/pvuv_download.png" alt="" />
+                  </a>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作" align="center" v-if="reportStatusActive != 2">
+              <template slot-scope="{ row }">
+                <span class="editsty" v-if="reportStatusActive == 3" @click="reasonRejection(row)">驳回理由</span>
+                <span class="editsty" v-if="reportStatusActive == 1" @click="toExamineHandler(row)">审核</span>
+              </template>
+            </el-table-column>
+          </template>
+          <template v-else>
+            <el-table-column v-for="item in authorTableColums" :width="item.widthsty" :key="item.key" :prop="item.key" :label="item.label" align="center" :sortable="isShowSortable(item)">
+              <template slot-scope="{ row }">
+                <span v-if="item.label != '总PV/UV'" @click="handleRowClick(row, item.key)" :style="handleRowStyle(item.key)">{{ handleRowContent(row, item.key) }}</span>
+                <span v-else>{{ row.Pv }} / {{ row.Uv }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="状态" align="center" width="200">
+              <template slot-scope="{ row }">
+                <el-switch
+                  active-color="#13ce66"
+                  inactive-color="#ff4949"
+                  @change="switchChangeHandler(row)"
+                  v-model="row.Status"
+                  :active-value="1"
+                  :inactive-value="2"
+                  active-text="已启用"
+                  inactive-text="已禁用"
+                ></el-switch>
+              </template>
+            </el-table-column>
+          </template>
+        </el-table>
+        <!-- 分页 -->
+        <el-col :span="24" class="toolbar">
+          <m-page :total="total" :page_no="page_no" :pageSize="10" @handleCurrentChange="handleCurrentChange" />
+        </el-col>
+      </div>
+    </el-card>
+    <collect-fans-dlg :iscollectFansDlgShow.sync="iscollectFansDlgShow" :collectFansDlgText.sync="collectFansDlgText" :collectFansDlgItem.sync="collectFansDlgItem" />
+    <special-dlg :addAuthorDlgVisible.sync="addAuthorDlgVisible" :submitRejectDlgVisible.sync="submitRejectDlgVisible" :submitRejectId="submitRejectId" />
+  </div>
+</template>
+
+<script>
+import { TopLableList, ReportStutsList, TableColums, AuthorTableColums } from "./components/yanXuanLable";
+import { raiInterface } from "@/api/api.js";
+import mPage from "@/components/mPage.vue";
+import CollectFansDlg from "./components/collectFansDlg.vue";
+import SpecialDlg from "./components/specialDlg.vue";
+
+export default {
+  name: "",
+  components: { mPage, CollectFansDlg, SpecialDlg },
+  props: {},
+  data() {
+    return {
+      page_no: 1,
+      total: 0, //条数
+      PageSize: 10, //每页显示几条
+      topLableActive: 1,
+      reportStatusActive: 1,
+      tableData: [],
+      reportStatus: "", //文章类型
+      authorStatus: "", // 作者状态
+      reportTitle: "", //文章标题
+      issueTime: [], // 文章发布时间
+      authorColumnValue: "", // 专栏名称
+      iscollectFansDlgShow: false,
+      collectFansDlgText: "",
+      collectFansDlgItem: {},
+      addAuthorDlgVisible: false,
+      topLableList: [],
+      sortType: "",
+      sortParam: "",
+    };
+  },
+  computed: {
+    // 头部lable
+
+    // 文章的状态
+    reportStutsList() {
+      return ReportStutsList;
+    },
+    reportTableColums() {
+      return TableColums(this.reportStatusActive);
+    },
+    authorTableColums() {
+      return AuthorTableColums;
+    },
+  },
+  mounted() {
+    this.getYanxuanShowButton();
+    this.getyanxuanReportSpecial();
+  },
+  methods: {
+    // 点击了头部的tlble
+    tlableClickHandler(item) {
+      this.topLableActive = item.value;
+      this.page_no = 1;
+      this.getyanxuanReportSpecial();
+    },
+    // 文章的状态点击
+    reportStatusClickHandler(item) {
+      this.reportStatusActive = item.value;
+      this.page_no = 1;
+      this.getyanxuanReportSpecial();
+    },
+    /* 表格行的样式 */
+    handleRowStyle(key) {
+      if (key == "Title" && this.reportStatusActive == 2) {
+        return "color: #409eff; cursor: pointer";
+      } else if ((key == "SpecialName" && (this.reportStatusActive == 2 || this.reportStatusActive == 3)) || (key == "SpecialName" && this.topLableActive == 2)) {
+        return "color: #409eff; cursor: pointer";
+      } else if (key == "ArticleCollectNum" && this.topLableActive == 1) {
+        return "color: #409eff; cursor: pointer";
+      } else {
+        const style = {
+          FansNum: "color: #409eff; cursor: pointer",
+        };
+        return style[key] ? style[key] : "";
+      }
+    },
+    /* 表格行的点击事件 */
+    handleRowClick(row, key) {
+      if (key === "Title" && this.reportStatusActive == 2) {
+        let href = `${process.env.CYGX_WEB}/column/detail/${row.Id}`;
+        window.open(href, "_blank");
+      } else if (key === "SpecialName" && (this.reportStatusActive == 2 || this.reportStatusActive == 3 || this.topLableActive == 2)) {
+        let href = `${process.env.CYGX_WEB}/column/view/${row.SpecialAuthorId}`;
+        window.open(href, "_blank");
+      } else if ((key === "ArticleCollectNum" && this.topLableActive == 1) || key === "FansNum") {
+        // 收藏的数量
+        this.iscollectFansDlgShow = true;
+        this.collectFansDlgText = key === "ArticleCollectNum" ? "收藏详情" : "粉丝详情";
+        this.collectFansDlgItem = row;
+      }
+    },
+    /* 表格行的数据处理 */
+    handleRowContent(row, key) {
+      if (key == "Type") {
+        return row[key] == 1 ? "笔记" : "观点";
+      } else if (key == "Source") {
+        return row[key] == 1 ? "纪要" : row[key] == 2 ? "图表" : row[key] == 3 ? "纪要/图表" : row[key] == 4 ? "产业资源包" : row[key] == 5 ? "报告" : "活动";
+      } else if (key == "ActivityType") {
+        return row[key] == 1 ? "线上" : `线下(${row["City"]})`;
+      } else if (key == "RegisterPlatform") {
+        return row[key] == 1 ? "小程序" : row[key] == 2 ? "网页版" : row[key] == 3 ? "策略平台" : "";
+      } else {
+        return row[key];
+      }
+    },
+    // 是否显示
+    isShowSortable(item) {
+      return item.label == "总PV/UV" || item.label == "开通时间" || item.label == "已发布文章" ? "custom" : false;
+    },
+    // 排序事件
+    sortChangeHandle(params) {
+      this.page_no = 1;
+      this.sortType = params.order === "descending" ? "desc" : "asc";
+      this.sortParam = params.prop;
+      this.getyanxuanReportSpecial();
+    },
+    // 选择的change事件
+    conditionChange() {
+      this.page_no = 1;
+      this.getyanxuanReportSpecial();
+    },
+    // 获取数据
+    async getyanxuanReportSpecial() {
+      let params = {
+        CurrentIndex: this.page_no,
+        PageSize: this.PageSize,
+        Status: this.topLableActive == 1 ? this.reportStatusActive : this.authorStatus,
+        KeyWord: this.topLableActive == 1 ? this.reportTitle : this.authorColumnValue,
+        Type: this.reportStatus,
+        StartDate: this.issueTime[0],
+        EndDate: this.issueTime[1],
+        SortType: this.sortType,
+        SortParam: this.sortParam,
+      };
+      const res =
+        this.topLableActive == 1 && (this.reportStatusActive == 1 || this.reportStatusActive == 2)
+          ? await raiInterface.yanxuanReportSpecial(params)
+          : this.topLableActive == 1 && this.reportStatusActive == 3
+          ? await raiInterface.yanxuanApprovalLogList(params)
+          : this.topLableActive == 2
+          ? await raiInterface.getYanxuanSpecialAuthor(params)
+          : "";
+      if (res.Ret === 200) {
+        this.tableData = res.Data.List || [];
+        this.total = res.Data.Paging.Totals;
+      }
+    },
+    // 审核
+    toExamineHandler(item) {
+      let href = `${process.env.CYGX_WEB}/column/check/${item.Id}`;
+      window.open(href, "_blank");
+    },
+    // 下载pv/uv 地址
+    exportPvUv(id) {
+      const url = process.env.API_ROOT + "/cygx/yanxuan_special/list_pv?SpecialId=" + id + "&" + localStorage.getItem("auth") || "";
+      return url;
+    },
+    // 分页
+    handleCurrentChange(page) {
+      this.page_no = page;
+      this.getyanxuanReportSpecial();
+    },
+    // 驳回理由
+    reasonRejection(item) {
+      this.$alert(item.Reason, "驳回理由", {
+        confirmButtonText: "确定",
+        customClass: "yanxuan-special-msg-box",
+        callback: (action) => {},
+      });
+    },
+    // 作者的禁用启用
+    async switchChangeHandler(item) {
+      const res = await raiInterface.yanxuan_specialAuthorEnable({
+        UserId: item.UserId,
+        Status: item.Status,
+      });
+      if (res.Ret === 200) {
+        this.$message.success("操作成功!");
+      }
+    },
+    authorColumnValueHandler() {
+      this.reportStatus = ""; //文章类型
+      this.authorStatus = ""; // 作者状态
+      this.reportTitle = ""; //文章标题
+      this.issueTime = []; // 文章发布时间
+      this.page_no = 1;
+      this.getyanxuanReportSpecial();
+    },
+    reportTitleHandle() {
+      this.reportStatus = ""; //文章类型
+      this.authorStatus = ""; // 作者状态
+      this.issueTime = []; // 文章发布时间
+      this.authorColumnValue = "";
+      this.page_no = 1;
+      this.getyanxuanReportSpecial();
+    },
+    // 隐藏作者按钮
+    async getYanxuanShowButton() {
+      const res = await raiInterface.getYanxuanShowButton();
+      if (res.Ret === 200) {
+        let { IsShowSpecialAuthor } = res.Data;
+        if (IsShowSpecialAuthor) {
+          this.topLableList = TopLableList;
+        } else {
+          this.topLableList = [TopLableList[0]];
+        }
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.yanxuan-special_container {
+  .top-table-item {
+    display: inline-block;
+    margin-right: 30px;
+    text-align: center;
+    width: 120px;
+    height: 40px;
+    line-height: 40px;
+    border-radius: 4px;
+    color: #409eff;
+    background-color: #ecf5ff;
+    border: 1px solid #b3d8ff;
+    cursor: pointer;
+  }
+  .report-stuts-content {
+    margin-bottom: 20px;
+    span:nth-child(2) {
+      position: relative;
+      margin: 0 60px 0 30px;
+      &::before {
+        content: "";
+        position: absolute;
+        left: -30px;
+        top: 10px;
+        display: inline-block;
+        width: 2px;
+        height: 20px;
+        background: #000;
+      }
+      &::after {
+        content: "";
+        position: absolute;
+        right: -30px;
+        top: 10px;
+        display: inline-block;
+        width: 2px;
+        height: 20px;
+        background: #000;
+      }
+    }
+  }
+  .report-stuts-list {
+    color: #000;
+    background-color: rgba(255, 255, 255, 0.5);
+    border: none;
+  }
+  .top-table-item-active {
+    color: #fff;
+    background-color: #409eff;
+    border: none;
+    opacity: 1;
+  }
+  .pv-uv-download {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    img {
+      width: 14px;
+      height: 14px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>
+<style lang="scss">
+.yanxuan-special-msg-box {
+  border: none;
+  .el-message-box__header {
+    background: #3385ff;
+    .el-message-box__title,
+    .el-message-box__close {
+      color: #fff !important;
+    }
+  }
+  .el-message-box__btns {
+    text-align: center;
+    margin-top: 20px;
+  }
+}
+</style>

src/views/rai_manage/reportManage/yanxuan.vue

@@ -0,0 +1,356 @@
+<template>
+  <div class="container yanxuan-special_container">
+    <div class="author-content">
+      <div class="top">
+        <div>专栏作者</div>
+        <el-button type="primary" @click="addAuthorDlgVisible = true">新建作者</el-button>
+      </div>
+      <div class="author-ul">
+        <div class="author-li" v-for="item in authorInfoData" :key="item.Id">
+          <div class="avatar">
+            <img :src="item.HeadImg" alt="" />
+          </div>
+          <div class="info-content">
+            <p class="info-name">{{ item.SpecialName }}</p>
+            <p>昵称：{{ item.NickName }}</p>
+            <p>{{ item.RealName }}-{{ item.Mobile }}</p>
+            <p>{{ item.CompanyName }}</p>
+          </div>
+          <div class="switch-box">
+            <el-switch style="display: block" @change="switchAuthorChange(item)" v-model="item.Status" :active-value="1" :inactive-value="2" active-color="#13ce66" inactive-color="#ff4949">
+            </el-switch>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="examine-content">
+      <p>待审核内容</p>
+      <template v-if="specialListData.length > 0">
+        <div class="content-box-examine" v-for="item in specialListData" :key="item.Id">
+          <div class="info-box" style="margin-bottom: 20px">
+            <div class="avatar">
+              <img :src="item.HeadImg" alt="" />
+            </div>
+            <div class="info-content">
+              <p class="info-name">{{ item.NickName || item.RealName }}</p>
+              <p>{{ item.PublishTime }}</p>
+            </div>
+          </div>
+          <div class="content-detial" v-html="item.Content"></div>
+          <div class="look-all-txt" v-if="item.ContentHasImg || item.isShowBtn" @click="lookAllDetails(item)">查看全文</div>
+          <div class="file-box" v-for="(key, indexs) in item.Docs" :key="indexs" @click="handleOperation(key)">
+            <img :src="key.DocIcon" alt="" />
+            {{ key.DocName }}.{{ key.DocSuffix }}
+          </div>
+          <div class="img-box">
+            <template v-if="item.ImgUrl">
+              <!-- <el-image style="width: 112px; height: 112px" fit="fill" v-for="(key, index) in item.ImgUrl.split(',')" :key="index" :src="key" :preview-src-list="item.ImgUrl.split(',')"> </el-image> -->
+              <img style="width: 112px; height: 112px" v-for="(key, index) in item.ImgUrl.split(',')" :key="index" :src="key" @click="showPreviewHandles(key)" />
+            </template>
+          </div>
+          <div>
+            <template v-if="item.Tags">
+              <div class="lable-li" v-for="(key, index) in item.Tags.split(',')" :key="index">{{ key }}</div>
+            </template>
+          </div>
+          <div class="bottom-button">
+            <div @click="submitRejectDlgHandler(item)">驳回</div>
+            <div @click="openMessage(item)">通过</div>
+          </div>
+        </div>
+      </template>
+      <div class="no-data" v-else>
+        <div style="text-align: center">
+          <img src="~@/assets/img/data_m/table_no.png" alt="" style="display: block; width: 135px; height: 112px; margin: 0 auto" />
+          <span>暂无数据</span>
+        </div>
+      </div>
+    </div>
+    <special-dlg :addAuthorDlgVisible.sync="addAuthorDlgVisible" :submitRejectDlgVisible.sync="submitRejectDlgVisible" :submitRejectId="submitRejectId" />
+    <el-image-viewer v-if="showPreview" :urlList="previewImages" :on-close="closeViewer" :zIndex="99999"></el-image-viewer>
+  </div>
+</template>
+
+<script>
+import ElImageViewer from "element-ui/packages/image/src/image-viewer";
+import SpecialDlg from "./components/specialDlg.vue";
+import { raiInterface } from "@/api/api.js";
+import { async } from "@antv/x6/lib/registry/marker/async";
+export default {
+  name: "",
+  components: { SpecialDlg, ElImageViewer },
+  props: {},
+  data() {
+    return {
+      addAuthorDlgVisible: false,
+      submitRejectDlgVisible: false, // 驳回的显示
+      submitRejectId: 0, // 驳回的ID
+      authorInfoData: [], // 作者信息列表
+      specialListData: [], // 审核列表
+      showPreview: false, //
+      previewImages: [],
+    };
+  },
+  watch: {},
+  created() {},
+  mounted() {
+    this.getAuthorList();
+    this.getSpecialList();
+    this.$nextTick(() => {});
+    // let rowNum = Math.round($(".content-detial").height() / parseFloat($(".content-detial").css("line-height")));
+  },
+  methods: {
+    showPreviewHandles(item) {
+      console.log(123);
+      this.showPreview = true;
+      this.previewImages = [item];
+    },
+    closeViewer() {
+      this.showPreview = false;
+      document.querySelector("body").classList.remove("el-popup-imageView--hidden");
+    },
+    // 审核通过的确认按钮
+    openMessage(item) {
+      this.$confirm("确定通过此内容在小程序展示吗？", "审核通过", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(async () => {
+          const res = await raiInterface.yanxuan_specialEnable({
+            Id: item.Id,
+            Status: 1,
+          });
+          if (res.Ret === 200) {
+            this.$message.success("审核成功!");
+            this.getSpecialList();
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消",
+          });
+        });
+    },
+    // 获取作者列表
+    async getAuthorList() {
+      const res = await raiInterface.yanxuan_specialAuthorList();
+      if (res.Ret === 200) {
+        this.authorInfoData = res.Data || [];
+      }
+    },
+    // 作者的关闭或者打开
+    async switchAuthorChange(item) {
+      const res = await raiInterface.yanxuan_specialAuthorEnable({
+        UserId: item.UserId,
+        Status: item.Status,
+      });
+      if (res.Ret === 200) {
+        this.$message.success("操作成功!");
+      }
+    },
+    // 审核列表
+    async getSpecialList() {
+      const res = await raiInterface.yanxuan_specialList();
+      if (res.Ret === 200) {
+        this.specialListData = res.Data || [];
+
+        this.$nextTick(() => {
+          this.specialListData.forEach((item, index) => {
+            let h = document.getElementsByClassName("content-detial")[index].clientHeight;
+            this.$set(item, "isShowBtn", h >= 134 ? true : false);
+          });
+        });
+      }
+    },
+    // 驳回的弹框显示
+    submitRejectDlgHandler(item) {
+      this.submitRejectId = item.Id;
+      this.submitRejectDlgVisible = true;
+    },
+    handleOperation: _.debounce(function (item) {
+      const url = item.DocUrl;
+      if (!url) {
+        this.$message.warning("文件错误");
+        return;
+      }
+      const reg = /\.(pdf)$/;
+      // pdf
+      if (reg.test(url)) {
+        window.open(url, "_blank");
+      } else {
+        window.open("https://view.officeapps.live.com/op/view.aspx?src=" + url, "_blank");
+      }
+    }, 200),
+    lookAllDetails(item) {
+      let url =
+        process.env.NODE_ENV === "production"
+          ? `https://web.hzinsights.com/column/detail/${item.Id}`
+          : process.env.NODE_ENV === `test`
+          ? `https://clpttest.hzinsights.com/column/detail/${item.Id}`
+          : `https://clpttest.hzinsights.com/column/detail/${item.Id}`;
+      window.open(url, "_blank");
+    },
+  },
+};
+</script>
+<style lang="scss">
+div {
+  box-sizing: border-box;
+}
+.yanxuan-special_container {
+  display: flex;
+  justify-content: space-between;
+  .author-content {
+    width: 400px;
+    height: calc(100vh - 118px);
+    border-radius: 4px;
+    background-color: #fff;
+    padding: 20px;
+    box-sizing: border-box;
+    flex-shrink: 0;
+    .top {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+    .author-ul {
+      padding-bottom: 10px;
+      height: 100%;
+      overflow: hidden;
+      overflow-y: auto;
+      .author-li {
+        flex: 1;
+        padding: 20px;
+        display: flex;
+        justify-content: space-between;
+        border-bottom: 1px solid #dcdfe6;
+        margin: 10px 0;
+        .switch-box {
+          width: 30px;
+          flex-shrink: 0;
+        }
+      }
+    }
+  }
+  .info-content {
+    flex: 1;
+    padding-left: 16px;
+    color: #999999;
+    p {
+      margin: 5px 0;
+    }
+  }
+  .avatar {
+    width: 48px;
+    height: 48px;
+    border-radius: 50%;
+    overflow: hidden;
+    background: #d9d9d9;
+    flex-shrink: 0;
+    img {
+      width: 48px;
+      height: 48px;
+    }
+  }
+  .info-name {
+    font-size: 16px;
+    color: #333;
+    font-weight: 500;
+  }
+  .examine-content {
+    margin-left: 20px;
+    padding: 20px;
+    flex: 1;
+    background: #fff;
+    flex-direction: 0;
+    overflow: hidden;
+    .no-data {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+    .content-box-examine {
+      padding: 30px 0;
+      border-bottom: 1px solid #dcdfe6;
+    }
+    .info-box {
+      display: flex;
+    }
+    .content-detial {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+      -webkit-line-clamp: 8;
+      img {
+        width: 100%;
+        max-height: 300px;
+      }
+    }
+    .look-all-txt {
+      color: #409eff;
+      font-size: 16px;
+      margin-top: 20px;
+      cursor: pointer;
+    }
+    .file-box {
+      display: flex;
+      align-items: center;
+      margin-top: 20px;
+      height: 64px;
+      cursor: pointer;
+      img {
+        width: 27px;
+        height: 27px;
+        margin-right: 15px;
+      }
+    }
+    .img-box {
+      margin: 20px 0;
+      height: 112px;
+      img {
+        object-fit: fill !important;
+        cursor: pointer;
+        margin-right: 20px;
+      }
+    }
+    .lable-li {
+      display: inline-block;
+      padding: 4px 20px;
+      height: 28px;
+      border-radius: 48px;
+      margin: 0 15px 15px 0;
+      border: 1px solid #409eff;
+      background-color: #eaf3fe;
+      color: #409eff;
+    }
+    .bottom-button {
+      margin: 50px;
+      display: flex;
+      justify-content: center;
+      color: #fff;
+      div {
+        cursor: pointer;
+        width: 120px;
+        height: 40px;
+        padding: 10px 46px 10px 46px;
+        border-radius: 4px;
+        background: #c54322;
+      }
+      div:nth-child(2) {
+        margin-left: 20px;
+        background: #67c23a;
+      }
+    }
+  }
+}
+/deep/.el-image {
+  img {
+    object-fit: fill !important;
+  }
+}
+</style>