update

src/api/flow.ts

@@ -14,3 +14,8 @@ export function getAttrList() {
 export function createMember(data: { name: string; status: string; experiment_connection_id: string; gender: string; mobile: string; fields: string }) {
   return httpRequest.post('/api/lab/v1/experiment/member/create', data)
 }
+
+// 链接列表
+export function getConnectionList(params: { created_operator?: string; type?: string; page?: number; page_size?: number }) {
+  return httpRequest.get('/api/lab/v1/experiment/connection/list', { params })
+}
\ No newline at end of file

src/components/flow/CustomNode.vue

@@ -24,7 +24,26 @@ const component = computed(() => {
     ),
     TriggeringConditions8: markRaw(
       defineAsyncComponent(() => import('./components/triggeringConditions/TriggeringConditions8.vue'))
-    )
+    ),
+    TriggeringConditions9: markRaw(
+      defineAsyncComponent(() => import('./components/triggeringConditions/TriggeringConditions9.vue'))
+    ),
+    TriggeringConditions10: markRaw(
+      defineAsyncComponent(() => import('./components/triggeringConditions/TriggeringConditions10.vue'))
+    ),
+    marketingAction1: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction1.vue'))),
+    marketingAction2: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction2.vue'))),
+    marketingAction3: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction3.vue'))),
+    marketingAction4: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction4.vue'))),
+    marketingAction5: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction5.vue'))),
+    marketingAction6: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction6.vue'))),
+    marketingAction7: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction7.vue'))),
+    marketingAction8: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction8.vue'))),
+    marketingAction9: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction9.vue'))),
+    marketingAction10: markRaw(
+      defineAsyncComponent(() => import('./components/marketingAction/marketingAction10.vue'))
+    ),
+    marketingAction11: markRaw(defineAsyncComponent(() => import('./components/marketingAction/marketingAction11.vue')))
   }
   return allComponent[props.node?.data.componentName]
 })

src/components/flow/Sidebar.vue

