联系人列表；客户名单匹配；开票到款统计；终止权限列表；全量客户列表

src/router/modules/customRoutes.js

@@ -47,12 +47,15 @@ export default [
       //       pathName: '正式客户共享'
       //   }
       // },
-      // {
-      //   path: "customAllList",
-      //   component: () => import("@/views/custom_manage/customList/customAllList.vue"),
-      //   name: "全量客户列表",
-      //   hidden: false,
-      // },
+      {
+        path: "customAllList",
+        component: () => import("@/views/custom_manage/custom/customAllList.vue"),
+        name: "customAllList",
+        hidden: false,
+        meta: {
+          title: '全量客户列表'
+        }
+      },
       // {
       //   path: "customListEn",
       //   component: () => import("@/views/custom_manage/customList/customListEn.vue"),
@@ -68,18 +71,24 @@ export default [
           title: '海外客户列表'
         }
       },
-      // {
-      //   path: "trialContactListEn",
-      //   component: () => import("@/views/custom_manage/customList/limitContactListEn.vue"),
-      //   name: "临时权限列表",
-      //   hidden: false,
-      // },
-      // {
-      //   path: "freezeContactListEn",
-      //   component: () => import("@/views/custom_manage/customList/limitContactListEn.vue"),
-      //   name: "终止权限列表",
-      //   hidden: false,
-      // },
+      {
+        path: "trialContactListEn",
+        component: () => import("@/views/custom_manage/custom/limitContactListEn.vue"),
+        name: "trialContactListEn",
+        hidden: false,
+        meta: {
+          title: '临时权限列表'
+        }
+      },
+      {
+        path: "freezeContactListEn",
+        component: () => import("@/views/custom_manage/custom/limitContactListEn.vue"),
+        name: "freezeContactListEn",
+        hidden: false,
+        meta: {
+          title: '终止权限列表'
+        }
+      },
       // {
       //   path: "pickList",
       //   name: "领取列表",
@@ -238,12 +247,15 @@ export default [
           title: '官网试用申请'
         },
       },