@@ -15,7 +15,9 @@ const list = ref([
       { name: '抖音', type: '触发条件', icon: '6', componentName: 'TriggeringConditions5' },
       { name: '小红书', type: '触发条件', icon: '8', componentName: 'TriggeringConditions6' },
       { name: '微博', type: '触发条件', icon: '7', componentName: 'TriggeringConditions7' },
-      { name: '自定义', type: '触发条件', icon: '12', componentName: 'TriggeringConditions8' }
+      { name: '自定义', type: '触发条件', icon: '12', componentName: 'TriggeringConditions8' },
+      { name: '小鹅通', type: '触发条件', icon: '3', componentName: 'TriggeringConditions9' },
+      { name: '问卷星', type: '触发条件', icon: '4', componentName: 'TriggeringConditions10' }
     ]
   },
   {
@@ -25,19 +27,19 @@ const list = ref([
       color: '#19AAA5'
     },
     children: [
-      { name: '终止旅程', type: '营销动作', icon: '16' },
-      { name: '加入群组', type: '营销动作', icon: '14' },
-      { name: '移除群组', type: '营销动作', icon: '17' },
-      { name: '变更属性', type: '营销动作', icon: '15' },
-      { name: '延时处理', type: '营销动作', icon: '18' },
-      { name: '内部通知', type: '营销动作', icon: '19' },
-      { name: '短信', type: '营销动作', icon: '10' },
-      { name: '邮件', type: '营销动作', icon: '9' },
-      { name: '公众号', type: '营销动作', icon: '1' },
-      { name: '抖音', type: '营销动作', icon: '6' },
-      { name: '小红书', type: '营销动作', icon: '8' },
-      { name: '微博', type: '营销动作', icon: '7' },
-      { name: '钉钉', type: '营销动作', icon: '2' }
+      // { name: '终止旅程', type: '营销动作', icon: '16' },
+      { name: '加入群组', type: '营销动作', icon: '14', componentName: 'marketingAction1' },
+      { name: '移除群组', type: '营销动作', icon: '17', componentName: 'marketingAction2' },
+      { name: '变更属性', type: '营销动作', icon: '15', componentName: 'marketingAction3' },
+      { name: '延时处理', type: '营销动作', icon: '18', componentName: 'marketingAction4' },
+      { name: '内部通知', type: '营销动作', icon: '19', componentName: 'marketingAction5' },
+      { name: '短信', type: '营销动作', icon: '10', componentName: 'marketingAction6' },
+      { name: '邮件', type: '营销动作', icon: '9', componentName: 'marketingAction7' },
+      { name: '公众号', type: '营销动作', icon: '1', componentName: 'marketingAction8' },
+      { name: '抖音', type: '营销动作', icon: '6', componentName: 'marketingAction9' },
+      // { name: '小红书', type: '营销动作', icon: '8' },
+      { name: '微博', type: '营销动作', icon: '7', componentName: 'marketingAction10' },
+      { name: '钉钉', type: '营销动作', icon: '2', componentName: 'marketingAction11' }
     ]
   },
   {

src/components/flow/components/marketingAction/marketingAction1.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getGroupsList } from '@/api/flow'
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ group_id: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+// 获取群组列表
+const groupsOption = ref([])
+const getGroups = function () {
+  getGroupsList().then(res => {
+    groupsOption.value = res.data.items
+  })
+}
+
+onMounted(() => {
+  getGroups()
+})
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="14" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <el-form-item>
+          <el-select style="width: 100%" v-model="form.group_id" placeholder="请选择用户群组">
+            <el-option :key="item.id" v-for="item in groupsOption" :value="item.id" :label="item.name"></el-option>
+          </el-select>
+        </el-form-item>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <el-form-item>
+            <el-select style="width: 100%" v-model="form.group_id" placeholder="请选择用户群组">
+              <el-option :key="item.id" v-for="item in groupsOption" :value="item.id" :label="item.name"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction10.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getConnectionList } from '@/api/flow'
+import { useMapStore } from '@/stores/map'
+import { getMaterialList } from '@/api/base'
+
+const store = useMapStore()
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ step_one_id: '0', step_two_value: '', material_type: '1', material_value: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+    stepActive.value = 0
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+const stepOneOptions = [
+  { label: '发送私信', value: '0' },
+  { label: '发送图片', value: '1' },
+  { label: '向用户发送视频私信', value: '2' }
+]
+
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '7' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+  changeMaterialType()
+})
+
+// 步骤
+let stepActive = ref(0)
+
+// 选择资料类型
+let materiaList = ref([])
+const changeMaterialType = function () {
+  form.material_value = ''
+  getMaterialList({ type: form.material_type }).then(res => {
+    materiaList.value = res.data.list
+  })
+}
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="7" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <!-- 第一步 -->
+        <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+          <el-radio :label="item.value" v-for="item in stepOneOptions">{{ item.label }}</el-radio>
+        </el-radio-group>
+        <!-- 第二步 -->
+        <el-select
+          placeholder="请选择关联使用微博"
+          style="width: 100%"
+          v-model="form.step_two_value"
+          v-if="stepActive === 1"
+        >
+          <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+        </el-select>
+        <!-- 第三步 -->
+        <div class="means-box" v-if="stepActive === 2">
+          <el-form-item label="请选择营销资料">
+            <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+              <el-radio
+                style="width: 105px"
+                :label="item.value"
+                v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="营销资料">
+            <el-select placeholder="请选择使用营销资料" v-model="form.material_value" style="width: 100%">
+              <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+            </el-select>
+          </el-form-item>
+        </div>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <!-- 第一步 -->
+          <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+            <el-radio :label="item.value" v-for="item in stepOneOptions">{{ item.label }}</el-radio>
+          </el-radio-group>
+          <!-- 第二步 -->
+          <el-select
+            placeholder="请选择关联使用微博"
+            style="width: 100%"
+            v-model="form.step_two_value"
+            v-if="stepActive === 1"
+          >
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+          </el-select>
+          <!-- 第三步 -->
+          <div class="means-box" v-if="stepActive === 2">
+            <el-form-item label="请选择营销资料">
+              <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+                <el-radio
+                  style="width: 105px"
+                  :label="item.value"
+                  v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                  >{{ item.label }}</el-radio
+                >
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item label="营销资料">
+              <el-select placeholder="请选择使用营销资料" v-model="form.material_value" style="width: 100%">
+                <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+              </el-select>
+            </el-form-item>
+          </div>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <!-- <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button> -->
+        <el-button @click="stepActive--" plain auto-insert-space v-if="stepActive !== 0">上一步</el-button>
+        <el-button @click="stepActive++" plain auto-insert-space v-if="stepActive < 2">下一步</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit" v-if="stepActive === 2">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction11.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getConnectionList } from '@/api/flow'
+import { useMapStore } from '@/stores/map'
+import { getMaterialList } from '@/api/base'
+
+const store = useMapStore()
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ step_one_id: '0', step_two_value: '', material_type: '1', material_value: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+    stepActive.value = 0
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+const stepOneOptions = [{ label: '发送消息', value: '0' }]
+
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '2' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+  changeMaterialType()
+})
+
+// 步骤
+let stepActive = ref(0)
+
+// 选择资料类型
+let materiaList = ref([])
+const changeMaterialType = function () {
+  form.material_value = ''
+  getMaterialList({ type: form.material_type }).then(res => {
+    materiaList.value = res.data.list
+  })
+}
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="2" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <!-- 第一步 -->
+        <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+          <el-radio :label="item.value" v-for="item in stepOneOptions">{{ item.label }}</el-radio>
+        </el-radio-group>
+        <!-- 第二步 -->
+        <el-select
+          placeholder="请选择关联使用钉钉"
+          style="width: 100%"
+          v-model="form.step_two_value"
+          v-if="stepActive === 1"
+        >
+          <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+        </el-select>
+        <!-- 第三步 -->
+        <div class="means-box" v-if="stepActive === 2">
+          <el-form-item label="请选择营销资料">
+            <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+              <el-radio
+                style="width: 105px"
+                :label="item.value"
+                v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="营销资料">
+            <el-select placeholder="请选择使用营销资料" v-model="form.material_value" style="width: 100%">
+              <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+            </el-select>
+          </el-form-item>
+        </div>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <!-- 第一步 -->
+          <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+            <el-radio :label="item.value" v-for="item in stepOneOptions">{{ item.label }}</el-radio>
+          </el-radio-group>
+          <!-- 第二步 -->
+          <el-select
+            placeholder="请选择关联使用钉钉"
+            style="width: 100%"
+            v-model="form.step_two_value"
+            v-if="stepActive === 1"
+          >
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+          </el-select>
+          <!-- 第三步 -->
+          <div class="means-box" v-if="stepActive === 2">
+            <el-form-item label="请选择营销资料">
+              <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+                <el-radio
+                  style="width: 105px"
+                  :label="item.value"
+                  v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                  >{{ item.label }}</el-radio
+                >
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item label="营销资料">
+              <el-select placeholder="请选择使用营销资料" v-model="form.material_value" style="width: 100%">
+                <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+              </el-select>
+            </el-form-item>
+          </div>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <!-- <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button> -->
+        <el-button @click="stepActive--" plain auto-insert-space v-if="stepActive !== 0">上一步</el-button>
+        <el-button @click="stepActive++" plain auto-insert-space v-if="stepActive < 2">下一步</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit" v-if="stepActive === 2">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction2.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getGroupsList } from '@/api/flow'
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ group_id: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+// 获取群组列表
+const groupsOption = ref([])
+const getGroups = function () {
+  getGroupsList().then(res => {
+    groupsOption.value = res.data.items
+  })
+}
+
+onMounted(() => {
+  getGroups()
+})
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="17" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <el-form-item>
+          <el-select style="width: 100%" v-model="form.group_id" placeholder="请选择用户群组">
+            <el-option :key="item.id" v-for="item in groupsOption" :value="item.id" :label="item.name"></el-option>
+          </el-select>
+        </el-form-item>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <el-form-item>
+            <el-select style="width: 100%" v-model="form.group_id" placeholder="请选择用户群组">
+              <el-option :key="item.id" v-for="item in groupsOption" :value="item.id" :label="item.name"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction3.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getAttrList } from '@/api/flow'
+import { CirclePlusFilled, RemoveFilled } from '@element-plus/icons-vue'
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive([{ attr_id: '', attr_value: '' }])
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+// 获取群组列表
+const attrOption = ref([])
+const getAttr = function () {
+  getAttrList().then(res => {
+    attrOption.value = res.data.items
+  })
+}
+
+onMounted(() => {
+  getAttr()
+})
+
+// 添加属性
+const handleAdd = function () {
+  form.push({ attr_id: '', attr_value: '' })
+}
+
+// 删除属性
+const handleRemove = function (index) {
+  form.splice(index, 1)
+}
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="15" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <el-form-item>
+          <div style="margin-bottom: 15px; display: flex; align-items: center" v-for="(forms, index) in form">
+            <el-select style="width: 130px" v-model="forms.attr_id" placeholder="请选择">
+              <el-option :key="item.id" v-for="item in attrOption" :value="item.id" :label="item.name"></el-option>
+            </el-select>
+            <span style="margin: 0 10px">=</span>
+            <el-input v-model="forms.attr_value" style="width: 200px" placeholder="请输入"></el-input>
+            <el-icon
+              v-if="form.length > 1"
+              style="margin-left: 10px"
+              size="20"
+              color="#cf5b78"
+              @click="handleRemove(index)"
+              ><RemoveFilled
+            /></el-icon>
+            <el-icon
+              v-if="index === form.length - 1"
+              style="margin-left: 10px"
+              size="20"
+              color="#cf5b78"
+              @click="handleAdd"
+              ><CirclePlusFilled
+            /></el-icon>
+          </div>
+        </el-form-item>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <el-form-item>
+            <div style="margin-bottom: 15px; display: flex; align-items: center" v-for="(forms, index) in form">
+              <el-select style="width: 130px" v-model="forms.attr_id" placeholder="请选择">
+                <el-option :key="item.id" v-for="item in attrOption" :value="item.id" :label="item.name"></el-option>
+              </el-select>
+              <span style="margin: 0 10px">=</span>
+              <el-input v-model="forms.attr_value" style="width: 200px" placeholder="请输入"></el-input>
+              <el-icon
+                v-if="form.length > 1"
+                style="margin-left: 10px"
+                size="20"
+                color="#cf5b78"
+                @click="handleRemove(index)"
+                ><RemoveFilled
+              /></el-icon>
+              <el-icon
+                v-if="index === form.length - 1"
+                style="margin-left: 10px"
+                size="20"
+                color="#cf5b78"
+                @click="handleAdd"
+                ><CirclePlusFilled
+              /></el-icon>
+            </div>
+          </el-form-item>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction4.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ date_type: '0', num: '', time_unit: '0', date: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="18" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <el-form-item>
+          <el-radio-group v-model="form.date_type" style="display: block">
+            <el-radio label="0" size="large" style="display: block">
+              <span>延时 </span>
+              <el-input
+                :disabled="form.date_type !== '0'"
+                v-model="form.num"
+                placeholder="请输入"
+                class="input-with-select"
+              >
+                <template #append>
+                  <el-select
+                    :disabled="form.date_type !== '0'"
+                    v-model="form.time_unit"
+                    placeholder="请选择"
+                    style="width: 115px"
+                  >
+                    <el-option label="分钟" value="0" />
+                    <el-option label="小时" value="1" />
+                    <el-option label="日" value="2" />
+                    <el-option label="周" value="3" />
+                  </el-select>
+                </template>
+              </el-input>
+            </el-radio>
+            <el-radio label="1" size="large" style="display: block">
+              <span>延时至 </span>
+              <el-date-picker
+                :disabled="form.date_type !== '1'"
+                v-model="form.date"
+                type="datetime"
+                placeholder="请选择"
+              />
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <el-form-item>
+            <el-radio-group v-model="form.date_type" style="display: block">
+              <el-radio label="0" size="large" style="display: block">
+                <span>延时 </span>
+                <el-input
+                  :disabled="form.date_type !== '0'"
+                  v-model="form.num"
+                  placeholder="请输入"
+                  class="input-with-select"
+                >
+                  <template #append>
+                    <el-select
+                      :disabled="form.date_type !== '0'"
+                      v-model="form.time_unit"
+                      placeholder="请选择"
+                      style="width: 115px"
+                    >
+                      <el-option label="分钟" value="0" />
+                      <el-option label="小时" value="1" />
+                      <el-option label="日" value="2" />
+                      <el-option label="周" value="3" />
+                    </el-select>
+                  </template>
+                </el-input>
+              </el-radio>
+              <el-radio label="1" size="large" style="display: block">
+                <span>延时至 </span>
+                <el-date-picker
+                  :disabled="form.date_type !== '1'"
+                  v-model="form.date"
+                  type="datetime"
+                  placeholder="请选择"
+                />
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction5.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ content: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="19" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <el-form-item>
+          <el-input v-model="form.content" :rows="3" type="textarea" placeholder="请输入" />
+        </el-form-item>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <el-form-item>
+            <el-input v-model="form.content" :rows="3" type="textarea" placeholder="请输入" />
+          </el-form-item>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction6.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getAttrList } from '@/api/flow'
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ step_one_id: '0', content: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+    stepActive.value = 0
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+const stepOneOptions = [{ label: '发送短信', value: '0' }]
+
+// 步骤
+let stepActive = ref(0)
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="10" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <el-form-item>
+          <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+            <el-radio style="width: 130px" :label="item.value" v-for="item in stepOneOptions">{{
+              item.label
+            }}</el-radio>
+          </el-radio-group>
+          <el-input v-if="stepActive === 1" v-model="form.content" :rows="3" type="textarea" placeholder="请输入" />
+        </el-form-item>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <el-form-item>
+            <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+              <el-radio style="width: 130px" :label="item.value" v-for="item in stepOneOptions">{{
+                item.label
+              }}</el-radio>
+            </el-radio-group>
+            <el-input v-if="stepActive === 1" v-model="form.content" :rows="3" type="textarea" placeholder="请输入" />
+          </el-form-item>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <!-- <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button> -->
+        <el-button @click="stepActive--" plain auto-insert-space v-if="stepActive !== 0">上一步</el-button>
+        <el-button @click="stepActive++" plain auto-insert-space v-if="stepActive < 1">下一步</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit" v-if="stepActive === 1">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction7.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getConnectionList } from '@/api/flow'
+import { useMapStore } from '@/stores/map'
+import { getMaterialList } from '@/api/base'
+
+const store = useMapStore()
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ step_one_id: '0', step_two_value: '', material_type: '1', material_value: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+    stepActive.value = 0
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+const stepOneOptions = [{ label: '发送邮件', value: '0' }]
+
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '9' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+  changeMaterialType()
+})
+
+// 步骤
+let stepActive = ref(0)
+
+// 选择资料类型
+let materiaList = ref([])
+const changeMaterialType = function () {
+  form.material_value = ''
+  getMaterialList({ type: form.material_type }).then(res => {
+    materiaList.value = res.data.list
+  })
+}
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="9" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <!-- 第一步 -->
+        <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+          <el-radio style="width: 105px" :label="item.value" v-for="item in stepOneOptions">{{ item.label }}</el-radio>
+        </el-radio-group>
+        <!-- 第二步 -->
+        <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
+          <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+        </el-select>
+        <!-- 第三步 -->
+        <div class="means-box" v-if="stepActive === 2">
+          <el-form-item label="请选择营销资料">
+            <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+              <el-radio
+                style="width: 105px"
+                :label="item.value"
+                v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="营销资料">
+            <el-select placeholder="请选择使用营销资料" v-model="form.material_value" style="width: 100%">
+              <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+            </el-select>
+          </el-form-item>
+        </div>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <!-- 第一步 -->
+          <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+            <el-radio style="width: 105px" :label="item.value" v-for="item in stepOneOptions">{{
+              item.label
+            }}</el-radio>
+          </el-radio-group>
+          <!-- 第二步 -->
+          <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+          </el-select>
+          <!-- 第三步 -->
+          <div class="means-box" v-if="stepActive === 2">
+            <el-form-item label="请选择使用营销资料类型">
+              <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+                <el-radio
+                  style="width: 105px"
+                  :label="item.value"
+                  v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                  >{{ item.label }}</el-radio
+                >
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item label="营销资料">
+              <el-select placeholder="请选择使用营销资料" v-model="form.material_value" style="width: 100%">
+                <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+              </el-select>
+            </el-form-item>
+          </div>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <!-- <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button> -->
+        <el-button @click="stepActive--" plain auto-insert-space v-if="stepActive !== 0">上一步</el-button>
+        <el-button @click="stepActive++" plain auto-insert-space v-if="stepActive < 2">下一步</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit" v-if="stepActive === 2">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction8.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getConnectionList } from '@/api/flow'
+import { useMapStore } from '@/stores/map'
+import { getMaterialList } from '@/api/base'
+
+const store = useMapStore()
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ step_one_id: '0', step_two_value: '', material_type: '1', material_value: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+    stepActive.value = 0
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+const stepOneOptions = [{ label: '发送邮件', value: '0' }]
+
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '1' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+  changeMaterialType()
+})
+
+// 步骤
+let stepActive = ref(0)
+
+// 选择资料类型
+let materiaList = ref([])
+const changeMaterialType = function () {
+  form.material_value = ''
+  getMaterialList({ type: form.material_type }).then(res => {
+    materiaList.value = res.data.list
+  })
+}
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="1" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <!-- 第一步 -->
+        <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+          <el-form-item>
+            <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+              <el-radio
+                style="width: 105px"
+                :label="item.value"
+                v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                >发送{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="营销资料">
+            <el-select placeholder="请选择资料内容" v-model="form.material_value" style="width: 100%">
+              <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-radio-group>
+        <!-- 第二步 -->
+        <el-select placeholder="请选择公众号" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
+          <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+        </el-select>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <!-- 第一步 -->
+          <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+            <el-form-item>
+              <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+                <el-radio
+                  style="width: 105px"
+                  :label="item.value"
+                  v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                  >发送{{ item.label }}</el-radio
+                >
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item label="营销资料">
+              <el-select placeholder="请选择资料内容" v-model="form.material_value" style="width: 100%">
+                <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-radio-group>
+          <!-- 第二步 -->
+          <el-select
+            placeholder="请选择公众号"
+            style="width: 100%"
+            v-model="form.step_two_value"
+            v-if="stepActive === 1"
+          >
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+          </el-select>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <!-- <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button> -->
+        <el-button @click="stepActive--" plain auto-insert-space v-if="stepActive !== 0">上一步</el-button>
+        <el-button @click="stepActive++" plain auto-insert-space v-if="stepActive < 1">下一步</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit" v-if="stepActive === 1">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/marketingAction/marketingAction9.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getConnectionList } from '@/api/flow'
+import { useMapStore } from '@/stores/map'
+import { getMaterialList } from '@/api/base'
+
+const store = useMapStore()
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ step_one_id: '0', step_two_value: '', material_type: '1', material_value: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+    stepActive.value = 0
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+const stepOneOptions = [
+  { label: '向用户发送文本私信', value: '0' },
+  { label: '向用户发送图片私信', value: '1' },
+  { label: '向用户发送视频私信', value: '2' }
+]
+
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '6' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+  changeMaterialType()
+})
+
+// 步骤
+let stepActive = ref(0)
+
+// 选择资料类型
+let materiaList = ref([])
+const changeMaterialType = function () {
+  form.material_value = ''
+  getMaterialList({ type: form.material_type }).then(res => {
+    materiaList.value = res.data.list
+  })
+}
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="square" color="#19AAA5" w="60" h="60"></Icon>
+      <Icon class="icon" name="6" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <!-- 第一步 -->
+        <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+          <el-radio :label="item.value" v-for="item in stepOneOptions">{{ item.label }}</el-radio>
+        </el-radio-group>
+        <!-- 第二步 -->
+        <el-select
+          placeholder="请选择关联使用抖音"
+          style="width: 100%"
+          v-model="form.step_two_value"
+          v-if="stepActive === 1"
+        >
+          <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+        </el-select>
+        <!-- 第三步 -->
+        <div class="means-box" v-if="stepActive === 2">
+          <el-form-item label="请选择营销资料">
+            <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+              <el-radio
+                style="width: 105px"
+                :label="item.value"
+                v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="营销资料">
+            <el-select placeholder="请选择使用营销资料" v-model="form.material_value" style="width: 100%">
+              <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+            </el-select>
+          </el-form-item>
+        </div>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <!-- 第一步 -->
+          <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+            <el-radio :label="item.value" v-for="item in stepOneOptions">{{ item.label }}</el-radio>
+          </el-radio-group>
+          <!-- 第二步 -->
+          <el-select
+            placeholder="请选择关联使用抖音"
+            style="width: 100%"
+            v-model="form.step_two_value"
+            v-if="stepActive === 1"
+          >
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+          </el-select>
+          <!-- 第三步 -->
+          <div class="means-box" v-if="stepActive === 2">
+            <el-form-item label="请选择营销资料">
+              <el-radio-group @change="changeMaterialType" v-model="form.material_type">
+                <el-radio
+                  style="width: 105px"
+                  :label="item.value"
+                  v-for="item in store.getMapValuesByKey('experiment_marketing_material_type')"
+                  >{{ item.label }}</el-radio
+                >
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item label="营销资料">
+              <el-select placeholder="请选择使用营销资料" v-model="form.material_value" style="width: 100%">
+                <el-option :value="item.id" :label="item.name" v-for="item in materiaList"></el-option>
+              </el-select>
+            </el-form-item>
+          </div>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <!-- <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button> -->
+        <el-button @click="stepActive--" plain auto-insert-space v-if="stepActive !== 0">上一步</el-button>
+        <el-button @click="stepActive++" plain auto-insert-space v-if="stepActive < 2">下一步</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit" v-if="stepActive === 2">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/triggeringConditions/TriggeringConditions10.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getConnectionList } from '@/api/flow'
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ step_one_id: '0', step_two_value: '', step_three_value: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+    stepActive.value = 0
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+const stepOneOptions = [{ label: '提交表单', value: '0' }]
+
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '4' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+})
+
+// 步骤
+let stepActive = ref(0)
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="circle" color="#4C5AB3" w="60" h="60"></Icon>
+      <Icon class="icon" name="4" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <el-form-item>
+          <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+            <el-radio style="width: 100px" :label="item.value" v-for="item in stepOneOptions">{{
+              item.label
+            }}</el-radio>
+          </el-radio-group>
+          <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+          </el-select>
+        </el-form-item>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <el-form-item>
+            <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+              <el-radio style="width: 100px" :label="item.value" v-for="item in stepOneOptions">{{
+                item.label
+              }}</el-radio>
+            </el-radio-group>
+            <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
+              <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <!-- <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button> -->
+        <el-button @click="stepActive--" plain auto-insert-space v-if="stepActive !== 0">上一步</el-button>
+        <el-button @click="stepActive++" plain auto-insert-space v-if="stepActive < 1">下一步</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit" v-if="stepActive === 1">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/flow/components/triggeringConditions/TriggeringConditions2.vue

@@ -103,7 +103,9 @@ onMounted(() => {
         </el-row>
         <el-card header="标准答案" shadow="never">
           <el-form-item>
+            <el-select style="width: 100%" v-model="form.group_id" placeholder="请选择需要监控的群组">
               <el-option :key="item.id" v-for="item in groupsOption" :value="item.id" :label="item.name"></el-option>
+            </el-select>
             <span style="font-size: 12px; text-align: right; color: #ccc"
               >您选择的群组中，新加入的用户将会触发该旅程</span
             >

src/components/flow/components/triggeringConditions/TriggeringConditions4.vue

@@ -3,6 +3,7 @@
 import { useVueFlow } from '@vue-flow/core'
 import NodeTemplate from '../NodeTemplate.vue'
 import Icon from '@/components/ConnectionIcon.vue'
+import { getConnectionList } from '@/api/flow'
 
 const props = defineProps({ node: Object })
 
@@ -55,15 +56,13 @@ const stepOneOptions = [
   { label: '其他', value: '9' }
 ]
 
-const stepTwoOptions = [
-  { label: '关注公众号', value: '0' },
-  { label: '留言图片', value: '1' },
-  { label: '留言语音', value: '2' },
-  { label: '留言视频', value: '3' },
-  { label: '扫描二维码', value: '4' },
-  { label: '取消关注', value: '5' },
-  { label: '其他', value: '6' }
-]
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '1' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+})
 
 // 步骤
 let stepActive = ref(0)