-      // {
-      //   path: "userFiccApplyList",
-      //   name: "用户申请列表",
-      //   component: () => import("@/views/ficc_manage/userApplication.vue"),
-      //   hidden: false,
-      // },
+      {
+        path: "userFiccApplyList",
+        name: "userFiccApplyList",
+        component: () => import("@/views/ficc_manage/userApplication.vue"),
+        hidden: false,
+        meta: {
+          title: '用户申请列表',
+        }
+      },
       {
         path: "regionCustomerList",
         component: () => import("@/views/custom_manage/custom/regionCustom.vue"),
@@ -265,15 +277,15 @@ export default [
       //     keepAlive: false,
       //   },
       // },
-      // {
-      //   path: "contactsList",
-      //   component: () => import("@/views/custom_manage/contacts/contactsList.vue"),
-      //   name: "联系人列表",
-      //   hidden: false,
-      //   meta: {
-      //     keepAlive: false,
-      //   },
-      // },
+      {
+        path: "contactsList",
+        component: () => import("@/views/custom_manage/contacts/contactsList.vue"),
+        name: "联系人列表",
+        hidden: false,
+        meta: {
+          keepAlive: false,
+        },
+      },
       // {
       //   path: "mutualList",
       //   name: "互动列表",
@@ -307,12 +319,15 @@ export default [
       //     keepAlive: false,
       //   },
       // },
-      // {
-      //   path: "customerlistmatch",
-      //   name: "客户名单匹配",
-      //   component: () => import("@/views/custom_manage/listMatch.vue"),
-      //   hidden: false,
-      // },
+      {
+        path: "customerlistmatch",
+        name: "customerListMatch",
+        component: () => import("@/views/custom_manage/custom/listMatch.vue"),
+        hidden: false,
+        meta: {
+          title: '客户名单匹配'
+        }
+      },
       {
         path: "etaTrialList",
         component: () => import("@/views/custom_manage/etaTrial/etaTrialList.vue"),
@@ -380,12 +395,15 @@ export default [
           pathName: "ETA试用",
         },
       },
-      // {
-      //   path: "customerContractStatistics",
-      //   component: () => import("@/views/custom_manage/contractStatistics.vue"),
-      //   name: "开票到款统计",
-      //   hidden: false,
-      // },
+      {
+        path: "customerContractStatistics",
+        component: () => import("@/views/custom_manage/custom/contractStatistics.vue"),
+        name: "customerContractStatistics",
+        hidden: false,
+        meta: {
+          title: '开票到款统计'
+        }
+      },
       // {
 			// 	path: "ficcApplyList",
 			// 	name: 'ficc申请记录',

src/views/custom_manage/contacts/compontents/chartItem.vue

@@ -0,0 +1,81 @@
+<template>
+  <div class="chart-item-wrap">
+    <span class="synopsis-btn">{{ companyName ? companyName + "--" : "" }}{{ chartData.RealName }} -- {{ chartData.Mobile }}</span>
+    <div style="margin-top: 20px" class="chart-list" v-infinite-scroll="load" :infinite-scroll-distance="0">
+      <div class="chart-item" v-for="key in chartData.ListChart" :key="key.ChartId" @click="chartDetial(key)">
+        <img class="item-img" :src="key.BodyHtml" />
+        <p class="text_twoLine title-chart">{{ key.Title }}</p>
+        <div class="chart-tag">
+          <template v-if="key.CtagNamePc">
+            <span class="tag-item" v-for="val in key.CtagNamePc.split(',')" :key="val">{{ val }}</span>
+          </template>
+        </div>
+        <p class="tiem">收藏时间:{{ key.CreateDate }}</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { customInterence, equityContacts } from "@/api/api.js";
+export default {
+  props: {
+    chartData: {},
+    companyName: {
+      type: "string",
+      default: "",
+    },
+  },
+  data() {
+    return {
+      page: 1,
+      pageSize: 18,
+      publicHaveMoveCompany: true,
+    };
+  },
+  methods: {
+    load() {
+      if (this.publicHaveMoveCompany && !this.chartData.IsEnd) {
+        this.page++;
+        this.nexttPage();
+      }
+    },
+    async nexttPage() {
+      const res = await equityContacts.getCygxMutualDetail({
+        UserId: this.chartData.UserId,
+        Source: 4,
+        PageSize: this.pageSize,
+        CurrentIndex: this.page,
+      });
+      if (res.Ret === 200) {
+        this.publicHaveMoveCompany = !res.Data.Paging.IsEnd;
+        this.chartData.ListChart = res.Data ? [...this.chartData.ListChart, ...res.Data.List] : [...this.chartData.ListChart];
+      }
+    },
+    chartDetial(item) {
+      window.open(item.HttpUrl, "_blank");
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.chart-item-wrap {
+  @import "./details.scss";
+  .synopsis-btn {
+    margin-top: 20px;
+    display: inline-block;
+    height: 32px;
+    padding: 0 20px;
+    background: #eaf2ff;
+    border-radius: 2px;
+    border: 1px solid #3385ff;
+    color: #3385ff;
+    line-height: 30px;
+  }
+  .chart-list {
+    height: auto !important;
+    max-height: 720px !important;
+  }
+}
+</style>

src/views/custom_manage/contacts/compontents/contactsColums.js

@@ -0,0 +1,1103 @@
+//表格列
+export const tableColums = (type) => {
+  return type === 1
+    ? [
+        {
+          label: "报告标题",
+          key: "Title",
+          minwidthsty: 140,
+        },
+        {
+          label: "所属行业",
+          key: "PermissionName",
+          widthsty: 80,
+        },
+        {
+          label: "所属产业",
+          key: "IndustryName",
+        },
+        {
+          label: "关联标的",
+          key: "SubjectNameStr",
+        },
+        {
+          label: "发布时间",
+          key: "PublishDate",
+        },
+        {
+          label: "阅读时间",
+          key: "CreateTime",
+        },
+        {
+          label: "阅读时长",
+          key: "StopTime",
+          widthsty: 80,
+        },
+        {
+          label: "阅读来源",
+          key: "RegisterPlatform",
+          widthsty: 80,
+        },
+      ]
+    : type === 3
+    ? [
+        {
+          label: "报告标题",
+          key: "Title",
+          minwidthsty: 140,
+        },
+        {
+          label: "收藏时间",
+          key: "CreateTime",
+        },
+        {
+          label: "发布时间",
+          key: "PublishDate",
+        },
+        {
+          label: "报告类型",
+          key: "MatchTypeName",
+        },
+        {
+          label: "所属产业",
+          key: "IndustryName",
+        },
+        {
+          label: "关联标的",
+          key: "SubjectNameStr",
+        },
+      ]
+    : type === 4
+    ? []
+    : type === 2
+    ? [
+        {
+          label: "活动名称",
+          key: "ActivityName",
+          minwidthsty: 140,
+        },
+        {
+          label: "所属行业",
+          key: "PermissionName",
+          widthsty: 80,
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypeName",
+          widthsty: 140,
+        },
+        {
+          label: "活动主题",
+          key: "Label",
+        },
+        {
+          label: "活动时间",
+          key: "ActivityTime",
+        },
+        {
+          label: "是否到会",
+          key: "IsMeeting",
+          widthsty: 80,
+        },
+        {
+          label: "首次入会时间",
+          key: "FirstMeetingTime",
+        },
+        {
+          label: "最后退出时间",
+          key: "LastMeetingTime",
+        },
+        {
+          label: "参与总时长",
+          key: "Duration",
+          widthsty: 100,
+        },
+        {
+          label: "参会方式",
+          key: "MeetingTypeStr",
+          widthsty: 80,
+        },
+        {
+          label: "参会鉴权",
+          key: "MeetingAuthentication",
+          widthsty: 80,
+        },
+        {
+          label: "参会状态",
+          key: "MeetingStatusStr",
+          widthsty: 80,
+        },
+      ]
+    : type === 5
+    ? [
+        {
+          label: "产业名称",
+          key: "IndustryName",
+        },
+        {
+          label: "关联标的",
+          key: "SubjectNameStr",
+        },
+        {
+          label: "关注时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 6
+    ? [
+        {
+          label: "作者昵称",
+          key: "NickName",
+        },
+        {
+          label: "作者相关产业",
+          key: "IndustryName",
+        },
+        {
+          label: "相关标的",
+          key: "SubjectNameStr",
+        },
+        {
+          label: "关注时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 7
+    ? [
+        {
+          label: "搜索词",
+          key: "KeyWord",
+        },
+        {
+          label: "搜索时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 8
+    ? [
+        {
+          label: "调研主题",
+          key: "ActivityName",
+          minwidthsty: "195",
+        },
+        {
+          label: "行业",
+          key: "PermissionName",
+          widthsty: 100,
+        },
+        {
+          label: "活动开始时间",
+          key: "ActivityTimeText",
+          widthsty: "300",
+        },
+        {
+          label: "调研形式",
+          key: "ActivityType",
+          widthsty: "130",
+        },
+        {
+          label: "是否到会",
+          key: "IsMeeting",
+          widthsty: 100,
+        },
+      ]
+    : type === 9
+    ? [
+        {
+          label: "文件名称",
+          key: "MediaTitle",
+        },
+        {
+          label: "文件类型",
+          key: "FileType",
+          widthsty: 200,
+        },
+        {
+          label: "播放时间",
+          key: "CreateTime",
+          widthsty: 300,
+        },
+      ]
+    : type === 10
+    ? [
+        {
+          label: "标签名称",
+          key: "TagName",
+        },
+        {
+          label: "报告系列",
+          key: "ArticleTypes",
+          // widthsty: 200,
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypes",
+          // widthsty: 300,
+        },
+        {
+          label: "相关产业",
+          key: "Industries",
+          // widthsty: 300,
+        },
+        {
+          label: "相关标的",
+          key: "SubjectNames",
+          // widthsty: 300,
+        },
+        {
+          label: "点击时间",
+          key: "CreateTime",
+          // widthsty: 300,
+        },
+    ]      
+    : [];
+};
+
+//表格列
+export const interactionColums = [
+  {
+    title: "报告阅读",
+    tableName: "List1",
+    table: [
+      {
+        label: "报告标题",
+        key: "Title",
+        minwidthsty: 140,
+      },
+      {
+        label: "阅读时间",
+        key: "CreateTime",
+      },
+      {
+        label: "阅读时长",
+        key: "StopTime",
+        widthsty: 80,
+      }
+    ],
+  },
+  {
+    title: "报告收藏",
+    tableName: "List2",
+    table: [
+      {
+        label: "报告标题",
+        key: "Title",
+        minwidthsty: 140,
+      },
+      {
+        label: "收藏时间",
+        key: "CreateTime",
+      },
+    ],
+  },
+  {
+    tableName: "List3",
+    title: "活动互动",
+    table: [
+      {
+        label: "活动名称",
+        key: "ActivityName",
+        minwidthsty: 140,
+      },
+      {
+        label: "活动形式",
+        key: "ActivityType",
+      },
+      {
+        label: "活动时间",
+        key: "ActivityTime",
+      },
+      {
+        label: "参会总时长",
+        key: "Duration",
+      },
+    ],
+  },
+  {
+    tableName: "List4",
+    title: "专项调研",
+    table: [
+      {
+        label: "调研主题",
+        key: "ActivityName",
+        minwidthsty: 140,
+      },
+      {
+        label: "行业",
+        key: "PermissionName",
+      },
+      {
+        label: "活动时间",
+        key: "ActivityTime",
+      },
+      {
+        label: "调研形式",
+        key: "ActivityType",
+      },
+    ],
+  },
+];
+
+//活动的筛选
+export const screenList = [
+  {
+    name: "线上活动",
+    key: 1,
+  },
+  {
+    name: "线下活动",
+    key: 2,
+  },
+];
+
+export const meetingList = [
+  {
+    name: "已到会",
+    key: 1,
+  },
+  {
+    name: "未到会",
+    key: 2,
+  },
+];
+
+//机构的表格列
+export const organizationTableColums = (type) => {
+  return type === 1
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "报告标题",
+          key: "Title",
+          minwidthsty: 140,
+        },
+        {
+          label: "所属行业",
+          key: "PermissionName",
+          widthsty: 80,
+        },
+        {
+          label: "所属产业",
+          key: "IndustryName",
+        },
+        {
+          label: "关联标的",
+          key: "SubjectNameStr",
+        },
+        {
+          label: "发布时间",
+          key: "PublishDate",
+        },
+        {
+          label: "阅读时间",
+          key: "CreateTime",
+        },
+        {
+          label: "阅读时长",
+          key: "StopTime",
+          widthsty: 80,
+        },
+        {
+          label: "阅读来源",
+          key: "RegisterPlatform",
+          widthsty: 80,
+        },
+        
+      ]
+    : type === 2
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "活动名称",
+          key: "ActivityName",
+          minwidthsty: 140,
+        },
+        {
+          label: "所属行业",
+          key: "PermissionName",
+          widthsty: 80,
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypeName",
+          widthsty: 140,
+        },
+        {
+          label: "活动主题",
+          key: "Label",
+        },
+        {
+          label: "活动时间",
+          key: "ActivityTime",
+        },
+        {
+          label: "是否到会",
+          key: "IsMeeting",
+          widthsty: 80,
+        },
+        {
+          label: "首次入会时间",
+          key: "FirstMeetingTime",
+          widthsty: 110,
+        },
+        {
+          label: "最后退出时间",
+          key: "LastMeetingTime",
+          widthsty: 110,
+        },
+        {
+          label: "参与总时长",
+          key: "Duration",
+          widthsty: 100,
+        },
+        {
+          label: "参会方式",
+          key: "MeetingTypeStr",
+          widthsty: 80,
+        },
+        {
+          label: "参会鉴权",
+          key: "MeetingAuthentication",
+          widthsty: 80,
+        },
+        {
+          label: "参会状态",
+          key: "MeetingStatusStr",
+          widthsty: 80,
+        },
+      ]
+    : type === 4
+    ? []
+    : type === 3
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "报告标题",
+          key: "Title",
+          minwidthsty: 140,
+        },
+        {
+          label: "收藏时间",
+          key: "CreateTime",
+        },
+        {
+          label: "发布时间",
+          key: "PublishDate",
+        },
+        {
+          label: "报告类型",
+          key: "MatchTypeName",
+        },
+        {
+          label: "所属产业",
+          key: "IndustryName",
+        },
+        {
+          label: "关联标的",
+          key: "SubjectNameStr",
+        },
+      ]
+    : type === 5
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "产业名称",
+          key: "IndustryName",
+        },
+        {
+          label: "关联标的",
+          key: "SubjectNameStr",
+        },
+        {
+          label: "关注时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 6
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "作者昵称",
+          key: "NickName",
+        },
+        {
+          label: "作者相关产业",
+          key: "IndustryName",
+        },
+        {
+          label: "关注时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 7
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "搜索词",
+          key: "KeyWord",
+        },
+        {
+          label: "搜索时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 8
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 200,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "调研主题",
+          key: "ActivityName",
+          minwidthsty: "195",
+        },
+        {
+          label: "行业",
+          key: "PermissionName",
+          widthsty: 80,
+        },
+        {
+          label: "活动开始时间",
+          key: "ActivityTimeText",
+        },
+        {
+          label: "调研形式",
+          key: "ActivityType",
+          widthsty: "115",
+        },
+        {
+          label: "是否到会",
+          key: "IsMeeting",
+          widthsty: 80,
+        },
+      ]
+    : type === 9
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 130,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "文件名称",
+          key: "MediaTitle",
+          widthsty: 500,
+        },
+        {
+          label: "文件类型",
+          key: "FileType",
+        },
+        {
+          label: "播放时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 10
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+          // widthsty: 130,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "标签名称",
+          key: "TagName",
+          // widthsty: 500,
+        },
+        {
+          label: "报告系列",
+          key: "ArticleTypes",
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypes",
+        },        
+        {
+          label: "相关产业",
+          key: "SubjectNames",
+          // widthsty: 500,
+        },
+        {
+          label: "相关标的",
+          key: "SubjectNames",
+        },
+        {
+          label: "点击时间",
+          key: "CreateTime",
+        },
+      ]
+    : [];
+};
+
+//全机构互助列表的表格列表
+export const wholeOrganizationTableColums = (type) => {
+  return type === 1
+    ? [
+        {
+          label: "客户名称",
+          key: "CompanyName",
+          widthsty: 90,
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+          widthsty: 90,
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "报告标题",
+          key: "Title",
+          minwidthsty: 140,
+        },
+        {
+          label: "所属行业",
+          key: "PermissionName",
+          widthsty: 80,
+        },
+        {
+          label: "所属产业",
+          key: "IndustryName",
+        },
+        {
+          label: "关联标的",
+          key: "SubjectNameStr",
+        },
+        {
+          label: "发布时间",
+          key: "PublishDate",
+        },
+        {
+          label: "阅读时间",
+          key: "CreateTime",
+        },
+        {
+          label: "阅读时长",
+          key: "StopTime",
+          widthsty: 80,
+        },
+        {
+          label: "阅读来源",
+          key: "RegisterPlatform",
+          widthsty: 80,
+        },
+      ]
+    : type === 2
+    ? [
+        {
+          label: "客户名称",
+          key: "CompanyName",
+          widthsty: 90,
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+          widthsty: 90,
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "活动名称",
+          key: "ActivityName",
+          minwidthsty: 140,
+        },
+        {
+          label: "所属行业",
+          key: "PermissionName",
+          widthsty: 80,
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypeName",
+          widthsty: 140,
+        },
+        {
+          label: "活动主题",
+          key: "Label",
+        },
+        {
+          label: "活动时间",
+          key: "ActivityTime",
+        },
+        {
+          label: "是否到会",
+          key: "IsMeeting",
+          widthsty: 80,
+        },
+        {
+          label: "首次入会时间",
+          key: "FirstMeetingTime",
+        },
+        {
+          label: "最后退出时间",
+          key: "LastMeetingTime",
+        },
+        {
+          label: "参与总时长",
+          key: "Duration",
+          widthsty: 100,
+        },
+        {
+          label: "参会方式",
+          key: "MeetingTypeStr",
+          widthsty: 80,
+        },
+        {
+          label: "参会鉴权",
+          key: "MeetingAuthentication",
+          widthsty: 80,
+        },
+        {
+          label: "参会状态",
+          key: "MeetingStatusStr",
+          widthsty: 80,
+        },
+      ]
+    : type === 3
+    ? [
+        {
+          label: "客户名称",
+          key: "CompanyName",
+          widthsty: 90,
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+          widthsty: 90,
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "报告标题",
+          key: "Title",
+          minwidthsty: 140,
+        },
+        {
+          label: "收藏时间",
+          key: "CreateTime",
+        },
+        {
+          label: "发布时间",
+          key: "PublishDate",
+        },
+        {
+          label: "报告类型",
+          key: "MatchTypeName",
+        },
+        {
+          label: "所属产业",
+          key: "IndustryName",
+        },
+        {
+          label: "关联标的",
+          key: "SubjectNameStr",
+        },
+      ]
+    : type === 5
+    ? [
+        {
+          label: "客户名称",
+          key: "CompanyName",
+          widthsty: 90,
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+          widthsty: 90,
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "产业名称",
+          key: "IndustryName",
+        },
+        {
+          label: "关联标的",
+          key: "SubjectNameStr",
+        },
+        {
+          label: "关注时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 6
+    ? [
+        {
+          label: "客户名称",
+          key: "CompanyName",
+          widthsty: 90,
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+          widthsty: 90,
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "作者昵称",
+          key: "NickName",
+        },
+        {
+          label: "作者相关产业",
+          key: "IndustryName",
+        },
+        {
+          label: "关注时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 7
+    ? [
+        {
+          label: "客户名称",
+          key: "CompanyName",
+          widthsty: 90,
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+          widthsty: 90,
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 90,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "搜索词",
+          key: "KeyWord",
+        },
+        {
+          label: "搜索时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 8
+    ? [
+        {
+          label: "客户名称",
+          key: "CompanyName",
+          widthsty: 200,
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+          widthsty: 100,
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 100,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "调研主题",
+          key: "ActivityName",
+          minwidthsty: "200",
+        },
+        {
+          label: "行业",
+          key: "PermissionName",
+          widthsty: 100,
+        },
+        {
+          label: "活动开始时间",
+          key: "ActivityTimeText",
+          widthsty: 280,
+        },
+        {
+          label: "调研形式",
+          key: "ActivityType",
+          widthsty: "115",
+        },
+        {
+          label: "是否到会",
+          key: "IsMeeting",
+          widthsty: 100,
+        },
+      ]
+    : type === 9
+    ? [
+        {
+          label: "客户名称",
+          key: "CompanyName",
+          widthsty: 200,
+        },
+        {
+          label: "所属销售",
+          key: "SellerName",
+          widthsty: 100,
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+          widthsty: 100,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+        },
+        {
+          label: "文件名称",
+          key: "MediaTitle",
+          widthsty: 500,
+        },
+        {
+          label: "文件类型",
+          key: "FileType",
+        },
+        {
+          label: "播放时间",
+          key: "CreateTime",
+        },
+      ]
+    : type === 10
+    ? [
+        {
+          label: "公司名",
+          key: "CompanyName",
+          // widthsty: 200,
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+          // widthsty: 100,
+        },
+        {
+          label: "手机号",
+          key: "Mobile",
+          // widthsty: 100,
+        },
+        {
+          label: "标签名称",
+          key: "TagName",
+        },
+        {
+          label: "报告系列",
+          key: "ArticleTypes",
+          // widthsty: 500,
+        },
+        {
+          label: "活动类型",
+          key: "ActivityTypes",
+        },
+        {
+          label: "相关产业",
+          key: "SubjectNames",
+        },
+        {
+          label: "相关标的",
+          key: "SubjectNames",
+        },
+        {
+          label: "点击时间",
+          key: "CreateTime",
+        },
+      ]
+    : [];
+};

src/views/custom_manage/contacts/compontents/details.scss

@@ -0,0 +1,122 @@
+.tabs {
+  display: flex;
+  flex-wrap: wrap;
+  margin: 30px 0 20px;
+
+  .item {
+    padding: 8px 17px;
+    margin-right: 40px;
+    cursor: pointer;
+  }
+
+  .active {
+    background-color: #409eff;
+    color: #fff;
+    border-radius: 6px;
+  }
+}
+
+.tooltip-item {
+  margin-left: 20px;
+}
+
+.dataReport-top {
+  display: flex;
+  align-items: center;
+  margin-top: 10px;
+
+  .button-sty {
+    margin-right: 20px;
+    border: none;
+    padding: 6px 12px;
+    background: #e0eefd;
+    color: #2d8cf0;
+    cursor: pointer;
+    border-radius: 4px;
+
+    &.act {
+      background: #409eff;
+      color: #fff;
+    }
+  }
+
+  a {
+    margin-left: 20px;
+  }
+}
+
+.chart-list {
+  display: flex;
+  flex-wrap: wrap;
+  height: 720px;
+  overflow: hidden;
+  overflow: auto;
+  width: 105%;
+
+  .chart-item {
+    width: 252px;
+    height: 352px;
+    background: #ffffff;
+    border-radius: 4px;
+    border: 1px solid #ebebeb;
+    padding: 10px;
+    box-sizing: border-box;
+    margin-right: 20px;
+    margin-bottom: 15px;
+    cursor: pointer;
+
+    .item-img {
+      width: 100%;
+      height: 167px;
+    }
+
+    .chart-tag {
+      display: flex;
+      padding: 10px;
+      flex-wrap: wrap;
+      height: 70px;
+      border-bottom: 1px solid #ebebeb;
+    }
+
+    .tag-item {
+      display: inline-block;
+      width: 92px;
+      height: 24px;
+      border-radius: 2px;
+      border: 1px solid #2a65f5;
+      line-height: 22px;
+      text-align: center;
+      margin: 0 8px 8px 0;
+    }
+
+    .tiem {
+      text-align: center;
+      color: #999999;
+      line-height: 37px;
+    }
+  }
+}
+
+/* 2行省略 */
+.text_twoLine {
+  text-overflow: -o-ellipsis-lastline;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+
+.title-chart {
+  height: 40px;
+}
+
+.chart-no-data {
+  text-align: center;
+  height: 200px;
+}
+
+.mx-datepicker {
+  width: 220px !important;
+}

src/views/custom_manage/contacts/compontents/interactionDlg.vue

@@ -0,0 +1,216 @@
+<script setup>
+import { computed, ref, watch } from "vue";
+import { interactionColums } from "./contactsColums";
+import { customInterence, equityContacts } from "@/api/api.js";
+
+const props = defineProps({
+  interactionDlg: {
+    type: Boolean,
+    default: false,
+  },
+  interactionFrom: {
+    type: Object,
+  },
+});
+const emit = defineEmits(["close"]);
+
+watch(
+  () => props.interactionDlg,
+  (nval) => {
+    if (nval) getInteractionRelevant();
+  }
+);
+
+const tableLoading = ref(false)
+const tableData = ref([]);
+const tabsActive = ref("报告阅读");
+const industryName = ref("");
+const isFllow = ref(false);
+async function getInteractionRelevant() {
+  tableLoading.value = true;
+  const res = await equityContacts.getInteractionRelevant({
+    UserId: props.interactionFrom.id,
+    KeyWord: props.interactionFrom.key,
+    Source:
+      tabsActive.value === "报告阅读"
+        ? 1
+        : tabsActive.value === "报告收藏"
+        ? 2
+        : tabsActive.value === "活动互动"
+        ? 3
+        : 4,
+  });
+  tableLoading.value = false
+
+  if (res.Ret === 200) {
+    industryName.value = res.Data.IndustryName;
+    isFllow.value = res.Data.IsFllow;
+    tableData.value = res.Data.List || [];
+  }
+}
+
+function tabsHandle(item) {
+  tabsActive.value = item.title;
+  tableData = [];
+  getInteractionRelevant();
+}
+
+/* 表格行的样式 */
+function handleRowStyle(key) {
+  const style = {
+    Title: "color: #409eff; cursor: pointer",
+  };
+  return style[key] ? style[key] : "";
+}
+
+/* 表格行的数据处理 */
+function handleRowContent(row, key) {
+  if (["ActivityType"].includes(key)) {
+    return row[key] == 1 ? "线上" : "线下";
+  } else {
+    return row[key];
+  }
+}
+
+/* 表格行的点击事件 */
+function handleRowClick(row, key) {
+  if (key === "Title") {
+    if (row.ArticleType == 1) {
+      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=${row.ArticleIdMd5}`;
+      window.open(href, "_blank");
+    } else {
+      let href = `https://vmp.hzinsights.com/v2/articles/${row.ArticleId}`;
+      window.open(href, "_blank");
+    }
+  }
+}
+
+//关闭弹框
+function cancelHandle() {
+  tabsActive.value = "报告阅读";
+  emit("close");
+}
+</script>
+
+<template>
+  <div class="container-interaction-dlg">
+    <el-dialog
+      draggable
+      :model-value="interactionDlg"
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      @close="cancelHandle"
+      center
+      width="800px"
+    >
+      <template #header>
+        <div>
+          <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">{{ industryName }} - 相关互动</span>
+        </div>
+      </template>
+      <div>
+        <template v-if="isFllow">
+          <img src="~@/assets/img/attention.png" alt="" />
+          关注的产业
+        </template>
+        <div class="tabs-box">
+          <span
+            v-for="item in interactionColums"
+            :key="item.title"
+            :class="tabsActive === item.title ? 'active' : ''"
+            @click="tabsHandle(item)"
+          >
+            {{ item.title }}</span
+          >
+        </div>
+        <div class="content">
+          <div v-for="item in interactionColums" :key="item.title">
+            <template v-if="tabsActive === item.title">
+              <el-table
+                :data="tableData"
+                v-loading="tableLoading"
+                element-loading-text="数据加载中..."
+                border
+                height="350"
+              >
+                <el-table-column
+                  v-for="val in item.table"
+                  :key="val.label"
+                  :label="val.label"
+                  :width="val.widthsty"
+                  :min-width="val.minwidthsty"
+                  align="center"
+                >
+                  <template #default="{ row }">
+                    <span
+                      @click="handleRowClick(row, val.key)"
+                      :style="handleRowStyle(val.key)"
+                      >{{ handleRowContent(row, val.key) }}</span
+                    >
+                  </template>
+                </el-table-column>
+
+                <template #empty>
+                  <div style="padding: 20px 0">
+                    <img
+                      src="~@/assets/img/data_m/table_no.png"
+                      alt=""
+                      style="
+                        display: block;
+                        width: 135px;
+                        height: 90px;
+                        margin: 0 auto;
+                      "
+                    />
+                    <span>暂无数据</span>
+                  </div>
+                </template>
+              </el-table>
+            </template>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<style scoped lang="scss">
+.container-interaction-dlg {
+  img {
+    width: 15px;
+    height: 15px;
+  }
+  .tabs-box {
+    span {
+      display: inline-block;
+      margin: 10px 60px 20px 0;
+      cursor: pointer;
+    }
+    .active {
+      color: #3385ff;
+      padding-bottom: 3px;
+      border-bottom: 1px solid #3385ff;
+    }
+  }
+  .content {
+    margin-bottom: 30px;
+  }
+}
+</style>

src/views/custom_manage/contacts/compontents/labelDlg.vue

@@ -0,0 +1,74 @@
+<script setup>
+const props = defineProps({
+  isShowLabelDlg: {
+    default: false,
+    type: Boolean,
+  },
+  dlgLabelList: {
+    default: {},
+    type: Object,
+  },
+  userLabel: {
+    default: "",
+    type: String,
+  },
+});
+const emit = defineEmits(["labelChildren", "close"]);
+
+// 类型的处理
+function lookLabelListNumber() {
+  let arr = props.dlgLabelList.Labels
+    ? props.dlgLabelList.Labels.split(",")
+    : [];
+  return arr;
+}
+
+// 点击标签的事件
+function labelChildren(key) {
+  emit("labelChildren", key, props.dlgLabelList);
+}
+
+// 关闭了弹框
+function cancelHandle() {
+  emit("close");
+}
+</script>
+
+<template>
+  <div class="container-labrlDlg">
+    <el-dialog
+      title="标签"
+      draggable
+      :model-value="isShowLabelDlg"
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      @close="cancelHandle"
+      center
+      width="800px"
+    >
+      <div class="popover-item">
+        <el-tag
+          size="mini"
+          style="margin: 5px 8px; cursor: pointer"
+          v-for="item in lookLabelListNumber()"
+          :key="item"
+          :type="userLabel == item && 'danger'"
+          @click="labelChildren(item)"
+        >
+          {{ item }}
+        </el-tag>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<style scoped lang="scss">
+.container-labrlDlg {
+  .popover-item {
+    padding-bottom: 30px;
+  }
+  .popover-not-have {
+    width: 100%;
+    text-align: center;
+  }
+}
+</style>

src/views/custom_manage/contacts/compontents/remindDlg.vue

@@ -0,0 +1,84 @@
+<script setup>
+import { ref } from "vue";
+import { ElMessage } from "element-plus";
+import { customInterence, equityContacts } from "@/api/api.js";
+
+const props = defineProps({
+  isShowRemindDlg: {
+    default: false,
+    type: Boolean,
+  },
+  remindList: {
+    default: {},
+    type: Object,
+  },
+});
+const emit = defineEmits(["close", "success"]);
+
+// 弹框关闭的事件
+const remindRadio = ref(1);
+function cancelHandle() {
+  remindRadio.value = 1;
+  emit("close");
+}
+
+// 确认事件
+async function remindBtnHandler() {
+  const res = await equityContacts.postUserRemind({
+    UserId: props.remindList.UserId,
+    SourceType: remindRadio.value,
+    DoType: props.remindList.IsRemind ? 2 : 1,
+  });
+  if (res.Ret === 200) {
+    cancelHandle();
+    emit("success");
+    ElMessage.success("操作成功！");
+  }
+}
+</script>
+<template>
+  <div class="container-remindDlg">
+    <el-dialog
+      :title="remindList.IsRemind ? '取消提醒' : '互动提醒'"
+      draggable
+      :model-value="isShowRemindDlg"
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      @close="cancelHandle"
+      center
+      width="500px"
+    >
+      <div>
+        <p v-if="remindList.IsRemind">请选择取消范围</p>
+        <p v-else>
+          设置提醒后，联系人的互动行为都将通过【查研观向小助手】提醒你，请选择设置范围
+        </p>
+        <div style="margin-top: 20px">
+          <el-radio-group v-model="remindRadio">
+            <el-radio :label="1" style="display: block">{{
+              remindList.IsRemind
+                ? "单独取消此联系人的提醒"
+                : "对此联系人单独设置"
+            }}</el-radio>
+            <el-radio :label="2" style="margin: 20px 0">{{
+              remindList.IsRemind
+                ? "对该机构下的联系人批量取消"
+                : "对该机构下的联系人批量设置"
+            }}</el-radio>
+          </el-radio-group>
+        </div>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="cancelHandle">取 消</el-button>
+          <el-button type="primary" @click="remindBtnHandler">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+<style scoped lang="scss">
+.container-remindDlg {
+  display: block;
+}
+</style>

src/views/custom_manage/contacts/contactsList.vue

@@ -0,0 +1,720 @@
+<script setup>
+import { ref, nextTick, watch } from "vue";
+import { InfoFilled, Search } from "@element-plus/icons-vue";
+import { useRouter, onBeforeRouteLeave } from "vue-router";
+import { ElMessage } from "element-plus";
+import { customInterence, equityContacts } from "@/api/api.js";
+import mPage from "@/components/mPage.vue";
+import InteractionDlg from "./compontents/interactionDlg.vue";
+import LabelDlg from "./compontents/labelDlg.vue";
+import RemindDlg from "./compontents/remindDlg.vue";
+const router = useRouter();
+
+const defaultSalesProps = {
+  multiple: true,
+  label: "RealName",
+  children: "ChildrenList",
+  value: "AdminId",
+}; //销售级联配置
+const registerOptions = [
+  {
+    label: "已注册",
+    value: 1,
+  },
+  {
+    label: "未注册",
+    value: 0,
+  },
+];
+const decisionOptions = [
+  {
+    label: "是",
+    value: 1,
+  },
+  {
+    label: "否",
+    value: 0,
+  },
+];
+
+const clientOptions = ref([]);
+async function getUserStatusTable() {
+  const res = await equityContacts.getUserStatusTable();
+  if (res.Ret === 200) {
+    clientOptions.value = res.Data.List || [];
+  }
+}
+getUserStatusTable();
+
+/* 获取销售 */
+const salesArr = ref([]);
+function getSale() {
+  customInterence.getSalesRaiData().then((res) => {
+    if (res.Ret === 200) {
+      salesArr.value = res.Data.List;
+    }
+  });
+}
+getSale();
+
+/* 获取列表 */
+const sales = ref([]);
+const tableData = ref([]);
+const total = ref(0); //条数
+const pageSize = ref(10); //每页显示几条
+const page_no = ref(
+  sessionStorage.getItem("contactsListBack")
+    ? JSON.parse(sessionStorage.getItem("contactsListBack")).page_no
+    : 1
+);
+const clientStatus = ref("");
+const decisionValue = ref("");
+const registerValue = ref(1);
+const contactWay = ref(""); //手机号/邮箱/姓名/公司名
+const userLabel = ref("");
+const orderTable = ref("");
+const isFollowValue = ref(""); //是否关注公众号
+async function getCygxContactsList() {
+  let salesArr = [];
+  if (sales.value.length) {
+    salesArr = sales.value.map((item) => {
+      return item[item.length - 1];
+    });
+  }
+  const res = await equityContacts.getCygxContactsList({
+    PageSize: pageSize.value,
+    CurrentIndex: page_no.value,
+    Status: clientStatus.value[0] ? clientStatus.value[0] : "",
+    TryStage: clientStatus.value[1] ? clientStatus.value[1] : "",
+    IsMaker:
+      decisionValue.value === 1
+        ? decisionValue.value
+        : decisionValue.value === 0
+        ? decisionValue.value
+        : 2,
+    IsRegister:
+      registerValue.value === 1
+        ? registerValue.value
+        : registerValue.value === 0
+        ? registerValue.value
+        : 2,
+    AdminId: salesArr.join(","),
+    KeyWord: contactWay.value,
+    Label: userLabel.value,
+    SortType: orderTable.value,
+    IsSubscribeCygx: isFollowValue.value,
+  });
+  if (res.Ret === 200) {
+    tableData.value = res.Data.List || [];
+    total.value = res.Data.Paging.Totals;
+  }
+}
+getCygxContactsList();
+
+/* 页码改变事件 */
+function handleCurrentChange(page) {
+  page_no.value = page;
+  getCygxContactsList();
+}
+
+function sortChangeHandle(item) {
+  console.log(item.order);
+  orderTable.value =
+    item.order === "ascending"
+      ? "asc"
+      : item.order === "descending"
+      ? "desc"
+      : "";
+  getCygxContactsList();
+}
+
+/* 筛选的change 事件 */
+function handelGetData() {
+  page_no.value = 1;
+  getCygxContactsList();
+}
+
+/* 详情页 */
+function goDetail(item) {
+  router.push({
+    path: "/customDetail",
+    query: {
+      id: item.CompanyId,
+    },
+  });
+}
+
+/* 点击了添加备注 和查看 */
+const remarkDlgShow = ref(false); // 查看
+const addRemarFrom = ref({}); //、添加备注
+const addRemarText = ref("");
+const lableRemarkList = ref([]);
+async function lookOver(item, type) {
+  addRemarFrom.value = _.cloneDeep(item);
+  addRemarFrom.value.IsShowSee = type === "历史";
+  remarkDlgShow.value = true;
+  if (addRemarFrom.value.IsShowSee) {
+    const res = await equityContacts.getCygxRemarkList({
+      UserId: addRemarFrom.value.UserId,
+    });
+    if (res.Ret === 200) {
+      nextTick(() => {
+        lableRemarkList.value = res.Data.List || [];
+      });
+    }
+  }
+}
+/* 弹框的关闭 */
+function cancelHandle() {
+  remarkDlgShow.value = false;
+  addRemarText.value = "";
+  addRemarFrom.value = {};
+}
+/* 弹框的确认 */
+async function saveHandle() {
+  if (addRemarFrom.value.IsShowSee) {
+    addRemarFrom.value.IsShowSee = false;
+  } else {
+    if (addRemarText.value == "") return ElMessage.error("请输入备注信息");
+    const res = await equityContacts.getCygxAddRemarks({
+      Content: addRemarText.value,
+      UserId: addRemarFrom.value.UserId,
+    });
+    if (res.Ret === 200) {
+      ElMessage.success("添加成功");
+      getCygxContactsList();
+      cancelHandle();
+    }
+  }
+}
+
+/* 互助量点击 */
+function lookInteraction(item, type) {
+  const { href } = router.resolve({
+    path: type === "个人" ? "/mutualList" : "/organizationList",
+    query: {
+      id: item.UserId,
+      CompanyId: item.CompanyId,
+    },
+  });
+  window.open(href, "_blank");
+}
+
+/* 标签下的单独的某一个 */
+const interactionDlg = ref(false); //互助的弹框
+const interactionFrom = ref({}); //互助的数据
+function labelChildren(key, row) {
+  interactionDlg.value = true;
+  interactionFrom.value = {
+    id: row.UserId,
+    key,
+  };
+}
+
+//鼠标经过了 机构互助量
+const organizationTableL = ref([]); //互助量机构的
+async function isShowOrganization(row) {
+  const res = await equityContacts.getInteractionNum({
+    UserId: row.UserId,
+  });
+  if (res.Ret === 200) {
+    organizationTableL.value = res.Data.List || [];
+  }
+}
+
+// 查看标签
+const lookLabelList = ref([]);
+async function lookLabels(item) {
+  lookLabelList.value = [];
+  const res = await equityContacts.getCygxLabelDetail({
+    UserId: item.UserId,
+  });
+  if (res.Ret === 200) {
+    lookLabelList.value = res.Data.Label && res.Data.Label.split(",");
+  }
+}
+
+async function querySearchHandler(query, cb) {
+  cb([]);
+  if (!query) return;
+  const res = await equityContacts.industrialManagementSearch({
+    KeyWord: query,
+  });
+  if (res.Ret === 200) {
+    if (res.Data && res.Data.List.length > 0) {
+      let arr = res.Data.List.map((item) => {
+        return { value: item.IndustryName, ...item };
+      });
+      cb(arr);
+    } else {
+      cb([{}]);
+    }
+  }
+}
+
+//点击操作的互助提醒
+const isShowRemindDlg = ref(false); // 消息提醒的弹框
+const remindList = ref({}); // 消息提醒的数据
+async function remindHandler(item) {
+  remindList.value = item;
+  isShowRemindDlg.value = true;
+}
+
+// 处理标签不能超过10个
+function lookLabelListNumber(row) {
+  let arr = row.Labels ? row.Labels.split(",").splice(0, 10) : [];
+  return arr;
+}
+
+// 标签展示弹框
+const dlgLabelList = ref({});
+const isShowLabelDlg = ref(false);
+function showLabelDlg(row) {
+  dlgLabelList.value = row;
+  isShowLabelDlg.value = true;
+}
+
+watch(
+  () => contactWay,
+  () => {
+    clientStatus.value = "";
+    decisionValue.value = "";
+    registerValue.value = "";
+    sales.value = [];
+    page_no.value = 1;
+    getCygxContactsList();
+  }
+);
+
+onBeforeRouteLeave((to, form, next) => {
+  let backData = {
+    page_no: page_no.value,
+    keyword: contactWay.value,
+    decisionValue: decisionValue.value,
+    registerValue: registerValue.value,
+    sales: sales.value,
+    clientStatus: clientStatus.value,
+    userLabel: userLabel.value,
+    isFollowValue: isFollowValue.value,
+  };
+  sessionStorage.setItem("contactsListBack", JSON.stringify(backData));
+  next();
+});
+</script>
+
+<script>
+import { defineComponent } from "vue";
+export default defineComponent({
+  //进入前是否清除参数
+  beforeRouteEnter(to, from, next) {
+    if (from.path !== "/mutualList" && from.path !== "/customDetail") {
+      sessionStorage.removeItem("contactsListBack");
+    }
+    next();
+  },
+});
+</script>
+
+<template>
+  <div class="container-contactsList">
+    <div class="top-wrap">
+      <el-input
+        style="width: 200px; margin-right: 20px"
+        v-model="contactWay"
+        placeholder="手机号/邮箱/姓名/公司名"
+        clearable
+      >
+        <template #prefix>
+          <el-icon class="el-input__icon"><search /></el-icon> </template
+      ></el-input>
+      <el-select
+        v-model="decisionValue"
+        placeholder="是否KP"
+        @change="handelGetData"
+        clearable
+      >
+        <el-option
+          v-for="item in decisionOptions"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+        >
+        </el-option>
+      </el-select>
+      <el-select
+        v-model="registerValue"
+        placeholder="是否注册"
+        @change="handelGetData"
+        clearable
+      >
+        <el-option
+          v-for="item in registerOptions"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+        >
+        </el-option>
+      </el-select>
+      <el-select
+        v-model="isFollowValue"
+        placeholder="是否关注公众号"
+        @change="handelGetData"
+        clearable
+      >
+        <el-option
+          v-for="item in decisionOptions"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+        >
+        </el-option>
+      </el-select>
+      <el-cascader
+        v-model="sales"
+        placeholder="请选择销售"
+        style="width: 200px; margin: 0 20px 20px 0"
+        :options="salesArr"
+        :props="defaultSalesProps"
+        :show-all-levels="false"
+        collapse-tags
+        clearable
+        filterable
+        @change="handelGetData"
+      >
+      </el-cascader>
+      <el-cascader
+        style="width: 200px; margin-right: 20px"
+        v-model="clientStatus"
+        :options="clientOptions"
+        placeholder="请选择客户状态"
+        clearable
+        :props="{
+          value: 'TryStage',
+          label: 'Name',
+          children: 'List',
+          checkStrictly: true,
+        }"
+        @change="handelGetData"
+      ></el-cascader>
+      <el-autocomplete
+        style="width: 200px; margin-bottom: 20px"
+        prefix-icon="el-icon-search"
+        clearable
+        class="inline-input"
+        v-model="userLabel"
+        :fetch-suggestions="querySearchHandler"
+        placeholder="用户标签搜索"
+        @clear="handelGetData"
+        :trigger-on-focus="false"
+        @select="handelGetData"
+      >
+        <template #default="scope">
+          <div v-if="scope.item.IndustryName">
+            {{ scope.item.IndustryName }}
+          </div>
+          <div v-else style="text-align: center">暂无数据</div>
+        </template>
+      </el-autocomplete>
+    </div>
+    <el-card>
+      <el-table
+        :data="tableData"
+        style="width: 100%"
+        border
+        @sort-change="sortChangeHandle"
+      >
+        <el-table-column align="center" prop="RealName" width="90" label="姓名">
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="Mobile"
+          width="130"
+          label="手机号/邮箱"
+        >
+          <template #default="{ row }">
+            {{ row.Mobile || row.Email }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="CompanyName" label="公司名称">
+          <template #default="scope">
+            <span class="editsty" @click="goDetail(scope.row)">{{
+              scope.row.CompanyName
+            }}</span></template
+          >
+        </el-table-column>
+        <el-table-column align="center" prop="Status" width="100" label="状态">
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="SellerName"
+          width="110"
+          label="所属销售"
+        >
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="IsMaker"
+          width="80"
+          label="是否KP"
+        >
+          <template #default="{ row }">
+            {{ row.IsMaker == 1 ? "是" : "否" }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="RegisterTime"
+          width="130"
+          label="注册时间"
+        >
+        </el-table-column>
+        <el-table-column align="center" width="130" label="是否关注公众号">
+          <template #default="{ row }">
+            {{ row.IsSubscribeCygx == 1 ? "是" : "否" }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="InteractionNum"
+          width="130"
+          label="互动量"
+          sortable="custom"
+        >
+          <template #header>
+            互动量
+            <el-tooltip placement="top">
+              <template #content>
+                <div>
+                  个人互动量 / 机构总互动量<br />
+                  点击右侧排序按钮可按照个人互动量升序/降序排列
+                </div>
+              </template>
+              <el-icon><InfoFilled /></el-icon>
+            </el-tooltip>
+          </template>
+          <template #default="{ row }">
+            <span class="editsty" @click="lookInteraction(row, '个人')">{{
+              row.InteractionNum
+            }}</span>
+            /
+            <el-popover
+              trigger="hover"
+              placement="right"
+              @show="isShowOrganization(row)"
+            >
+              <table class="table-wrap-table-popover">
+                <tr v-for="(item, index) in organizationTableL" :key="index">
+                  <td class="table-item">{{ item.DateTime }}</td>
+                  <td class="table-item">{{ item.InteractionNum }}</td>
+                </tr>
+              </table>
+              <template #reference>
+                <div>
+                  <span class="editsty" @click="lookInteraction(row, '机构')">{{
+                    row.CompanyInteractionNum
+                  }}</span>
+                </div>
+              </template>
+            </el-popover>
+          </template>
+        </el-table-column>
+        <el-table-column prop="" width="350">
+          <template #header>
+            <div style="text-align: center">标签</div>
+          </template>
+          <template #default="{ row }">
+            <div class="popover-item">
+              <el-tag
+                size="small"
+                style="margin: 5px 8px; cursor: pointer"
+                v-for="item in lookLabelListNumber(row)"
+                :key="item"
+                :type="userLabel === item ? 'danger' : ''"
+                @click="labelChildren(item, row)"
+              >
+                {{ item }}
+              </el-tag>
+              <span
+                @click="showLabelDlg(row)"
+                style="font-weight: 700; padding: 5px 10px"
+                class="editsty"
+                v-if="row.Labels && row.Labels.split(',').length > 10"
+                >...</span
+              >
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="" label="备注" width="90">
+          <template #default="{ row }">
+            <div class="remark-list">
+              <div class="button">
+                <span class="editsty" @click="lookOver(row, '添加')">添加</span>
+                <span
+                  v-if="row.Content"
+                  style="font-weight: 700; padding: 5px 10px"
+                  class="editsty"
+                  @click="lookOver(row, '历史')"
+                  >...</span
+                >
+              </div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="" label="操作" width="100">
+          <template #default="{ row }">
+            <span
+              :class="row.IsRemind ? 'deletesty' : 'editsty'"
+              @click="remindHandler(row)"
+              >{{ row.IsRemind ? "取消提醒" : "互动提醒" }}</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
+      draggable
+      v-model="remarkDlgShow"
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      @close="cancelHandle"
+      center
+      :width="addRemarFrom.IsShowSee ? '800px' : '500px'"
+    >
+      <template #header>
+        <div>
+          <i
+            class="el-icon-close"
+            style="
+              font-size: 24px;
+              cursor: pointer;
+              position: absolute;
+              right: 20px;
+              top: 50%;
+              transform: translateY(-50%);
+            "
+            @click="cancelHandle"
+          ></i>
+          <span style="font-size: 16px">{{
+            addRemarFrom.IsShowSee ? "历史备注" : "添加备注"
+          }}</span>
+        </div>
+      </template>
+      <div v-if="addRemarFrom.IsShowSee">
+        <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" 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="!addRemarFrom.IsShowSee">
+          <el-button type="primary" @click="saveHandle">确定</el-button>
+          <el-button type="primary" plain @click="cancelHandle">取消</el-button>
+        </template>
+      </div>
+    </el-dialog>
+    <InteractionDlg
+      :interactionDlg="interactionDlg"
+      :interactionFrom="interactionFrom"
+      @close="interactionDlg = false"
+    />
+    <label-dlg
+      :isShowLabelDlg="isShowLabelDlg"
+      :dlgLabelList="dlgLabelList"
+      @labelChildren="labelChildren"
+      :userLabel="userLabel"
+      @close="isShowLabelDlg = false"
+    />
+    <remind-dlg
+      :isShowRemindDlg="isShowRemindDlg"
+      :remindList="remindList"
+      @success="getCygxContactsList"
+    />
+  </div>
+</template>
+<style scoped lang="scss">
+.container-contactsList {
+  .el-select {
+    width: 200px;
+    margin-right: 20px;
+    margin-bottom: 20px;
+  }
+  .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);
+  }
+  .table-item {
+    display: inline-block;
+    width: 90px;
+    height: 22px;
+    background: #e8f3ff;
+    border-radius: 4px;
+    color: #2d8cf0;
+    text-align: center;
+    line-height: 22px;
+    margin-bottom: 5px;
+    margin-left: 5px;
+
+    &:last-child {
+      margin-bottom: 0px;
+    }
+  }
+  .remark-list {
+    .button {
+      display: flex;
+      flex-direction: row-reverse;
+      justify-content: space-between;
+      align-content: center;
+      flex-shrink: 0;
+    }
+  }
+}
+.table-wrap-table-popover {
+  color: #666;
+  width: 100%;
+  border-top: 1px solid #dcdfe6;
+  border-left: 1px solid #dcdfe6;
+  .table-item {
+    padding: 5px 10px;
+    border-right: 1px solid #dcdfe6;
+    border-bottom: 1px solid #dcdfe6;
+  }
+}
+.popover-item {
+  overflow: hidden;
+  overflow-y: auto;
+}
+.popover-not-have {
+  width: 100%;
+  text-align: center;
+}
+</style>

src/views/custom_manage/custom/components/ContactSaveEnDia.vue

@@ -0,0 +1,383 @@
+<script setup>
+import { reactive, ref,watch } from "vue";
+import { ElMessage } from 'element-plus'
+import { customInterence } from '@/api/api.js';
+
+const props = defineProps({
+  title:{
+    type:String,
+    default:'标题'
+  },
+  showAddDia:{
+    type:Boolean,
+    required:true
+  },
+  contactsSubmitForm:{
+    type:Object,
+    default:()=> {}
+  },
+  companyId:{
+    type:Number,
+    required:true
+  }
+})
+const emit = defineEmits(['close','updateList'])
+
+const telCodeArr = [
+  { value: '86', label: '+86' },
+  { value: '852', label: "+852" },
+  { value: '886', label: '+886' },
+  { value: '1', label: '+1' },
+  { value: '65', label: '+65' },
+  { value: '62', label: '+62' },
+  { value:'081',label: '+081' },
+  { value:'44',label: '+44' }
+]
+
+// 关闭弹窗
+const submitForm = reactive({
+  Id:0,
+  Name:"",
+  Email:"",
+  TelCode:'',
+  Tel:'',
+  carte:'',
+  Enabled:1
+})
+const addContactsForm = ref(null)
+function closeAddDia(){
+  submitForm.Id=0
+  submitForm.Name=""
+  submitForm.Email=""
+  submitForm.TelCode=''
+  submitForm.Tel=''
+  submitForm.carte=''
+  submitForm.Enabled=1
+  
+  emit('close')
+  addContactsForm.value.clearValidate()
+}
+
+watch(
+  () => props.showAddDia,
+  (nval) => {
+    if(!nval) return
+
+    if(props.contactsSubmitForm.Id){
+
+      submitForm.Id=props.contactsSubmitForm.Id,
+      submitForm.Name=props.contactsSubmitForm.Name,
+      submitForm.Email=props.contactsSubmitForm.Email,
+      submitForm.TelCode=props.contactsSubmitForm.CountryCode,
+      submitForm.Tel=props.contactsSubmitForm.Mobile,
+      submitForm.carte=props.contactsSubmitForm.BusinessCardUrl,
+      submitForm.Enabled=props.contactsSubmitForm.Enabled
+    }
+  }
+)
+
+
+ /* 预览 */
+function preview() {
+  $("#img").click();
+}
+function clickinput() {
+  //上传模拟点击
+  // debugger
+  $("#fileCard").click();
+}
+// 选择文件上传
+function fileSelected() {
+  //选择文件上传
+  if (document.getElementById("fileCard").files[0]) {
+    let hostfile = document.getElementById("fileCard").files[0];
+    let size = Math.floor(hostfile.size / 1024 / 1024);
+    if (size > 200) {
+      ElMessage.error("上传文件大小不能大于200M！");
+      hostfile = {};
+      return false;
+    }
+    if (
+      hostfile.name.toLowerCase().includes(".png") ||
+      hostfile.name.toLowerCase().includes(".jpg") ||
+      hostfile.name.toLowerCase().includes(".jpeg")
+    ) {
+      let form = new FormData();
+      form.append("file", hostfile); //hostfile.name
+
+      customInterence.upload(form).then((res) => {
+        if (res.Ret === 200) {
+          submitForm.carte = res.Data.ResourceUrl;
+        }
+
+        $("#fileCard").val("");
+        hostfile = {};
+      });
+    } else {
+      ElMessage.error("上传文件格式不正确！");
+    }
+  }
+}
+
+
+// 提交表单
+const showHintDia = ref(false);
+const existContactList = ref([])
+const contactSource = ref('')
+function submit(){
+  addContactsForm.value.validate(valid=>{
+    if(valid){
+      // 保存
+      const params={
+        Id:submitForm.Id,
+        CompanyId:companyId,
+        Name:submitForm.Name,
+        Email:submitForm.Email,
+        CountryCode:submitForm.TelCode,
+        Mobile:submitForm.Tel,
+        BusinessCardUrl:submitForm.carte,
+        Enabled:submitForm.Enabled
+      }
+      customInterence.contactsSaveEn(params).then(res=>{
+        if(res.Ret == 200){
+          if(submitForm.Id==0){
+            // 新增
+            emit('updateList')
+          }else{
+            emit('updateList')
+          }
+          ElMessage.success(`${props.title}成功`)
+          closeAddDia()
+        }else if(res.Ret == 1001){
+          existContactList.value = res.Data?[res.Data]:[]
+          contactSource.value = res.Data.Status
+          showHintDia.value=true
+        }
+      })
+    }
+  })
+}
+
+// 移动联系人 
+function moveContact(){
+  if(!(existContactList.value && existContactList.value.length>0)){
+    return 
+  }
+  customInterence.contactsMoveEn({EmailId:existContactList.value[0].Id,CompanyId:props.companyId}).then(res=>{
+    if(res.Ret == 200){
+      ElMessage.success('移动成功')
+      emit('updateList')
+
+      showHintDia.value=false
+      closeAddDia()
+    }
+  })
+}
+
+</script>
+<template>
+  <el-dialog
+    :title="title"
+    :close-on-click-modal="false"
+    :modal-append-to-body="false"
+    :model-value="showAddDia"
+    width="725px"
+    @closed="closeAddDia"
+  >
+    <div style="padding: 10px 66px 35px 66px">
+      <el-form
+        :model="submitForm"
+        ref="addContactsForm"
+        label-position="right"
+        label-width="92px"
+      >
+        <el-form-item
+          label="联系人姓名"
+          prop="Name"
+          :rules="{
+            required: true,
+            message: '联系人姓名不能为空',
+            trigger: 'blur',
+          }"
+        >
+          <el-input
+            v-model="submitForm.Name"
+            style="width: 337px"
+            placeholder="请输入联系人姓名"
+            size="medium"
+          ></el-input>
+        </el-form-item>
+        <el-form-item
+          label="邮箱地址"
+          prop="Email"
+          :rules="[
+            { required: true, message: '邮箱地址不能为空', trigger: 'blur' },
+            { type: 'email', message: '邮箱地址格式不正确', trigger: 'blur' },
+          ]"
+        >
+          <el-input
+            v-model="submitForm.Email"
+            style="width: 337px"
+            placeholder="请输入邮箱地址"
+            size="medium"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="手机号" prop="Phone">
+          <el-select
+            v-model="submitForm.TelCode"
+            placeholder="区号"
+            style="width: 90px"
+          >
+            <el-option
+              v-for="item in telCodeArr"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+          <el-input
+            v-model="submitForm.Tel"
+            placeholder="手机号"
+            style="width: 245px"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item label="个人名片" prop="carte" style="width: 100%">
+          <input
+            type="file"
+            name="file"
+            @change="fileSelected"
+            id="fileCard"
+            class="true-file"
+            style="display: none"
+          />
+          <el-button
+            type="primary"
+            size="medium"
+            @click="clickinput"
+            v-if="!submitForm.carte"
+            >点击上传</el-button
+          >
+          <div class="img_item" v-if="submitForm.carte">
+            <el-image
+              :src="submitForm.carte"
+              alt=""
+              style="background: #aaa; width: 280px; height: 180px"
+              :preview-src-list="submitForm.carte.split(',')"
+              id="img"
+            />
+            <i
+              class="el-icon-zoom-in"
+              style="position: absolute; right: 20px; top: 20px; color: #fff"
+              @click="preview"
+            ></i>
+            <span
+              style="
+                position: absolute;
+                right: 12px;
+                bottom: 1px;
+                color: #409eff;
+                font-size: 16px;
+                cursor: pointer;
+              "
+              @click.stop="clickinput"
+              >重新上传</span
+            >
+          </div>
+        </el-form-item>
+        <el-form-item label="状态" prop="Enabled">
+          <el-radio-group v-model="submitForm.Enabled">
+            <el-radio :label="1">启用</el-radio>
+            <el-radio :label="0">禁用</el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </el-form>
+      <div style="text-align: center; margin-top: 60px">
+        <el-button
+          type="primary"
+          size="medium"
+          style="width: 120px; margin-right: 6px"
+          @click="submit"
+          >确定</el-button
+        >
+        <el-button size="medium" style="width: 120px" @click="closeAddDia"
+          >取消</el-button
+        >
+      </div>
+    </div>
+  </el-dialog>
+
+
+
+  <!-- 存在联系人的提示弹窗 -->
+  <el-dialog
+    title="提示"
+    :close-on-click-modal="false"
+    :modal-append-to-body="false"
+    :model-value="showHintDia"
+    width="920px"
+  >
+    <div style="padding: 0 40px">
+      <p style="margin-bottom: 20px">检测到系统中已存在以下联系人</p>
+      <p style="margin-bottom: 10px" v-if="contactSource">
+        来源：{{
+          contactSource == 1
+            ? "正式客户列表"
+            : contactSource == 2
+            ? "临时权限列表"
+            : "终止权限列表"
+        }}
+      </p>
+      <el-table :data="existContactList" border>
+        <el-table-column label="联系人姓名" align="center" prop="Name">
+          <template #default="{ row }">
+            <img
+              :src="$icons.card"
+              alt=""
+              style="width: 17px; cursor: pointer; marginright: 5px"
+              v-if="row.BusinessCardUrl"
+              @click="reviewCard(row.BusinessCardUrl)"
+            />
+            <span>{{ row.Name }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="注册公司" align="center" prop="CompanyName">
+          <template #default="{ row }">
+            {{
+              row.CompanyName ? row.CompanyName : row.RegisterCompanyName || "-"
+            }}
+          </template>
+        </el-table-column>
+        <el-table-column label="手机号" align="center" prop="Mobile">
+          <template #default="{ row }">
+            {{ row.CountryCode }}-{{ row.Mobile }}
+          </template>
+        </el-table-column>
+        <el-table-column label="注册时间" align="center" prop="CreateTime">
+          <template #default="{ row }">
+            {{ row.CreateTime || "-" }}
+          </template>
+        </el-table-column>
+        <el-table-column label="邮箱地址" align="center" prop="Email">
+          <template #default="{ row }">
+            {{ row.Email }}
+          </template>
+        </el-table-column>
+      </el-table>
+      <div style="text-align: center; margin: 60px 0 40px">
+        <el-button
+          @click="showHintDia = false"
+          style="min-width: 120px; margin-right: 6px"
+          >取消</el-button
+        >
+        <el-button
+          type="primary"
+          @click="moveContact"
+          style="min-width: 120px; padding: 12px 10px"
+          >移动至当前用户</el-button
+        >
+      </div>
+    </div>
+  </el-dialog>
+</template>
+<style scoped lang="scss"></style>

src/views/custom_manage/custom/components/ReadDialog.vue

@@ -0,0 +1,178 @@
+<script setup>
+import { ref, watch } from 'vue'
+import { customInterence } from '@/api/api.js'
+import _ from 'lodash'
+
+const props = defineProps({
+  lookRead: {
+    type: Boolean
+  },
+  title: {
+    type: String
+  },
+  readId: {
+    type: Number
+  }
+})
+
+const emit = defineEmits(['cancelRead'])
+
+watch(
+  ()=>props.readId,
+  () => {
+    getReportList()
+  }
+
+)
+
+
+const typeArr = [
+  {
+    key:'advisory',
+    label:'商品晨报'
+  },{
+    key:'day',
+    label:'晨报'
+  },{
+    key:'week',
+    label:'周报'
+  },{
+    key:'twoweek',
+    label:'双周报'
+  },{
+    key:'month',
+    label:'月报'
+  },{
+    key:'rddp',
+    label:'日度点评'
+  }
+]
+const optionsType = [
+  {
+  value: '1',
+  label: '权益'
+  }, 
+  {
+  value: '2',
+  label: 'ficc'
+  }, 
+]
+
+
+const type = ref("")
+const readList = ref([])
+const newList = ref([])
+const valueType = ref('')
+const total = ref(0)
+
+const	haveMore = ref(false)
+const page_no = ref(1)
+const reportTableRef = ref(null)
+function getReportList() {
+  customInterence.readList({
+    UserId:Number(props.readId),
+    TxtType:valueType.value?Number(valueType.value):0,
+    LastViewTime: newList.value.length?newList.value[newList.value.length-1].CreatedTime:''
+  }).then(res => {
+    if(res.Ret === 200) {
+      total.value=res.Data.Total
+      haveMore.value = res.Data.List.length ? true : false;
+      newList.value = [...newList.value,...res.Data.List]
+
+      reportTableRef.value.$refs.bodyWrapper.addEventListener('scroll',loadMoreList);
+    }
+  })
+}
+
+watch(
+  () =>valueType.value,
+  () => {
+    newList.value = [];
+    if(reportTableRef.value.$refs.bodyWrapper) {
+      reportTableRef.value.$refs.bodyWrapper.scrollTop = 0;
+    }
+    getReportList()
+  }
+)
+
+
+function cancelHandle() {
+  valueType.value=''
+  type.value = '';
+  newList.value = [];
+  emit('cancelRead');
+}
+
+
+function changeType(type) {
+  if(type) {
+    newList.value = readList.value.filter(item => {
+      return type==item.ReportType;
+    })
+  }else {
+    newList.value = readList.value;
+  }
+}
+
+const loadMoreList = _.throttle(function(){
+  console.log('11111')
+  const {scrollTop,clientHeight,scrollHeight} = reportTableRef.value.$refs.bodyWrapper
+  if(scrollTop + clientHeight >= scrollHeight-10 && haveMore.value){
+      page_no.value++;
+      getReportList();
+  } 
+},300)
+
+
+</script>
+<template>
+  <el-dialog
+    :model-value="lookRead"
+    :close-on-click-modal="false"
+    :modal-append-to-body='false'
+    @close="cancelHandle"
+    center
+    width="65%"
+    draggable
+  >
+    <template #header>
+      <div style="display:flex;align-items:center;">
+        <span style="fontSize:16px;">{{title}}</span>
+      </div>
+
+    </template>
+		<div>
+			<el-select v-model="valueType" placeholder="类型"	clearable>
+				<el-option		
+				v-for="item in optionsType"
+				:key="item.value"
+				:label="item.label"
+				:value="item.value">
+				</el-option>
+			</el-select>
+		</div>
+		<p style="margin:15px 0;">共有{{total}}条阅读记录</p>
+		<el-table :data="newList" border style="marginBottom:40px;" height="350" ref="reportTableRef">
+			<el-table-column align="center" label="标题">
+				<template #default="scope">{{scope.row.ResearchReportName}}</template>
+			</el-table-column>
+			
+			<el-table-column align="center" label="类型" width="120">
+				<template #default="scope">{{scope.row.TxtType=="rights"?'权益':'ficc'}}</template>
+			</el-table-column>
+	
+			<el-table-column align="center" label="报告类型">
+				<template #default="scope">{{scope.row.MatchTypeName}}</template>
+			</el-table-column>
+			<el-table-column align="center" label="阅读时间">
+				<template #default="scope">{{scope.row.CreatedTime}}</template>
+			</el-table-column>
+			<el-table-column align="center" label="停留时间">
+				<template #default="scope">{{scope.row.StopTime}}</template>
+			</el-table-column>
+		</el-table>
+	</el-dialog>		
+</template>
+<style scoped lang="scss">
+
+</style>

src/views/custom_manage/custom/components/clickNumberDetailDia.vue

@@ -0,0 +1,273 @@
+<script setup>
+import { reactive, ref, watch } from "vue";
+import { customInterence, reportVarietyENInterence } from "@/api/api.js";
+import mPage from "@/components/mPage.vue";
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    required: true,
+  },
+  name: {
+    type: String,
+    required: true,
+  },
+  id: {
+    type: Number,
+    required: true,
+  },
+  type: {
+    type: String,
+    default: "customer", // customer-客户 contacts-联系人
+  },
+});
+const emit = defineEmits(["close"]);
+
+// 获取英文品种权限数据
+const varietyOpt = ref([]);
+const varietyVal = ref([]);
+function getENReportVarietyOpts() {
+  reportVarietyENInterence.filterVarietyOpts({}).then((res) => {
+    varietyOpt.value = res;
+  });
+}
+
+const apiName = ref("");
+const dataList = ref([]);
+const total = ref(0);
+const showLoading = ref(false);
+const params = reactive({
+  CurrentIndex: 1,
+  PageSize: 10,
+  //客户Id
+  CompanyId: 0,
+  // 联系人Id
+  EmailId: 0,
+  SortParam: "",
+  SortType: "",
+  ClickType: "",
+});
+function getList() {
+  const arr = [];
+  varietyVal.value &&
+    varietyVal.value.forEach((_e) => {
+      arr.push(_e[1]);
+    });
+  customInterence[apiName.value]({
+    ...params,
+    EnPermissionIds: arr.join(","),
+  }).then((res) => {
+    if (res.Ret == 200) {
+      dataList.value = res.Data.List || [];
+      total.value = res.Data.Paging.Totals;
+      showLoading.value = false;
+    }
+  });
+}
+
+function handleChangeVariety() {
+  params.CurrentIndex = 1;
+  getList();
+}
+
+//切换页码
+function pageChange(page_no) {
+  params.CurrentIndex = page_no;
+  getList();
+}
+
+// 排序
+const sortParamArray = new Map([
+  ["ViewTotal", 1],
+  ["LastViewTime", 2],
+]);
+function clickNumSortChange({ prop, order }) {
+  params.SortParam = sortParamArray.get(prop);
+  params.SortType = order == "ascending" ? 2 : order == "descending" ? 1 : 0;
+  getList();
+}
+
+function closeDia() {
+  emit("close");
+}
+
+watch(
+  () => props.visible,
+  (newval) => {
+    if (!newval) return;
+    showLoading.value = true;
+
+    (params.CurrentIndex = 1),
+      (params.PageSize = 10),
+      (params.CompanyId = props.id),
+      (params.EmailId = props.id),
+      (params.SortParam = ""),
+      (params.SortType = ""),
+      (params.ClickType = "");
+
+    apiName.value =
+      props.type == "customer" ? "customEnHitNumber" : "contactsEnHitNumber";
+    varietyVal.value = [];
+    getList();
+    getENReportVarietyOpts();
+  }
+);
+</script>
+<template>
+  <el-dialog
+    title="点击量详情"
+    append-to-body
+    width="800px"
+    top="10vh"
+    :model-value="visible"
+    @closed="closeDia"
+    :close-on-click-modal="false"
+  >
+    <div style="padding: 10px 20px 35px 20px">
+      <div
+        style="
+          display: flex;
+          justify-content: space-between;
+          margin-bottom: 20px;
+        "
+      >
+        <p class="custom-title">{{ name }}</p>
+        <div>
+          <el-select
+            v-model="params.ClickType"
+            placeholder="请选择所属模块"
+            @change="handleChangeVariety"
+            clearable
+            style="width: 180px"
+            v-if="type == 'contacts'"
+          >
+            <el-option label="英文研报" :value="0"></el-option>
+            <el-option label="线上路演" :value="1"></el-option>
+          </el-select>
+          <el-cascader
+            v-model="varietyVal"
+            :options="varietyOpt"
+            collapse-tags
+            clearable
+            :props="{
+              multiple: true,
+              value: 'EnPermissionId',
+              label: 'EnPermissionName',
+              children: 'Child',
+            }"
+            placeholder="请选择品种"
+            @change="handleChangeVariety"
+            style="width: 220px"
+            class="bg-input"
+          />
+        </div>
+      </div>
+      <el-table
+        :data="dataList"
+        border
+        @sort-change="clickNumSortChange"
+        v-loading="showLoading"
+        element-loading-text="加载中"
+      >
+        <!-- 客户点击量 - 联系人姓名 -->
+        <el-table-column
+          label="联系人姓名"
+          align="center"
+          width="120"
+          prop="UserName"
+          v-if="type == 'customer'"
+        >
+          <template #default="{ row }">
+            {{ row.UserName }}
+          </template>
+        </el-table-column>
+        <!-- 客户点击量 - 邮箱地址 -->
+        <el-table-column
+          label="邮箱地址"
+          align="center"
+          prop="Email"
+          v-if="type == 'customer'"
+        >
+          <template #default="{ row }">
+            {{ row.Email }}
+          </template>
+        </el-table-column>
+        <!-- 客户点击量 - 报告标题 -->
+        <el-table-column
+          label="标题"
+          align="center"
+          prop="ReportTitle"
+          v-if="type == 'contacts'"
+        >
+          <template #default="{ row }">
+            {{ row.ReportTitle }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="分类"
+          align="center"
+          prop="ReportType"
+          v-if="type == 'contacts'"
+        >
+          <template #default="{ row }">
+            {{ row.ReportType }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="所属模块"
+          align="center"
+          prop="ClickType"
+          v-if="type == 'contacts'"
+        >
+          <template #default="{ row }">
+            {{ row.ClickType ? "线上路演" : "英文研报" }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="点击次数"
+          align="center"
+          width="120"
+          sortable="custom"
+          prop="ViewTotal"
+        >
+          <template #default="{ row }">
+            {{ row.ViewTotal }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="最近点击时间"
+          align="center"
+          width="160"
+          sortable="custom"
+          prop="LastViewTime"
+        >
+          <template #default="{ row }">
+            {{ row.LastViewTime }}
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 页数选择器 -->
+      <m-page
+        v-show="total != 0"
+        style="float: none; text-align: right; margin-top: 30px"
+        :page_no="params.CurrentIndex"
+        :pageSize="params.PageSize"
+        :total="total"
+        @handleCurrentChange="pageChange"
+      />
+    </div>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+  .custom-title{
+    margin-bottom: 20px;
+    font-size: 14px;
+    font-weight: 400;
+    color: #000000;
+  }
+  
+  :deep(.el-input){
+    width: 100% !important;
+  }
+</style>

src/views/custom_manage/custom/contractStatistics.vue

@@ -0,0 +1,621 @@
+<script setup>
+import { ref, computed, reactive,onMounted,nextTick, watch } from "vue";
+import mPage from "@/components/mPage.vue";
+import { customInterence } from "@/api/api.js";
+import moment from "moment";
+import $ from 'jquery'
+
+const isAdmin = computed(() => {
+  return localStorage.getItem("Role").indexOf("admin") != -1;
+});
+
+const startDate = moment().startOf("year").format("YYYY-MM-DD");
+const endDate = moment(new Date()).format("YYYY-MM-DD");
+
+const payTypeArray = [
+  { id: 0, type: "" },
+  { id: 1, type: "年付" },
+  { id: 2, type: "半年付" },
+  { id: 3, type: "季付" },
+  { id: 4, type: "次付" },
+];
+const timeTypeData = [
+  { label: "开票日期", value: 1 },
+  { label: "到款日期", value: 2 },
+  { label: "开票日期&到款日期", value: 3 },
+];
+const dateButtonData = [
+  { text: "近1周", tabId: 1, type: "week", diff: 1 },
+  { text: "近1月", tabId: 2, type: "month", diff: 1 },
+  { text: "近2月", tabId: 3, type: "month", diff: 2 },
+  { text: "近3月", tabId: 4, type: "month", diff: 3 },
+];
+
+const serviceList = ref([]);
+const checkedService = ref([])
+function getSimpleServiceList() {
+  customInterence.getSimpleServiceList().then((res) => {
+    if (res.Ret != 200) return;
+    serviceList.value = res.Data || [];
+    // 后端最外层的数据没有给 service_template_id 删除tag时会报错，手动加
+    serviceList.value.map((item, index) => {
+      item.service_template_id = 500 + index;
+    });
+  });
+}
+getSimpleServiceList();
+
+const searchParams = reactive({
+  CurrentIndex: 1,
+  PageSize: 10,
+  Keyword: "",
+  ServiceType: "",
+  StartDate: startDate,
+  EndDate: endDate,
+  // 1-开票日期 2-到款日期 3-开票日期&到款日期
+  TimeType: 1,
+  SortType: "",
+  SortParam: "",
+});
+const tableData = ref([]);
+const total = ref(0);
+const invoiceAmountTotal = ref(0);
+const invoiceAmountList = ref([]);
+const placementAmountTotal = ref(0);
+const placementAmountList = ref([]);
+function getList() {
+  // console.log(this.searchParams);
+  customInterence.getCTContractStatistics(searchParams).then((res) => {
+    if (res.Ret != 200) return;
+    tableData.value = [];
+    let tempData = res.Data.data_list || [];
+    total.value = res.Data.Paging.Totals;
+    invoiceAmountTotal.value = res.Data.invoice_total;
+    invoiceAmountList.value = res.Data.invoice_currency_total || [];
+    placementAmountTotal.value = res.Data.payment_total;
+    placementAmountList.value = res.Data.payment_currency_total || [];
+    tempData.map((item, index) => {
+      item.invoice_payment_list.map((it, ind) => {
+        tableData.value.push({
+          serialNumber:
+            searchParams.PageSize * (searchParams.CurrentIndex - 1) + index + 1,
+          ...item,
+          date: item.start_date + "至" + item.end_date,
+          ...it,
+        });
+      });
+    });
+  });
+}
+getList();
+
+function searchList() {
+  searchParams.CurrentIndex = 1;
+  getList();
+}
+function changePageNo(pageNo) {
+  searchParams.CurrentIndex = pageNo;
+  getList();
+}
+function serviceChange(value) {
+  searchParams.ServiceType = value.join(",");
+  searchList();
+}
+function sortChange({ order, prop }) {
+  searchParams.SortType =
+    order == "descending" ? "desc" : order == "ascending" ? "asc" : "";
+  searchParams.SortParam = order ? prop : "";
+  searchList();
+}
+
+const currentDateTab = ref(0);
+const searchDate = ref([startDate,endDate]);
+function changeDateType({tabId,type,diff}){
+  if(currentDateTab.value==tabId) return
+  currentDateTab.value=tabId
+  let startOfType='month'
+  if(type=='week'){
+    startOfType='isoWeek'
+  }
+  searchDate.value=[moment().startOf(startOfType).subtract((diff-1), type+'s').format('YYYY-MM-DD'),
+  moment().format('YYYY-MM-DD')]
+}
+
+watch(
+  () => searchDate.value,
+  (newVal) => {
+    if(newVal){
+      searchParams.StartDate=newVal[0]
+      searchParams.EndDate=newVal[1]
+    }else{
+      searchParams.StartDate=''
+      searchParams.EndDate=''
+    }
+    searchList()
+  }
+)
+
+
+const domList = ref([]);
+function disabledCheck(e) {
+  if (!domList.value[e]) return true;
+  return (
+    domList.value[e].offsetWidth <= domList.value[e].parentNode.offsetWidth
+  );
+}
+
+onMounted(() => {
+  nextTick(()=>{
+    domList.value=$('.company-name-span')
+  })
+})
+
+const invoiceIsFold = ref(true); //开票合计是否收起
+const placementIsFold = ref(true); //到款合计是否收起
+function foldOrUnfold(type) {
+  if (tableData.value.length == 0) {
+    return;
+  }
+  // type: 0-开票  1-到款
+  if (type) {
+    placementIsFold.value = !placementIsFold.value;
+  } else {
+    invoiceIsFold.value = !invoiceIsFold.value;
+  }
+}
+
+</script>
+<template>
+  <div id="customer-statistics-container" class="customer-statistics-container">
+    <div class="search-zone">
+      <div class="search-box">
+        <el-input
+          v-model="searchParams.Keyword"
+          placeholder="请输入客户名称"
+          clearable
+          class="search-item"
+          @input="searchList"
+          prefix-icon="el-icon-search"
+          style="width: 240px"
+        ></el-input>
+        <el-cascader
+          :options="serviceList"
+          style="width: 240px; margin: 0 0 8px 20px"
+          filterable
+          v-model="checkedService"
+          @change="serviceChange"
+          placeholder="请选择套餐信息"
+          clearable
+          collapse-tags
+          :show-all-levels="false"
+          :props="{
+            multiple: true,
+            label: 'title',
+            value: 'service_template_id',
+            children: 'children',
+            emitPath: false,
+          }"
+          key="serivce"
+        >
+        </el-cascader>
+        <div class="date-box">
+          <el-date-picker
+            v-model="searchDate"
+            type="daterange"
+            @change="currentDateTab = 0"
+            style="max-width: 240px; margin-right: 20px"
+            value-format="yyyy-MM-dd"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          ></el-date-picker>
+          <el-select
+            v-model="searchParams.TimeType"
+            placeholder="请选择日期类型"
+            @change="searchList"
+            style="width: 240px; margin-right: 20px"
+            clearable
+          >
+            <el-option
+              :label="item.label"
+              :value="item.value"
+              v-for="item in timeTypeData"
+              :key="item.value"
+            ></el-option>
+          </el-select>
+          <div class="composition-button-tabs">
+            <el-button
+              size="large"
+              v-for="(item, index) in dateButtonData"
+              :key="item.tabId"
+              class="date-button"
+              :class="[
+                index == 0
+                  ? 'first-button'
+                  : index == dateButtonData.length - 1
+                  ? 'last-button'
+                  : 'inner-button',
+                currentDateTab == item.tabId ? 'selectTab' : '',
+              ]"
+              @click="changeDateType(item)"
+              >{{ item.text }}</el-button
+            >
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="amount-show-zone">
+      <div class="amount-show-item" style="margin-right: 20px">
+        <div
+          class="amount-item-head"
+          @click="foldOrUnfold(0)"
+          :style="{
+            cursor: tableData.length > 0 ? 'pointer' : '',
+            padding: invoiceIsFold ? '8px 20px 8px 20px' : '20px',
+          }"
+        >
+          <div class="amount-item-head-title">
+            已开票合计金额（换算后）：{{ invoiceAmountTotal }}（CNY）
+          </div>
+          <div class="fold-expand-row" v-show="tableData.length > 0">
+            <span class="amount-item-head-icon">
+              {{ invoiceIsFold ? "展开" : "收起" }}
+            </span>
+            <i
+              class="el-icon-arrow-down"
+              :style="!invoiceIsFold && 'transform: rotate(180deg)'"
+              style="color: #409eff"
+            ></i>
+          </div>
+        </div>
+        <div
+          class="amount-item-body-package"
+          :style="{ height: invoiceIsFold ? '0' : '66px' }"
+        >
+          <div class="amount-item-body">
+            <div
+              class="amount-item-body-box"
+              v-for="item in invoiceAmountList"
+              :key="item.code"
+            >
+              <img
+                :src="item.flag_img"
+                style="height: 40px; width: 40px; margin-right: 20px"
+              />
+              <div class="amount-item-body-info">
+                <span>{{ item.name }}（{{ item.code }}）</span>
+                <span>{{ item.amount }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="amount-show-item">
+        <div
+          class="amount-item-head"
+          @click="foldOrUnfold(1)"
+          :style="{
+            cursor: tableData.length > 0 ? 'pointer' : '',
+            padding: placementIsFold ? '8px 20px 8px 20px' : '20px',
+          }"
+        >
+          <div class="amount-item-head-title">
+            已到款合计金额（换算后）：{{ placementAmountTotal }}（CNY）
+          </div>
+          <div class="fold-expand-row" v-show="tableData.length > 0">
+            <span class="amount-item-head-icon">
+              {{ placementIsFold ? "展开" : "收起" }}
+            </span>
+            <i
+              class="el-icon-arrow-down"
+              :style="!placementIsFold && 'transform: rotate(180deg)'"
+              style="color: #409eff"
+            ></i>
+          </div>
+        </div>
+        <div
+          class="amount-item-body-package"
+          :style="{ height: placementIsFold ? '0' : '66px' }"
+        >
+          <div class="amount-item-body">
+            <div
+              class="amount-item-body-box"
+              v-for="item in placementAmountList"
+              :key="item.code"
+            >
+              <img
+                :src="item.flag_img"
+                style="height: 40px; width: 40px; margin-right: 20px"
+              />
+              <div class="amount-item-body-info">
+                <span>{{ item.name }}（{{ item.code }}）</span>
+                <span>{{ item.amount }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="table-zone">
+      <el-table
+        :data="tableData"
+        border
+        ref="tableRef"
+        max-height="580"
+        @sort-change="sortChange"
+      >
+        <el-table-column
+          label="序号"
+          align="center"
+          prop="serialNumber"
+          width="60"
+        >
+          <template #default="{ row }">
+            {{ row.serialNumber }}
+          </template>
+        </el-table-column>
+        <el-table-column label="客户名称" prop="company_name" align="center">
+          <template #default="{ row, $index }">
+            <el-tooltip
+              :content="row.company_name"
+              placement="top"
+              :disabled="disabledCheck($index)"
+            >
+              <div class="company-name-column">
+                <span class="company-name-span">{{ row.company_name }}</span>
+              </div>
+            </el-tooltip>
+          </template>
+        </el-table-column>
+        <el-table-column label="是否新客户" prop="contract_type" align="center">
+          <template #default="{ row }">
+            {{ row.contract_type == 1 ? "是" : "否" }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="合同有效期"
+          prop="date"
+          align="center"
+          show-overflow-tooltip
+        >
+          <template #default="{ row }">
+            {{ row.date }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="开票日"
+          show-overflow-tooltip
+          sortable="custom"
+          prop="invoice_time"
+          align="center"
+        >
+          <template #default="{ row }">
+            {{ row.invoice_time }}
+          </template>
+        </el-table-column>
+        <el-table-column label="开票金额" prop="invoice_amount" align="center">
+          <template #default="{ row }">
+            {{ row.invoice_amount }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="到款日"
+          show-overflow-tooltip
+          sortable="custom"
+          prop="payment_date"
+          align="center"
+        >
+          <template #default="{ row }">
+            {{ row.payment_date }}
+          </template>
+        </el-table-column>
+        <el-table-column label="到款金额" prop="payment_amount" align="center">
+          <template #default="{ row }">
+            {{ row.payment_amount }}
+          </template>
+        </el-table-column>
+        <el-table-column label="付款方式" prop="pay_type" align="center">
+          <template #default="{ row }">
+            <span>{{
+              payTypeArray[row.pay_type] ? payTypeArray[row.pay_type].type : ""
+            }}</span>
+          </template>
+        </el-table-column>
+        <template v-if="isAdmin">
+          <el-table-column label="销售" prop="seller_name" align="center">
+            <template #default="{ row }">
+              {{ row.seller_name }}
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="销售组别"
+            prop="seller_group_name"
+            align="center"
+          >
+            <template #default="{ row }">
+              {{ row.seller_group_name }}
+            </template>
+          </el-table-column>
+          <el-table-column label="销售类型" prop="seller_type" align="center">
+            <template #default="{ row }">
+              {{ row.seller_type == 1 ? "FICC销售" : "权益销售" }}
+            </template>
+          </el-table-column>
+        </template>
+        <el-table-column label="套餐信息" prop="services_name" align="center">
+          <template #default="{ row }">
+            {{ row.services_name }}
+          </template>
+        </el-table-column>
+        <template #empty>
+          <div class="table-noData">
+            <img src="~@/assets/img/cus_m/nodata.png" />
+            <span>暂无数据</span>
+          </div>
+        </template>
+      </el-table>
+      <!-- 分页 -->
+      <m-page
+        :pageSize="searchParams.PageSize"
+        :page_no="searchParams.CurrentIndex"
+        style="display: flex; justify-content: flex-end; margin-top: 20px"
+        :total="total"
+        @handleCurrentChange="changePageNo"
+      />
+    </div>
+  </div>
+</template>
+<style scoped lang="scss">
+ .customer-statistics-container{
+    min-height: calc(100vh - 110px);
+    .search-zone{
+      margin-bottom: 20px;
+      padding: 20px 30px 12px;
+      background-color: white;
+      border-radius: 4px;
+      .search-box{
+        margin-left: -20px;
+        display: flex;
+        align-items: center;
+        flex-wrap: wrap;
+        .search-item{
+          width: 232px;
+          margin: 0 0 8px 20px;
+        }
+        .date-box{
+          display: flex;
+          align-items: center;
+          margin: 0 0 8px 20px;
+          .composition-button-tabs{
+            white-space: nowrap;
+            .date-button{
+              height: 40px;
+              color: #999999;
+              border: 1px solid #DCDFE6;
+              margin: 0;
+              width: 60px;
+              padding: 12px 6px;
+            }
+            .first-button{
+              border-color: #DCDFE6;
+              border-style: solid;
+              border-width: 1px 0 1px 1px;
+              border-radius: 4px 0 0 4px;
+            }
+            .inner-button{
+              border: 1px solid #DCDFE6;
+              border-radius: 0;
+            }
+            .last-button{
+              border-color: #DCDFE6;
+              border-style: solid;
+              border-width: 1px 1px 1px 0;
+              border-radius:0 4px 4px 0 ;
+            }
+            .selectTab{
+              color:white;
+              background-color: #409EFF;
+            }
+          }
+        }
+      }
+
+    }
+    .amount-show-zone{
+      display: flex;
+      align-items: flex-start;
+      flex-wrap: wrap;
+      margin-bottom: 10px;
+      .amount-show-item{
+        margin-bottom: 10px;
+        background: #FFFFFF;
+        // border: 1px solid #DCDFE6;
+        // box-shadow: 0px 4px 12px rgba(153, 153, 153, 0.08);
+        border-radius: 8px;
+        width: 45%;
+        box-sizing: border-box;
+        .amount-item-head{
+          transition: all 0.1s ease;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          .amount-item-head-title{
+            font-weight: 600;
+            font-size: 18px;
+            color: #000000;
+          }
+          .fold-expand-row{
+            display: flex;
+            align-items: center;
+            .amount-item-head-icon{
+              font-weight: 400;
+              font-size: 14px;
+              color: #409EFF;
+              margin-right: 4px;
+            }
+          }
+
+        }
+        .amount-item-body-package{
+          overflow: hidden;
+          transition: height 0.1s ease;
+          .amount-item-body{
+            padding: 6px 20px 16px;
+            box-sizing: border-box;
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            .amount-item-body-box{
+              display: flex;
+              align-items: center;
+              width: 220px;
+              .amount-item-body-info{
+                display: flex;
+                flex-direction: column;
+                justify-content: space-between;
+                span{
+                  font-weight: 400;
+                  font-size: 14px;
+                  color: #666666;
+                  margin-bottom: 2px;
+                  &:last-child{
+                    font-weight: 700;
+                    font-size: 16px;
+                    color: #333333;
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+    .table-zone{
+      padding: 20px 30px 65px;
+      background-color: white;
+      border-radius: 4px;
+      .company-name-column{
+        max-width: 100%;
+        display: inline-block;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      .table-noData{
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        margin: 18vh 0;
+        img{
+          height: 110px;
+          width: 136px;
+        }
+        span{
+          font-weight: 400;
+          font-size: 16px;
+          color: #999999;
+        }
+      }
+    }
+  }
+</style>

src/views/custom_manage/custom/customAllList.vue

@@ -0,0 +1,10 @@
+<script setup>
+import { ref } from 'vue'
+
+</script>
+<template>
+  <div></div>
+</template>
+<style scoped lang="scss">
+
+</style>

src/views/custom_manage/custom/hooks/customlistHook.js

@@ -123,4 +123,71 @@ export function customListHook(){
 		customInfo,
 		handleShowShareRecode
 	}
+}
+
+
+/* 阅读记录弹窗 */
+export function useReadia() {
+
+	const readId = ref(0);
+	const isRead = ref(false);
+	const readTit = ref('阅读报告列表');
+	
+	//取消弹窗
+	function cancelRead() {
+		isRead.value = false
+		readTit.value = "阅读报告列表";
+	}
+
+
+	//查看阅读报告列表弹窗
+	function lookReport(item) {
+		console.log(item);
+		readId.value = item.UserId;
+		readTit.value = item.RealName + "阅读报告列表";
+		isRead.value = true;
+	}
+
+
+	return {
+		readId,
+		isRead,
+		readTit,
+		cancelRead,
+		lookReport
+	}
+}
+
+
+/* 累计点击量弹窗 */
+export function useClickNumDia() {
+	const showClickTimesDia = ref(false)
+	const clickTimesDetailItem = ref({
+		contactsName:"",
+		contactsId:0
+	})
+
+
+	//累计点击量详情
+	function clickTimesDetail(row){
+		clickTimesDetailItem.value.contactsName = row.Name
+		clickTimesDetailItem.value.contactsId = row.Id
+		showClickTimesDia.value=true
+	}
+
+	function closeNumDia() {
+		showClickTimesDia.value=false
+	}
+
+	return {
+		showClickTimesDia,
+		clickTimesDetailItem,
+		clickTimesDetail,
+		closeNumDia
+	}
+}
+
+
+export function useViewPermissionDia() {
+	
 }

src/views/custom_manage/custom/limitContactListEn.vue

@@ -0,0 +1,313 @@
+<script setup>
+import { reactive, ref, watch } from "vue";
+import { useRoute } from "vue-router";
+import { ElMessage, ElMessageBox, ElImageViewer } from "element-plus";
+import { Search } from '@element-plus/icons-vue'
+import { customInterence } from "@/api/api.js";
+import clickNumberDetail from "./components/clickNumberDetailDia.vue";
+import ContactSaveEnDia from "./components/ContactSaveEnDia.vue";
+import mPage from "@/components/mPage.vue";
+import { useClickNumDia } from "./hooks/customlistHook";
+
+const route = useRoute();
+
+const type = ref("");
+const contactsList = ref([]);
+const total = ref(0);
+const searchParams = reactive({
+  Keywords: "",
+  SortType: "",
+  SortParam: "",
+  CurrentIndex: 1,
+  PageSize: 10,
+  ListParam: 3,
+});
+function getList() {
+  customInterence.getContactsListEn(searchParams).then((res) => {
+    if (res.Ret == 200) {
+      contactsList.value = res.Data.List || [];
+      total.value = res.Data.Paging.Totals;
+    }
+  });
+}
+type.value = route.path == "/trialContactListEn" ? "trial" : "freeze";
+searchParams.ListParam = route.path == "/trialContactListEn" ? 2 : 3;
+getList();
+
+function search() {
+  searchParams.CurrentIndex = 1;
+  getList();
+}
+
+function pageChange(page_no) {
+  searchParams.CurrentIndex = page_no;
+  getList();
+}
+
+// 排序
+function sortChange({ order, prop }) {
+  if (!order) {
+    searchParams.SortType = "";
+    searchParams.SortParam = "";
+  } else {
+    searchParams.SortType = order == "ascending" ? "2" : "1";
+    searchParams.SortParam = prop == "RegisterTime" ? "2" : "1";
+  }
+  getList();
+}
+
+//启用禁用联系人
+function changeStatus(row) {
+  customInterence
+    .editEnabledEn({
+      EmailId: row.Id,
+      Enabled: row.Enabled === 1 ? 0 : 1,
+    })
+    .then((res) => {
+      if (res.Ret !== 200) return;
+      ElMessage.success("操作成功");
+      getList();
+    });
+}
+
+// 编辑联系人
+const showAddDia = ref(false);
+const contactsSubmitForm = ref({});
+function editContacts(row) {
+  contactsSubmitForm.value = row;
+  showAddDia.value = true;
+}
+
+// 删除客户
+function delContacts(row) {
+  ElMessageBox(
+    `是否确认删除联系人<span style="color:#409EFF">${row.Name}</span>？`,
+    "操作提示",
+    {
+      type: "warning",
+      dangerouslyUseHTMLString: true,
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+    }
+  )
+    .then((res) => {
+      customInterence.delContactsEn({ EmailId: row.Id }).then((res) => {
+        if (res.Ret == 200) {
+          ElMessage.success("删除联系人成功");
+          getList();
+        }
+      });
+    })
+    .catch(() => {});
+}
+
+const showViewer = ref(false);
+const imgUrl = ref("");
+function reviewCard(url) {
+  imgUrl.value = url;
+  showViewer.value = true;
+}
+
+watch(
+  () => route.path,
+  (oldVal, newval) => {
+    if (oldVal == "/freezeContactListEn" || oldVal == "/trialContactListEn") {
+      // 同一页面 重置参数，请求列表
+      reset();
+    }
+  }
+);
+function reset() {
+  type.value = route.path == "/trialContactListEn" ? "trial" : "freeze";
+  (searchParams.Keywords = ""),
+    (searchParams.SortType = ""),
+    (searchParams.SortParam = ""),
+    (searchParams.CurrentIndex = 1),
+    (searchParams.PageSize = 10),
+    (searchParams.ListParam = route.path == "/trialContactListEn" ? 2 : 3);
+
+  total.value = 0;
+  contactsList.value = [];
+  getList();
+}
+
+const {
+  showClickTimesDia,
+  clickTimesDetailItem,
+  clickTimesDetail,
+  closeNumDia,
+} = useClickNumDia();
+</script>
+<template>
+  <div class="contact-list-container">
+    <div class="contact-search-zone">
+      <el-input
+        v-model="searchParams.Keywords"
+        style="width: 360px"
+        placeholder="请输入联系人姓名/邮箱/手机号"
+        @input="search"
+      >
+        <template #prefix>
+          <el-icon><Search /></el-icon>
+        </template>
+      </el-input>
+    </div>
+    <el-table
+      :data="contactsList"
+      border
+      @sort-change="sortChange"
+      max-height="630px"
+    >
+      <el-table-column label="联系人姓名" align="center" prop="Name">
+        <template #default="{ row }">
+          <img
+            :src="$icons.card"
+            alt=""
+            style="width: 17px; cursor: pointer; margin-right: 5px"
+            v-if="row.BusinessCardUrl"
+            @click="reviewCard(row.BusinessCardUrl)"
+          />
+          <span>{{ row.Name }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="注册公司"
+        align="center"
+        prop="RegisterCompanyName"
+      >
+        <template #default="{ row }">
+          {{ row.RegisterCompanyName || "-" }}
+        </template>
+      </el-table-column>
+      <el-table-column label="手机号" align="center" prop="Mobile">
+        <template #default="{ row }">
+          {{ row.CountryCode }}-{{ row.Mobile }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="注册时间"
+        align="center"
+        prop="RegisterTime"
+        sortable="custom"
+      >
+        <template #default="{ row }">
+          {{ row.RegisterTime || "-" }}
+        </template>
+      </el-table-column>
+      <el-table-column label="邮箱地址" align="center" prop="Email">
+        <template #default="{ row }">
+          {{ row.Email }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="累计点击量"
+        align="center"
+        sortable="custom"
+        width="120"
+        prop="ViewTotal"
+      >
+        <template #default="{ row }">
+          <span
+            class="table-options"
+            @click="clickTimesDetail(row)"
+            v-if="row.ViewTotal != 0"
+            >{{ row.ViewTotal }}</span
+          >
+          <span v-else>{{ row.ViewTotal }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="状态"
+        align="center"
+        prop="Enabled"
+        v-if="type == 'trial'"
+      >
+        <template #default="{ row }">
+          <span :class="{ hint: row.Enabled === 0 }">{{
+            row.Enabled ? "启用" : "禁用"
+          }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="操作"
+        align="center"
+        width="150"
+        v-if="type == 'trial'"
+      >
+        <template #default="{ row }">
+          <span
+            class="table-options"
+            style="margin-right: 12px"
+            @click="editContacts(row)"
+            >编辑</span
+          >
+          <span
+            class="table-options"
+            style="margin-right: 12px"
+            @click="changeStatus(row)"
+            >{{ row.Enabled ? "禁用" : "启用" }}</span
+          >
+          <span
+            class="table-options"
+            @click="delContacts(row)"
+            style="color: #d1433a"
+            >删除</span
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 页数选择器 -->
+    <m-page
+      v-show="total != 0"
+      style="float: none; text-align: right; margin-top: 20px"
+      :page_no="searchParams.CurrentIndex"
+      :pageSize="searchParams.PageSize"
+      :total="total"
+      @handleCurrentChange="pageChange"
+    />
+
+    <!-- 累计点击量详情弹窗 -->
+    <click-number-detail
+      :visible="showClickTimesDia"
+      :name="clickTimesDetailItem.contactsName"
+      type="contacts"
+      :id="clickTimesDetailItem.contactsId"
+      @close="closeNumDia"
+    ></click-number-detail>
+
+    <!-- 添加/编辑联系人 -->
+    <contact-save-en-dia
+      :contactsSubmitForm="contactsSubmitForm"
+      title="编辑联系人"
+      :showAddDia="showAddDia"
+      :companyId="0"
+      @updateList="getList"
+    ></contact-save-en-dia>
+
+    <el-image-viewer
+      v-if="showViewer"
+      @close="showViewer = false"
+      :urlList="[imgUrl]"
+    />
+  </div>
+</template>
+<style scoped lang="scss">
+.contact-list-container {
+  min-height: calc(100vh - 110px);
+  background-color: white;
+  box-sizing: border-box;
+  padding: 28px 28px 50px;
+  .contact-search-zone {
+    text-align: right;
+    margin-bottom: 26px;
+  }
+  .table-options {
+    cursor: pointer;
+    font-size: 14px;
+    color: #409eff;
+  }
+  .hint {
+    color: red;
+  }
+}
+</style>

src/views/custom_manage/custom/listMatch.vue

@@ -0,0 +1,144 @@
+<script setup>
+import { computed, ref } from "vue";
+import { ElMessage } from 'element-plus';
+
+const templateUrl = 'https://hzstatic.hzinsights.com/static/admin/excel/客户名单匹配模板.xlsx'
+const importUrl = import.meta.env.VITE_APP_API_ROOT+'/custom/list/match/import';
+
+const headerConfig = {
+  Authorization:localStorage.getItem('auth')
+}
+
+const colList = [
+    {
+        label:'姓名',
+        key:'UserName'
+    },
+    {
+        label:'国际（区号）',
+        key:'CountryCode'
+    },
+    {
+        label:'手机号',
+        key:'Mobile'
+    },
+    {
+        label:'客户公司',
+        key:'CompanyName'
+    },
+    {
+        label:'系统客户',
+        key:'SysCompanyName'
+    },
+    {
+        label:'FICC状态',
+        key:'FiccStatus'
+    },
+    {
+        label:'FICC销售',
+        key:'FiccSeller'
+    },
+    {
+        label:'权益状态',
+        key:'RaiStatus'
+    },
+    {
+        label:'权益销售',
+        key:'RaiSeller'
+    }
+]
+
+// 校验文件和大小
+function beforeUploadFile(file) {
+  let extension = file.name.substring(file.name.lastIndexOf(".") + 1);
+  let size = file.size / 1024 / 1024;//M
+  if (extension !== "xlsx" && extension !== "xls") {
+    ElMessage.warning("只能上传后缀是.xlsx和.xls的文件");
+      return false;
+  }
+  if (size > 10) {
+    ElMessage.warning("文件大小不得超过10M");
+    return false
+  }
+}
+
+const fileList = ref([])
+const tableData = ref([]);
+const code = ref('')
+// 上传成功之后
+function handleSuccess(result) {
+    let res = this.$parseData(result);
+    if(res.Ret===200){
+        tableData.value=res.Data.List||[]
+        code.value=res.Data.Code
+    }else{
+      ElMessage.warning(res.Msg)
+    }
+}
+
+
+const downloadUrl = computed(() => {
+    const url=import.meta.env.VITE_APP_API_ROOT+'/custom/list/match/download'
+    return url+'?Code='+code.value+'&'+localStorage.getItem('auth')
+})
+function handleDownLoadList(){
+      let link = document.createElement("a");
+      link.href=downloadUrl.value
+      link.setAttribute("download", '客户名单匹配');
+      link.style.display = "none"; //a标签隐藏
+      document.body.appendChild(link);
+      link.click();
+  }
+</script>
+<template>
+  <div class="custome-list-match-page">
+    <div class="top-warp" style="margin-bottom: 30px">
+      <a style="width: 100%" :href="templateUrl" download="客户名单匹配模板"
+        ><el-button type="primary" plain style="margin-right: 15px"
+          >下载模板</el-button
+        ></a
+      >
+      <el-upload
+        style="display: inline-block"
+        :before-upload="beforeUploadFile"
+        :headers="headerConfig"
+        :file-list="fileList"
+        :on-success="handleSuccess"
+        :action="importUrl"
+        accept=".xlsx"
+        name="File"
+        :show-file-list="false"
+      >
+        <el-button type="primary">导入名单</el-button>
+      </el-upload>
+      <el-button
+        type="primary"
+        plain
+        style="float: right"
+        :disabled="!code"
+        @click="handleDownLoadList"
+        >下载名单</el-button
+      >
+      <!-- <a style="width: 100%" :href="downloadUrl+'?Code='+code" download></a> -->
+    </div>
+    <el-table :data="tableData" border style="width: 100%" max-height="800">
+      <el-table-column
+        :prop="col.key"
+        :label="col.label"
+        v-for="col in colList"
+        :key="col.label"
+        align="center"
+      >
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+<style scoped lang="scss">
+.custome-list-match-page{
+    background-color: #fff;
+    border: 1px solid #ECECEC;
+    padding: 30px;
+    border-radius: 4px;
+    min-height: 60vh;
+}
+</style>

src/views/ficc_manage/apply/components/interviewDia.vue

@@ -0,0 +1,122 @@
+<script setup>
+import { ref } from "vue";
+import { ElMessage } from "element-plus";
+import { ficcManageInterface, customInterence } from "@/api/api.js";
+
+const props = defineProps({
+  isShowDia: {
+    type: Boolean,
+    require: true,
+  },
+  item: {
+    type: Object,
+    require: true,
+  },
+  activeName: {
+    type: Number,
+  },
+});
+
+const emit = defineEmits(["success", "close"]);
+
+/* 处理申请 */
+async function dealApply() {
+  let res;
+  try {
+    if (props.activeName > 1) {
+      res = await customInterence.trialStatus({
+        Id: props.item.Id,
+      });
+    } else {
+      res = await ficcManageInterface.applyRecordDeal({
+        ApplyRecordId: props.item.ApplyRecordId,
+        UserId: props.item.UserId,
+      });
+    }
+
+    if (res.Ret === 200) {
+      ElMessage.success("标记处理完成");
+      cancelHandle();
+      emit("success");
+    }
+  } catch (err) {
+    console.dir(err);
+  }
+}
+
+function cancelHandle() {
+  emit("close");
+}
+</script>
+<template>
+  <el-dialog
+    draggable
+    :model-value="isShowDia"
+    :close-on-click-modal="false"
+    :modal-append-to-body="false"
+    :show-close="false"
+    @close="cancelHandle"
+    class="interview_dialog"
+    center
+    width="450px"
+  >
+    <template #header>
+      <div style="position: relative">
+        <span style="font-size: 16px">标记处理</span>
+        <i
+          class="el-icon-close"
+          style="
+            font-size: 24px;
+            cursor: pointer;
+            position: absolute;
+            right: 20px;
+            top: 50%;
+            transform: translateY(-50%);
+          "
+          @click="cancelHandle"
+        ></i>
+      </div>
+    </template>
+    <!-- 申请弹窗 -->
+    <div class="dialog_cont">
+      <!-- 处理申请 -->
+      <span>是否确认已处理该用户申请？</span>
+    </div>
+    <div style="display: flex; justify-content: center; margin: 40px 0">
+      <template>
+        <el-button
+          type="primary"
+          style="width: 80px; marginright: 24px"
+          @click="dealApply"
+          >确定</el-button
+        >
+        <el-button
+          type="primary"
+          plain
+          style="width: 80px"
+          @click="cancelHandle"
+          >取消</el-button
+        >
+      </template>
+    </div>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.interview-dialog {
+  .dialog_cont {
+    padding: 0 10px;
+    .node_name {
+      font-size: 15px;
+      margin-bottom: 20px;
+    }
+    .node_ipt {
+      display: block;
+      width: 100%;
+      margin: 20px 0;
+    }
+  }
+  .el-dialog__body {
+    flex-direction: column;
+  }
+}
+</style>

src/views/ficc_manage/apply/components/moveCustomDia.vue

@@ -0,0 +1,394 @@
+<script setup>
+import { reactive, ref } from 'vue'
+import { ElMessage } from 'element-plus'
+import { customInterence, ficcManageInterface } from "@/api/api.js";
+import $ from 'jquery';
+
+const props = defineProps({
+  isShow: {
+      type: Boolean,
+      require: true,
+  },
+  item:{
+      type:Object,
+      require:true,
+  }
+})
+
+const emit = defineEmits(['close','success'])
+
+
+const formRule = {
+  type: [
+    { required: true, message: "移动类型不能为空", trigger: "blur" },
+  ],
+  name: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
+  sex: [{ required: true, message: "性别不能为空", trigger: "change" }],
+  desiger: [
+    { required: true, message: "请选择是否为决策人", trigger: "change" },
+  ],
+}
+const userForm = reactive({
+  id: "",
+  type: "",
+  name: "",
+  sex: 1,
+  mobile: "",
+  mail: "",
+  remark: "",
+  carte: "",
+  desiger: "",
+  post: "",
+  park: "",
+})
+const userFormRef = ref(null)
+
+
+/* 取消弹窗 */
+function cancelHandle() {
+  emit('close')
+  userForm.id= "",
+  userForm.type= "",
+  userForm.name= "",
+  userForm.mobile= "",
+  userForm.mail= "",
+  userForm.remark= "",
+  userForm.desiger='',
+  userForm.post=''
+
+  userFormRef.value.resetFields(); //重置校验
+}
+
+
+
+/* 保存 */
+function saveHandle() {
+  let SellerId=localStorage.getItem('AdminId')
+  userFormRef.value.validate((valid) => {
+    if (valid) {
+      ficcManageInterface
+        .moveUserByApplyRecord({
+          CompanyId: Number(userForm.type),
+          BusinessCardUrl:userForm.carte,
+          DepartmentName:userForm.park,
+          Email: userForm.mail,
+          IsMaker:Number(userForm.desiger),
+          Mobile: userForm.mobile,
+          Position:userForm.post,
+          RegionType:"",
+          RealName: userForm.name,
+          Remark: userForm.remark,
+          SellerId:Number(SellerId),
+          Sex:Number(userForm.sex),
+          UserId: Number(userForm.id),
+          ApplyRecordId: Number(item.ApplyRecordId),
+        })
+        .then((res) => {
+          if (res.Ret === 200) {
+            ElMessage.success("移动成功！");
+            cancelHandle()
+            emit('success')
+          }
+        });
+    }
+  });
+}
+
+
+/* 过滤公司 */
+const typeArr = ref([]) //公司列表
+function getCompany(query) {
+  if (query) {
+    customInterence
+      .companySearch({
+        KeyWord: query,
+      })
+      .then((res) => {
+        if (res.Ret === 200) {
+          // 去掉潜在客户一项
+          typeArr.value = res.Data.List.filter(item=>item.CompanyName!=='潜在客户') || [];
+        }
+      });
+  } else {
+    typeArr.value = [];
+  }
+}
+
+
+function focusGetCompany() {
+  customInterence
+    .companySearch({
+      KeyWord: "##",
+    })
+    .then((res) => {
+      if (res.Ret === 200) {
+        typeArr.value = res.Data.List || [];
+      }
+    });
+}
+
+
+// 选择文件上传
+const uploadloading = ref(false)
+function fileSelected() {
+  //选择文件上传
+  if (document.getElementById("fileCard").files[0]) {
+    let hostfile = document.getElementById("fileCard").files[0];
+    let size = Math.floor(hostfile.size / 1024 / 1024);
+    if (size > 200) {
+      ElMessage.error("上传文件大小不能大于200M！");
+      hostfile = {};
+      return false;
+    }
+    if (
+      hostfile.name.toLowerCase().includes(".png") ||
+      hostfile.name.toLowerCase().includes(".jpg") ||
+      hostfile.name.toLowerCase().includes(".jpeg")
+    ) {
+      let form = new FormData();
+      form.append("file", hostfile); //hostfile.name
+      uploadloading.value = true;
+      customInterence.upload(form).then((res) => {
+        if (res.Ret === 200) {
+          // that.$message.success( '上传成功' );
+          this.userForm.carte = res.Data.ResourceUrl;
+        }
+        uploadloading.value = false;
+        $("#fileCard").val("");
+        hostfile = {};
+      });
+    } else {
+      this.$message.error("上传文件格式不正确！");
+    }
+  }
+}
+
+
+function clickinput() {
+  //上传模拟点击
+  // debugger
+  $("#fileCard").click();
+}
+
+/* 预览 */
+function preview() {
+  $("#img").click();
+}
+
+</script>
+<template>
+  <el-dialog
+    class="move-dialog"
+    draggable
+    :model-value="isShow"
+    :close-on-click-modal="false"
+    :modal-append-to-body="false"
+    @close="cancelHandle()"
+    center
+  >
+    <template #header>
+      <div style="display: flex; align-items: center">
+        <img
+          :src="$icons.move"
+          style="color: #fff; width: 16px; height: 16px; margin-right: 5px"
+        />
+        <span style="font-size: 16px">移动联系人</span>
+      </div>
+    </template>
+    <el-form
+      :model="userForm"
+      :rules="formRule"
+      ref="userFormRef"
+      label-width="80px"
+      style="margin-top: 15px"
+    >
+      <div class="move-form-item">
+        <el-form-item label="移动到" prop="type" style="width: 50%">
+          <el-select
+            v-model="userForm.type"
+            filterable
+            remote
+            :remote-method="getCompany"
+            @focus="focusGetCompany"
+            placeholder="请选择公司"
+            style="width: 70%"
+          >
+            <el-option
+              v-for="item in typeArr"
+              :key="item.CompanyId"
+              :label="item.CompanyName"
+              :value="item.CompanyId"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <span
+          style="
+            color: #409eff;
+            font-size: 16px;
+            cursor: pointer;
+            margin-left: 34px;
+          "
+          @click="$router.push({ path: '/addCustom' })"
+          >创建客户</span
+        >
+      </div>
+      <div class="move-form-item">
+        <el-form-item label="姓名" prop="name" style="width: 50%">
+          <el-input
+            v-model="userForm.name"
+            placeholder="请填写姓名"
+            style="width: 70%"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="性别" prop="sex" style="width: 50%">
+          <el-radio-group v-model="userForm.sex">
+            <el-radio :label="1">男</el-radio>
+            <el-radio :label="2">女</el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </div>
+
+      <div class="move-form-item">
+        <el-form-item label="手机号" prop="mobile" style="width: 50%">
+          <el-input
+            v-model="userForm.mobile"
+            placeholder="请填写手机号"
+            style="width: 70%"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="邮箱" prop="mail" style="width: 50%">
+          <el-input
+            v-model="userForm.mail"
+            placeholder="请填写邮箱"
+            style="width: 70%"
+          ></el-input>
+        </el-form-item>
+      </div>
+      <div class="move-form-item">
+        <el-form-item label="职位" prop="post" style="width: 50%">
+          <el-input
+            v-model="userForm.post"
+            placeholder="请输入职位"
+            style="width: 70%"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="决策人" prop="desiger" style="width: 50%">
+          <el-select
+            v-model="userForm.desiger"
+            placeholder="请选择"
+            style="width: 70%"
+          >
+            <el-option label="是" value="1"></el-option>
+            <el-option label="否" value="0"></el-option>
+          </el-select>
+        </el-form-item>
+      </div>
+      <div class="move-form-item">
+        <el-form-item label="部门" prop="park" style="width: 50%">
+          <el-input
+            v-model="userForm.park"
+            placeholder="请输入部门"
+            style="width: 70%"
+          ></el-input>
+        </el-form-item>
+      </div>
+
+      <el-form-item label="个人名片" prop="carte" style="width: 50%">
+        <input
+          type="file"
+          name="file"
+          @change="fileSelected"
+          id="fileCard"
+          class="true-file"
+          style="display: none"
+        />
+        <el-button
+          type="primary"
+          size="default"
+          @click="clickinput"
+          v-if="!userForm.carte"
+          >点击上传</el-button
+        >
+        <div class="img_item" v-if="userForm.carte">
+          <el-image
+            :src="userForm.carte"
+            alt=""
+            style="background: #aaa; width: 280px; height: 180px"
+            :preview-src-list="userForm.carte.split(',')"
+            id="img"
+          />
+          <i
+            class="el-icon-zoom-in"
+            style="position: absolute; right: 20px; top: 20px; color: #fff"
+            @click="preview"
+          ></i>
+          <span
+            style="
+              position: absolute;
+              right: 12px;
+              bottom: 1px;
+              color: #409eff;
+              font-size: 16px;
+              cursor: pointer;
+            "
+            @click.stop="clickinput"
+            >重新上传</span
+          >
+        </div>
+      </el-form-item>
+    </el-form>
+    <div style="display: flex; justify-content: center; margin: 0 0 26px">
+      <el-button
+        type="primary"
+        style="width: 80px; margin-right: 24px"
+        @click="saveHandle"
+        >确定</el-button
+      >
+      <el-button style="width: 80px" @click="cancelHandle">取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+<style lang='scss' scoped>
+.move-dialog{
+  .potential_container {
+    // reset
+    .el-form-item__label {
+      font-size: 16px;
+      padding-right: 20px !important;
+    }
+    .potential_top {
+      display: flex;
+      justify-content: space-between;
+      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);
+    }
+    .potential_cont {
+      min-height: calc(100vh - 260px);
+      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);
+    }
+  }
+  .move-form-item{
+    display: flex;
+  }
+  .img_item{
+    position: relative;
+    width: 280px;
+    height: 180px;
+  }
+
+  .el-select :deep(.el-input) {
+    width: 100%;
+  }
+}
+</style>

src/views/ficc_manage/hooks/use-ficcMan.js

@@ -0,0 +1,25 @@
+import { ref } from 'vue'
+
+
+/* 移动联系人弹窗 */
+export function useMoveContacts() {
+  const isShowMoveDia = ref(false)
+  const dealObj = ref({})
+
+  //打开移动弹窗
+  function moveHandle(item) {
+    dealObj.value = item;
+    isShowMoveDia.value = true;
+  }
+
+  function closeMove() {
+    isShowMoveDia.value = false
+  }
+
+  return {
+    isShowMoveDia,
+    dealObj,
+    moveHandle,
+    closeMove
+  }
+}

src/views/ficc_manage/userApplication.vue

@@ -0,0 +1,649 @@
+<script setup>
+import { computed, ref } from "vue";
+import { useRouter } from 'vue-router'
+import { ElMessageBox, ElMessage } from "element-plus";
+import { Search } from "@element-plus/icons-vue";
+import { ficcManageInterface, customInterence } from "@/api/api.js";
+import mPage from "@/components/mPage.vue";
+import Readia from "@/views/custom_manage/custom/components/ReadDialog.vue";
+import intervewDia from "./apply/components/interviewDia.vue";
+import moveCustomDia from "./apply/components/moveCustomDia.vue";
+import { useReadia } from "@/views/custom_manage/custom/hooks/customlistHook";
+import { useMoveContacts } from './hooks/use-ficcMan.js'
+import moment from "moment";
+import DatePicker from "vue-datepicker-next";
+
+const router = useRouter()
+
+//导出url
+const exportUrl = computed(() => {
+  let url = import.meta.env.VITE_APP_API_ROOT;
+  let param_token = localStorage.getItem("auth") || "";
+  let sourceType = activeName.value === 2 ? "中文官网" : "英文官网";
+  const recodeUrl = `/yb/apply_record/listV2/export?States=${search_type.value}&ApplyStatus=${custom_apply_type.value}&KeyWord=${search_txt.value}&${param_token}`;
+  const official = `/custom/official/user/list/export?SourceType=${sourceType}&KeyWord=${search_txt.value}&${param_token}`;
+  url += activeName.value === 1 ? recodeUrl : official;
+  return url;
+});
+//tabs数组,根据Role决定是否显示后两个
+const Tabs = computed(() => {
+  //判断Role，为销售时不显示后面两个
+  let roleType = localStorage.getItem("Role");
+  if (!["ficc_admin", "admin"].includes(roleType)) {
+    return [getTabs[0]];
+  } else {
+    return getTabs;
+  }
+});
+
+const applyArr = [
+  { name: "已申请", value: "已申请" },
+  { name: "未申请", value: "未申请" },
+];
+const getTabs = [
+  { name: "弘则研报", type: 1 },
+  { name: "中文官网", type: 2 },
+  { name: "英文官网", type: 3 },
+];
+const statusArr = [
+  { name: "潜在用户", value: 1 },
+  /* { name: "权益用户", value: 2 }, */
+  { name: "流失", value: 3 },
+  { name: "冻结", value: 4 },
+  { name: "试用暂停", value: 5 },
+];
+const groupArr = [
+  { name: "楼颖丹组", value: "楼颖丹组" },
+  { name: "时代组", value: "时代组" },
+  { name: "岳梦琳组", value: "岳梦琳组" },
+  { name: "权益组", value: "权益组" },
+];
+
+/* 获取表格数据 */
+const tableLoading = ref(false);
+const tableData = ref([]);
+const tableColums = ref([]);
+const activeName = ref(1);
+const activeItem = { name: "弘则研报", type: 1 };
+
+const total = ref(0);
+const pageSize = ref(10);
+const page_no = ref(1);
+const search_txt = ref("");
+const search_type = computed(() => custom_type.value.join(","));
+const custom_type = ref([]);
+const custom_apply_type = ref("");
+const group_type = ref("");
+const date_range = ref([]);
+async function getTableData() {
+  tableLoading.value = true;
+  const res =
+    activeName.value == 1
+      ? await ficcManageInterface.applyRecordListV2({
+          PageSize: pageSize.value,
+          CurrentIndex: page_no.value,
+          KeyWord: search_txt.value,
+          States: search_type.value,
+          ApplyStatus: custom_apply_type.value,
+          MarkGroup: group_type.value,
+          StartDate: date_range.value[0],
+          EndDate: date_range.value[1],
+        })
+      : await customInterence.trialList({
+          PageSize: pageSize.value,
+          CurrentIndex: page_no.value,
+          SourceType:
+            activeName.value == 2
+              ? "中文官网"
+              : activeName.value == 3
+              ? "英文官网"
+              : "",
+          KeyWord: search_txt.value,
+          MarkGroup: group_type.value,
+          StartDate: date_range.value[0],
+          EndDate: date_range.value[1],
+        });
+
+  tableLoading.value = false;
+  if (res.Ret === 200) {
+    tableData.value = res.Data.List || [];
+    total.value = res.Data.Paging.Totals;
+  }
+}
+getTableData();
+
+//表格列
+const getTableColums = (type) => {
+  return type === 1
+    ? [
+        {
+          label: "姓名",
+          key: "RealName",
+        },
+        {
+          label: "手机号码",
+          key: "Mobile",
+        },
+        {
+          label: "邮箱",
+          key: "Email",
+        },
+        {
+          label: "最新提交时间",
+          key: "LastTime",
+          minwidthsty: 140,
+        },
+        {
+          label: "累计提交次数",
+          key: "ApplyTotal",
+        },
+        {
+          label: "最近一次阅读时间",
+          key: "LastViewTimeStr",
+          minwidthsty: 140,
+        },
+        {
+          label: "累计阅读次数",
+          key: "ViewTotal",
+        },
+        {
+          label: "公司",
+          key: "CompanyName",
+        },
+        {
+          label: "原销售",
+          key: "OriginSellerName",
+        },
+        {
+          label: "来源",
+          key: "SourceStr",
+        },
+        {
+          label: "申请品种",
+          key: "Permission",
+        },
+        {
+          label: "申请类型",
+          key: "ApplyStatus",
+        },
+        {
+          label: "用户状态",
+          key: "Status",
+        },
+      ]
+    : type === 2
+    ? [
+        {
+          label: "企业名称",
+          key: "CompanyName",
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+        },
+        {
+          label: "手机号/邮箱",
+          key: "Phone",
+        },
+        {
+          label: "所属行业",
+          key: "Industry",
+        },
+        {
+          label: "申请时间",
+          key: "CreateTimeStr",
+        },
+        {
+          label: "申请品种",
+          key: "ProductInfo",
+        },
+      ]
+    : [
+        {
+          label: "企业名称",
+          key: "CompanyName",
+        },
+        {
+          label: "姓名",
+          key: "RealName",
+        },
+        {
+          label: "邮箱",
+          key: "Email",
+        },
+        {
+          label: "信息",
+          key: "Message",
+        },
+        {
+          label: "发送时间",
+          key: "CreateTimeStr",
+        },
+      ];
+};
+tableColums.value = getTableColums(1);
+
+function changeQuery() {
+  page_no.value = 1;
+  getTableData();
+}
+
+// 页码改变事件
+function handleCurrentChange(page, index) {
+  page_no.value = page;
+  getTableData();
+}
+
+/* top的点击事件 */
+function handleTabsClick(item) {
+  if (activeName.value !== item.type) {
+    activeName.value = item.type;
+    tableColums.value = getTableColums(activeName.value);
+  }
+  //重置筛选项
+  search_txt.value = "";
+  custom_type.value = [];
+  custom_apply_type.value = [];
+  date_range.value = [];
+  group_type.value = "";
+
+  changeQuery();
+}
+
+const { readId, isRead, cancelRead, lookReport, readTit } = useReadia();
+/* 表格行的点击事件 */
+function handleRowClick(row, key) {
+  if (key === "ViewTotal") {
+    lookReport(row);
+  }
+}
+
+/* 表格行的样式 */
+function handleRowStyle(key) {
+  const style = {
+    ViewTotal: "color: #409eff; cursor: pointer",
+  };
+  return style[key] ? style[key] : "";
+}
+
+/* 表格行的数据处理 */
+function handleRowContent(row, key) {
+  if (["LastTime", "LastViewTimeStr"].includes(key)) {
+    return row[key] && row[key].length > 0
+      ? moment(row[key]).format("YYYY-MM-DD HH:mm:ss")
+      : "";
+  } else {
+    return row[key];
+  }
+}
+
+//删除
+function delHandle(item) {
+  ElMessageBox.confirm("是否删除该申请记录", "提示", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(() => {
+      ficcManageInterface
+        .delPotentialUser({ UserId: Number(item.UserId) })
+        .then((res) => {
+          if (res.Ret === 200) {
+            ElMessage({
+              type: "success",
+              message: "删除成功!",
+            });
+            getTableData();
+          }
+        });
+    })
+    .catch(() => {});
+}
+
+//打开标记分组弹窗
+const isChooseGroupDialogShow = ref(false);
+const choosed_row = ref(null);
+const choosed_group = ref("");
+function handleChooseGroup(row) {
+  choosed_row.value = row;
+  choosed_group.value = "";
+  isChooseGroupDialogShow.value = true;
+}
+
+const isShowDia = ref(false)
+//标记分组
+async function chooseGroup() {
+  if (!choosed_group.value) {
+    ElMessage.warning("请选择分组");
+    return;
+  }
+  const { ApplyRecordId, UserId, Id } = choosed_row.value;
+  //请求接口
+  const res =
+    activeName.value === 1
+      ? await customInterence.markApplyUser({
+          ApplyRecordId,
+          UserId,
+          GroupName: choosed_group.value,
+        })
+      : await customInterence.markOfficialUser({
+          Id,
+          GroupName: choosed_group.value,
+        });
+
+  if (res.Ret !== 200) return;
+  ElMessage.success("标记分组成功");
+  isChooseGroupDialogShow.value = false;
+  choosed_group.value = "";
+  getTableData();
+}
+
+const { isShowMoveDia,dealObj,moveHandle,closeMove } = useMoveContacts()
+</script>
+<template>
+  <div class="container-userapplication">
+    <div class="userapplication-top">
+      <div class="top-tabs">
+        <el-radio-group
+          v-model="activeName"
+          @change="handleTabsClick(activeItem)"
+        >
+          <el-radio-button
+            :label="item.type"
+            v-for="item in Tabs"
+            :key="item.name"
+            >{{ item.name }}</el-radio-button
+          >
+        </el-radio-group>
+      </div>
+    </div>
+    <el-card style="margin-top: 20px">
+      <div class="export-select">
+        <date-picker
+          v-model:value="date_range"
+          type="date"
+          range
+          value-type="format"
+          :placeholder="`请选择${
+            activeName === 1 ? '提交' : activeName === 2 ? '申请' : '发送'
+          }时间`"
+          @change="changeQuery"
+        >
+        </date-picker>
+        <el-select
+          v-if="activeName == 1"
+          v-model="custom_apply_type"
+          placeholder="请选择申请类型"
+          style="width: 160px"
+          clearable
+          @change="changeQuery"
+        >
+          <el-option
+            v-for="item in applyArr"
+            :key="item.name"
+            :label="item.name"
+            :value="item.name"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          v-if="activeName == 1"
+          v-model="custom_type"
+          placeholder="请选择用户状态"
+          style="width: 200px"
+          clearable
+          multiple
+          @change="changeQuery"
+        >
+          <el-option
+            v-for="item in statusArr"
+            :key="item.name"
+            :label="item.name"
+            :value="item.name"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          v-model="group_type"
+          placeholder="请选择分组"
+          style="width: 160px"
+          clearable
+          @change="changeQuery"
+        >
+          <el-option
+            v-for="item in groupArr"
+            :key="item.name"
+            :label="item.name"
+            :value="item.name"
+          >
+          </el-option>
+        </el-select>
+        <el-input
+          placeholder="姓名/手机号/邮箱/公司名称"
+          v-model="search_txt"
+          clearable
+          style="max-width: 240px"
+          @input="changeQuery"
+        >
+          <template #prefix>
+            <el-icon><Search /></el-icon>
+          </template>
+        </el-input>
+      </div>
+      <el-table
+        :data="tableData"
+        v-loading="tableLoading"
+        element-loading-text="数据加载中..."
+        border
+      >
+        <el-table-column
+          v-for="item in tableColums"
+          :key="item.label"
+          :label="item.label"
+          :width="item.widthsty"
+          :min-width="item.minwidthsty"
+          align="center"
+        >
+          <template #default="{ row }">
+            <div v-if="item.key == 'CompanyName'">
+              <span
+                style="color: #409eff; cursor: pointer"
+                v-if="row.CompanyId > 1"
+                @click="
+                  router.push({
+                    path: '/RaiDetail',
+                    query: {
+                      id: row.CompanyId,
+                    },
+                  })
+                "
+                >{{ row.UserCompanyName || row.CompanyName }}</span
+              >
+              <span v-else>{{ row.UserCompanyName || row.CompanyName }}</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-column label="分组" align="center">
+          <template #default="{ row }">
+            <span>{{ row.MarkGroup }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center">
+          <template #default="{ row }">
+            <div v-if="activeName == 1">
+              <span
+                class="editsty"
+                v-if="row.OpStatus === 0 && row.IsMove === 0"
+                @click="handleChooseGroup(row)"
+                >标记</span
+              >
+            </div>
+            <div v-else>
+              <span
+                class="editsty"
+                v-if="row.Status === '待处理'"
+                @click="handleChooseGroup(row)"
+                >标记</span
+              >
+            </div>
+            <span
+              class="editsty"
+              v-if="activeName == 1 && row.IsMove === 0"
+              @click="moveHandle(row)"
+              >移动</span
+            >
+            <!-- <span class="editsty" style="color:#ff0000" v-if="row.DelBtn" @click="delHandle(row)">删除</span> -->
+          </template>
+        </el-table-column>
+        <template #empty>
+          <div style="padding: 20px 0">
+            <img
+              src="~@/assets/img/data_m/table_no.png"
+              alt=""
+              style="display: block; width: 135px; height: 90px; margin: 0 auto"
+            />
+            <span>暂无数据</span>
+          </div>
+        </template>
+      </el-table>
+      <el-col :span="24" class="toolbar">
+        <m-page
+          :total="total"
+          :page_no="page_no"
+          :pageSize="10"
+          @handleCurrentChange="handleCurrentChange"
+        />
+      </el-col>
+    </el-card>
+    <!-- 阅读报告弹窗 -->
+    <Readia
+      :readId="readId"
+      :lookRead="isRead"
+      :title="readTit"
+      @cancelRead="cancelRead"
+    >
+    </Readia>
+    <!-- 处理弹窗 -->
+    <!-- <intervewDia
+      :isShowDia="isShowDia"
+      :item="dealObj"
+      :activeName="activeName"
+    /> -->
+    <!-- 移动弹窗 -->
+    <moveCustomDia
+      :isShow="isShowMoveDia"
+      :item="dealObj"
+      @close="closeMove"
+    />
+    <!-- 标记分组弹窗 -->
+    <el-dialog
+      draggable
+      v-model="isChooseGroupDialogShow"
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      title="标记"
+      width="480px"
+      center
+      @close="isChooseGroupDialogShow = false"
+    >
+      <div class="dialog-container">
+        <div class="select" style="display: flex; align-items: center">
+          <span>分组：</span>
+          <el-select
+            v-model="choosed_group"
+            placeholder="请选择分组"
+            style="flex: 1; margin-left: 10px"
+          >
+            <el-option
+              v-for="item in groupArr"
+              :key="item.name"
+              :label="item.name"
+              :value="item.name"
+            >
+            </el-option>
+          </el-select>
+        </div>
+      </div>
+      <div style="display: flex; justify-content: center; margin: 20px 0">
+        <el-button
+          type="primary"
+          style="width: 80px; marginright: 24px"
+          @click="chooseGroup"
+          >保存</el-button
+        >
+        <el-button
+          type="primary"
+          plain
+          style="width: 80px"
+          @click="isChooseGroupDialogShow = false"
+          >取消</el-button
+        >
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<style scoped lang="scss">
+.container-userapplication {
+  min-width: 1500px;
+  .userapplication-top {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    border: 1px solid #ececec;
+    padding: 20px 30px;
+    background: #fff;
+    border-radius: 4px;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+  }
+  .top-tabs {
+    display: flex;
+    .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: 20px;
+      cursor: pointer;
+    }
+  }
+  .export-select {
+    display: flex;
+    flex: 1;
+    justify-content: flex-start;
+    align-items: flex-start;
+    gap: 10px;
+    margin-bottom: 20px;
+    .el-input {
+      margin-left: auto;
+    }
+  }
+
+  :deep(.el-dialog .el-input) {
+    width: 100%;
+  }
+
+}
+.container-userapplication :deep(.mx-datepicker) {
+  width: 200px !important;
+}
+
+</style>