@@ -93,7 +92,7 @@ let stepActive = ref(0)
             }}</el-radio>
           </el-radio-group>
           <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
-            <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
           </el-select>
           <el-input v-model="form.step_three_value" v-if="stepActive === 2" placeholder="请输入"></el-input>
         </el-form-item>
@@ -126,7 +125,7 @@ let stepActive = ref(0)
               }}</el-radio>
             </el-radio-group>
             <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
-              <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+              <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
             </el-select>
             <el-input v-model="form.step_three_value" v-if="stepActive === 2" placeholder="请输入"></el-input>
           </el-form-item>

src/components/flow/components/triggeringConditions/TriggeringConditions5.vue

@@ -3,7 +3,7 @@
 import { useVueFlow } from '@vue-flow/core'
 import NodeTemplate from '../NodeTemplate.vue'
 import Icon from '@/components/ConnectionIcon.vue'
-import { getAttrList } from '@/api/flow'
+import { getConnectionList } from '@/api/flow'
 
 const props = defineProps({ node: Object })
 
@@ -50,11 +50,13 @@ const stepOneOptions = [
   { label: '在主页Tab提交预约', value: '3' }
 ]
 
-const stepTwoOptions = [
-  { label: '向用户发送文本私信', value: '0' },
-  { label: '向用户发送图片私信', value: '1' },
-  { label: '向用户发送视频私信', value: '2' }
-]
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '6' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+})
 
 // 步骤
 let stepActive = ref(0)
@@ -84,7 +86,7 @@ let stepActive = ref(0)
             }}</el-radio>
           </el-radio-group>
           <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
-            <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
           </el-select>
         </el-form-item>
       </template>
@@ -116,7 +118,7 @@ let stepActive = ref(0)
               }}</el-radio>
             </el-radio-group>
             <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
-              <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+              <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
             </el-select>
           </el-form-item>
         </el-card>

src/components/flow/components/triggeringConditions/TriggeringConditions6.vue

@@ -3,7 +3,7 @@
 import { useVueFlow } from '@vue-flow/core'
 import NodeTemplate from '../NodeTemplate.vue'
 import Icon from '@/components/ConnectionIcon.vue'
-import { getAttrList } from '@/api/flow'
+import { getConnectionList } from '@/api/flow'
 
 const props = defineProps({ node: Object })
 
@@ -52,7 +52,13 @@ const stepOneOptions = [
   { label: '笔记被转发', value: '5' }
 ]
 
-const stepTwoOptions = []
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '8' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+})
 
 // 步骤
 let stepActive = ref(0)
@@ -82,7 +88,7 @@ let stepActive = ref(0)
             }}</el-radio>
           </el-radio-group>
           <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
-            <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
           </el-select>
         </el-form-item>
       </template>
@@ -114,7 +120,7 @@ let stepActive = ref(0)
               }}</el-radio>
             </el-radio-group>
             <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
-              <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+              <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
             </el-select>
           </el-form-item>
         </el-card>

src/components/flow/components/triggeringConditions/TriggeringConditions7.vue

@@ -3,7 +3,7 @@
 import { useVueFlow } from '@vue-flow/core'
 import NodeTemplate from '../NodeTemplate.vue'
 import Icon from '@/components/ConnectionIcon.vue'
-import { getAttrList } from '@/api/flow'
+import { getConnectionList } from '@/api/flow'
 
 const props = defineProps({ node: Object })
 
@@ -48,10 +48,13 @@ const stepOneOptions = [
   { label: '发送私信', value: '1' }
 ]
 
-const stepTwoOptions = [
-  { label: '发送私信', value: '0' },
-  { label: '发送图片', value: '1' }
-]
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '7' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+})
 
 // 步骤
 let stepActive = ref(0)
@@ -81,7 +84,7 @@ let stepActive = ref(0)
             }}</el-radio>
           </el-radio-group>
           <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
-            <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
           </el-select>
         </el-form-item>
       </template>
@@ -113,7 +116,7 @@ let stepActive = ref(0)
               }}</el-radio>
             </el-radio-group>
             <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
-              <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+              <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
             </el-select>
           </el-form-item>
         </el-card>

src/components/flow/components/triggeringConditions/TriggeringConditions8.vue

@@ -3,6 +3,7 @@
 import { useVueFlow } from '@vue-flow/core'
 import NodeTemplate from '../NodeTemplate.vue'
 import Icon from '@/components/ConnectionIcon.vue'
+import { getConnectionList } from '@/api/flow'
 
 const props = defineProps({ node: Object })
 
@@ -53,20 +54,12 @@ const stepOneOptions = [
   { label: '离开网页', value: '7' }
 ]
 
-const stepTwoOptions = computed(() => {
-  return form.step_one_id === '0'
-    ? [
-        { label: '访问网页', value: '0' },
-        { label: '离开网页', value: '1' }
-      ]
-    : [
-        { label: '激活APP', value: '0' },
-        { label: '启动APP', value: '1' },
-        { label: '退出APP', value: '2' },
-        { label: '点击APP元素', value: '3' },
-        { label: '展示APP页面', value: '4' },
-        { label: '退出APP页面', value: '5' }
-      ]
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '1' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
 })
 
 // 步骤
@@ -102,12 +95,12 @@ let stepActive = ref(0)
             v-model="form.step_two_value"
             v-if="stepActive === 1"
           >
-            <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
           </el-select>
           <el-input
             v-model="form.step_three_value"
             v-if="stepActive === 2"
-            :placeholder="form.step_one_id === '0' ? '请输入网页地址' : '请输入APP名称'"
+            :placeholder="form.step_one_id === '0' || form.step_one_id === '7' ? '请输入网页地址' : '请输入APP名称'"
           ></el-input>
         </el-form-item>
       </template>
@@ -144,12 +137,12 @@ let stepActive = ref(0)
               v-model="form.step_two_value"
               v-if="stepActive === 1"
             >
-              <el-option v-for="item in stepTwoOptions" :value="item.value" :label="item.label"></el-option>
+              <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
             </el-select>
             <el-input
               v-model="form.step_three_value"
               v-if="stepActive === 2"
-              :placeholder="form.step_one_id === '0' ? '请输入网页地址' : '请输入APP名称'"
+              :placeholder="form.step_one_id === '0' || form.step_one_id === '7' ? '请输入网页地址' : '请输入APP名称'"
             ></el-input>
           </el-form-item>
         </el-card>

src/components/flow/components/triggeringConditions/TriggeringConditions9.vue

+<!-- 定时触发 -->
+<script setup>
+import { useVueFlow } from '@vue-flow/core'
+import NodeTemplate from '../NodeTemplate.vue'
+import Icon from '@/components/ConnectionIcon.vue'
+import { getConnectionList } from '@/api/flow'
+
+const props = defineProps({ node: Object })
+
+const action = inject('action')
+const role = inject('role')
+
+const { findNode } = useVueFlow()
+// 设置
+const settingVisible = ref(false)
+
+const formRef = ref()
+const form = reactive({ step_one_id: '0', step_two_value: '', step_three_value: '' })
+
+watch(settingVisible, () => {
+  if (props.node) Object.assign(form, props.node.data)
+})
+
+const rules = ref({
+  score: [{ required: true, message: '请输入' }]
+})
+
+// 保存
+function handleSubmit() {
+  formRef.value.validate().then(() => {
+    updateNode()
+    settingVisible.value = false
+    stepActive.value = 0
+  })
+}
+
+function updateNode() {
+  const node = findNode(props.node.id)
+  if (node) Object.assign(node.data, form)
+}
+
+function handleClosed() {
+  formRef.value.resetFields()
+}
+
+const stepOneOptions = [{ label: '新注册用户', value: '0' }]
+
+const stepTwoOptions = ref()
+onMounted(() => {
+  // 链接列表
+  getConnectionList({ type: '3' }).then(res => {
+    stepTwoOptions.value = res.data.list
+  })
+})
+
+// 步骤
+let stepActive = ref(0)
+</script>
+
+<template>
+  <NodeTemplate :node="node" @setting="settingVisible = true">
+    <div class="node-item">
+      <Icon name="circle" color="#4C5AB3" w="60" h="60"></Icon>
+      <Icon class="icon" name="3" color="#fff" w="24" h="24"></Icon>
+    </div>
+  </NodeTemplate>
+
+  <el-dialog title="设置组件" append-to-body width="600px" v-model="settingVisible" @close="handleClosed">
+    <el-form ref="formRef" :model="form" :rules="rules" label-suffix="：">
+      <!-- 学生设置组件 -->
+      <template v-if="role === 'student'">
+        <el-row justify="space-between">
+          <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          <el-form-item label="分值">{{ form.score }} </el-form-item>
+        </el-row>
+        <el-form-item>
+          <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+            <el-radio style="width: 100px" :label="item.value" v-for="item in stepOneOptions">{{
+              item.label
+            }}</el-radio>
+          </el-radio-group>
+          <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
+            <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+          </el-select>
+        </el-form-item>
+      </template>
+      <!-- 老师设置组件 -->
+      <template v-if="role === 'teacher'">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件类型">{{ form.type }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="组件名称">{{ form.name }}</el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="组件分值" prop="score">
+              <el-input v-model="form.score" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="已设置组件分值">110</el-form-item>
+          </el-col>
+        </el-row>
+        <el-card header="标准答案" shadow="never">
+          <el-form-item>
+            <el-radio-group v-model="form.step_one_id" v-if="stepActive === 0">
+              <el-radio style="width: 100px" :label="item.value" v-for="item in stepOneOptions">{{
+                item.label
+              }}</el-radio>
+            </el-radio-group>
+            <el-select placeholder="请选择" style="width: 100%" v-model="form.step_two_value" v-if="stepActive === 1">
+              <el-option v-for="item in stepTwoOptions" :value="item.id" :label="item.type_name"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-card>
+        <el-card header="答案解析" shadow="never" style="margin-top: 20px">
+          <el-form-item prop="answer_analysis">
+            <el-input v-model="form.answer_analysis" :rows="3" type="textarea" placeholder="请输入答案解析"></el-input>
+          </el-form-item>
+        </el-card>
+      </template>
+    </el-form>
+    <template #footer>
+      <el-row justify="center">
+        <!-- <el-button plain auto-insert-space @click="settingVisible = false">关闭</el-button> -->
+        <el-button @click="stepActive--" plain auto-insert-space v-if="stepActive !== 0">上一步</el-button>
+        <el-button @click="stepActive++" plain auto-insert-space v-if="stepActive < 1">下一步</el-button>
+        <el-button type="primary" auto-insert-space @click="handleSubmit" v-if="stepActive === 1">保存</el-button>
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+<style scoped lang="scss">
+.node-item {
+  position: relative;
+  .icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/modules/connect/components/FormDialog.vue

@@ -18,7 +18,7 @@ const params = $ref({ type: '', config_attributes: '' })
 // 提交
 function handleSubmit() {
   if (props.data?.id) {
-    const updateParams = { id: props.data?.id, config_attributes: JSON.stringify(stepTwo.value.formItem) }
+    const updateParams = { id: props.data?.id, config_attributes: stepTwo.value.formItem }
     updateConnection(updateParams).then(res => {
       emit('update')
       emit('update:modelValue', false)
@@ -67,7 +67,7 @@ const handleStepTwoNext = function () {
   const isData = data.find((item: { label: string; value: string; prop: string }) => item.value === '')
   if (!isData) {
     activeName++
-    params.config_attributes = JSON.stringify(data)
+    params.config_attributes = data
   } else {
     ElMessage('请填写完整')
   }