feat: 优化编辑页模块和配置结构

web/src/common/Editor/utils.js

@@ -8,7 +8,6 @@ export const replacePxWithRem = (html) => {
   const imgRegex = /<img[^>]*style=["'][^"']*\b(?:width|height):\s*\d+(\.\d+)?px[^"']*["'][^>]*>/gi
   const styleRegex = /style="([^"]*)"/g
   if (!imgRegex.test(html)) {
-    console.log('无需修改')
     return html
   }
 

web/src/management/config/setterConfig/bannerConfig.js

@@ -1,35 +0,0 @@
-export default [
-  {
-    label: '顶部图片地址',
-    type: 'InputSetter',
-    key: 'bgImage',
-    labelStyle: { width: '120px' }
-  },
-  {
-    label: '顶部视频地址',
-    type: 'InputSetter',
-    key: 'videoLink',
-    labelStyle: { width: '120px' }
-  },
-  {
-    label: '视频海报地址',
-    type: 'InputSetter',
-    key: 'postImg',
-    labelStyle: { width: '120px' }
-  },
-  {
-    label: '图片支持点击',
-    type: 'CustomedSwitch',
-    labelStyle: { width: '120px' },
-    key: 'bgImageAllowJump'
-  },
-  {
-    label: '跳转链接',
-    type: 'InputSetter',
-    labelStyle: { width: '120px' },
-    key: 'bgImageJumpLink',
-    relyFunc: (data) => {
-      return !!data?.bgImageAllowJump
-    }
-  }
-]

web/src/management/config/setterConfig/logoConfig.js

@@ -1,16 +0,0 @@
-export default [
-  {
-    label: '自定义Logo',
-    type: 'InputSetter',
-    key: 'logoImage',
-    tip: '默认尺寸200px*50px',
-    labelStyle: { width: '120px' }
-  },
-  {
-    label: 'Logo大小',
-    type: 'InputPercent',
-    key: 'logoImageWidth',
-    tip: '填写宽度百分比，例如30%',
-    labelStyle: { width: '120px' }
-  }
-]

web/src/management/config/setterConfig/skinConfig.js

@@ -1,48 +0,0 @@
-import bannerConfig from './bannerConfig'
-import logoConfig from './logoConfig'
-
-export default [
-  {
-    name: '头图',
-    key: 'bannerConf.bannerConfig',
-    formConfigList: bannerConfig
-  },
-  {
-    name: '背景',
-    key: 'skinConf.backgroundConf',
-    formConfigList: [
-      {
-        label: '背景颜色',
-        type: 'ColorPicker',
-        key: 'color'
-      }
-    ]
-  },
-  {
-    name: '主题色',
-    key: 'skinConf.themeConf',
-    formConfigList: [
-      {
-        label: '全局应用',
-        type: 'ColorPicker',
-        key: 'color'
-      }
-    ]
-  },
-  {
-    key: 'skinConf.contentConf',
-    name: '内容区域',
-    formConfigList: [
-      {
-        label: '内容透明度',
-        type: 'SliderSetter',
-        key: 'opacity'
-      }
-    ]
-  },
-  {
-    name: '品牌logo',
-    key: 'bottomConf',
-    formConfigList: logoConfig
-  }
-]

web/src/management/config/setterConfig/submitConfig.js

@@ -1,62 +0,0 @@
-export default [
-  {
-    title: '提交按钮文案',
-    type: 'InputSetter',
-    key: 'submitTitle',
-    placeholder: '提交',
-    value: ''
-  },
-  {
-    title: '提交确认弹窗',
-    type: 'Customed',
-    key: 'confirmAgain',
-    content: [
-      {
-        label: '是否配置该项',
-        labelStyle: { width: '120px' },
-        type: 'CustomedSwitch',
-        key: 'confirmAgain.is_again',
-        value: true
-      },
-      {
-        label: '二次确认文案',
-        labelStyle: { width: '120px' },
-        type: 'InputSetter',
-        key: 'confirmAgain.again_text',
-        placeholder: '确认要提交吗？',
-        value: '确认要提交吗？'
-      }
-    ]
-  },
-  {
-    title: '提交文案配置',
-    type: 'Customed',
-    key: 'msgContent',
-    content: [
-      {
-        label: '已提交',
-        labelStyle: { width: '120px' },
-        type: 'InputSetter',
-        key: 'msgContent.msg_9002',
-        placeholder: '请勿多次提交！',
-        value: '请勿多次提交！'
-      },
-      {
-        label: '提交结束',
-        labelStyle: { width: '120px' },
-        type: 'InputSetter',
-        key: 'msgContent.msg_9003',
-        placeholder: '您来晚了，已经满额！',
-        value: '您来晚了，已经满额！'
-      },
-      {
-        label: '其他提交失败',
-        labelStyle: { width: '120px' },
-        type: 'InputSetter',
-        key: 'msgContent.msg_9004',
-        placeholder: '提交失败！',
-        value: '提交失败！'
-      }
-    ]
-  }
-]

web/src/management/pages/edit/components/ModuleNavbar.vue

@@ -18,8 +18,11 @@
       </CooperationPanel>
       <PreviewPanel></PreviewPanel>
       <HistoryPanel></HistoryPanel>
-      <SavePanel></SavePanel>
-      <PublishPanel></PublishPanel>
+      <SavePanel :updateLogicConf="updateLogicConf" :updateWhiteConf="updateWhiteConf"></SavePanel>
+      <PublishPanel
+        :updateLogicConf="updateLogicConf"
+        :updateWhiteConf="updateWhiteConf"
+      ></PublishPanel>
     </div>
   </div>
 </template>
@@ -28,6 +31,8 @@ import { computed } from 'vue'
 import { useStore } from 'vuex'
 import { get as _get } from 'lodash-es'
 
+import { showLogicEngine } from '@/management/hooks/useShowLogicEngine'
+
 import BackPanel from '../modules/generalModule/BackPanel.vue'
 import TitlePanel from '../modules/generalModule/TitlePanel.vue'
 import NavPanel from '../modules/generalModule/NavPanel.vue'
@@ -39,6 +44,59 @@ import CooperationPanel from '../modules/contentModule/CooperationPanel.vue'
 
 const store = useStore()
 const title = computed(() => _get(store.state, 'edit.schema.metaData.title'))
+// 校验 - 逻辑
+const updateLogicConf = () => {
+  let res = {
+    validated: true,
+    message: ''
+  }
+  if (
+    showLogicEngine.value &&
+    showLogicEngine.value.rules &&
+    showLogicEngine.value.rules.length !== 0
+  ) {
+    try {
+      showLogicEngine.value.validateSchema()
+    } catch (error) {
+      res = {
+        validated: false,
+        message: '逻辑配置不能为空'
+      }
+
+      return res
+    }
+
+    const showLogicConf = showLogicEngine.value.toJson()
+    // 更新逻辑配置
+    store.dispatch('edit/changeSchema', { key: 'logicConf', value: { showLogicConf } })
+
+    return res
+  }
+}
+
+// 校验 - 白名单
+const updateWhiteConf = () => {
+  let res = {
+    validated: true,
+    message: ''
+  }
+  const baseConf = store.state.edit.schema.baseConf || {}
+  if (baseConf.passwordSwitch && !baseConf.password) {
+    res = {
+      validated: false,
+      message: '访问密码不能为空'
+    }
+    return res
+  }
+  if (baseConf.whitelistType != 'ALL' && !baseConf.whitelist?.length) {
+    res = {
+      validated: false,
+      message: '白名单不能为空'
+    }
+    return res
+  }
+  return res
+}
 </script>
 <style lang="scss" scoped>
 @import url('@/management/styles/edit-btn.scss');

web/src/management/pages/edit/modules/contentModule/PublishPanel.vue

@@ -11,35 +11,37 @@ import { ElMessage } from 'element-plus'
 import 'element-plus/theme-chalk/src/message.scss'
 
 import { publishSurvey, saveSurvey } from '@/management/api/survey'
-import { showLogicEngine } from '@/management/hooks/useShowLogicEngine'
 import buildData from './buildData'
 
+interface Props {
+  updateLogicConf: any
+  updateWhiteConf: any
+}
+
+const props = defineProps<Props>()
+
 const isPublishing = ref<boolean>(false)
 const store = useStore()
 const router = useRouter()
 
-const updateLogicConf = () => {
-  if (
-    showLogicEngine.value &&
-    showLogicEngine.value.rules &&
-    showLogicEngine.value.rules.length !== 0
-  ) {
-    showLogicEngine.value.validateSchema()
-    const showLogicConf = showLogicEngine.value.toJson()
-    // 更新逻辑配置
-    store.dispatch('edit/changeSchema', { key: 'logicConf', value: { showLogicConf } })
+const validate = () => {
+  let checked = true
+  let msg = ''
+  const { validated, message } = props.updateLogicConf()
+  if (!validated) {
+    checked = validated
+    msg = `检查页面"问卷编辑>显示逻辑"：${message}`
+  }
+  const { validated: whiteValidated, message: whiteMsg } = props.updateWhiteConf()
+  if (!whiteValidated) {
+    checked = whiteValidated
+    msg = `检查页面"问卷设置>作答限制"：${whiteMsg}`
   }
-}
 
-const updateWhiteConf = () => {
-  const baseConf = store.state.edit.schema.baseConf || {};
-  if (baseConf.passwordSwitch && !baseConf.password) {
-    return true;
+  return {
+    checked,
+    msg
   }
-  if (baseConf.whitelistType!='ALL' && !baseConf.whitelist?.length) {
-    return true;
-  }
-  return false
 }
 
 const handlePublish = async () => {
@@ -49,11 +51,11 @@ const handlePublish = async () => {
 
   isPublishing.value = true
 
-  try {
-    updateLogicConf()
-  } catch (err) {
+  // 发布检测
+  const { checked, msg } = validate()
+  if (!checked) {
     isPublishing.value = false
-    ElMessage.error('请检查逻辑配置是否有误')
+    ElMessage.error(msg)
     return
   }
 

web/src/management/pages/edit/modules/contentModule/SavePanel.vue

@@ -16,14 +16,23 @@
 <script setup lang="ts">
 import { ref, computed, nextTick, watch } from 'vue'
 import { useStore } from 'vuex'
+import { useRoute } from 'vue-router'
+
 import { get as _get } from 'lodash-es'
 import { ElMessage } from 'element-plus'
 import 'element-plus/theme-chalk/src/message.scss'
 
 import { saveSurvey } from '@/management/api/survey'
-import { showLogicEngine } from '@/management/hooks/useShowLogicEngine'
 import buildData from './buildData'
 
+interface Props {
+  updateLogicConf: any
+  updateWhiteConf: any
+}
+
+const route = useRoute()
+const props = defineProps<Props>()
+
 const isSaving = ref<boolean>(false)
 const isShowAutoSave = ref<boolean>(false)
 const autoSaveStatus = ref<'succeed' | 'saving' | 'failed'>('succeed')
@@ -38,6 +47,27 @@ const saveText = computed(
 
 const store = useStore()
 
+const validate = () => {
+  let checked = true
+  let msg = ''
+  if (route.path.includes('edit/logic')) {
+    const { validated, message } = props.updateLogicConf()
+    checked = validated
+    msg = message
+  }
+
+  if (route.path.includes('edit/setting')) {
+    const { validated, message } = props.updateWhiteConf()
+    checked = validated
+    msg = message
+  }
+
+  return {
+    checked,
+    msg
+  }
+}
+
 const saveData = async () => {
   const saveData = buildData(store.state.edit.schema)
 
@@ -50,30 +80,6 @@ const saveData = async () => {
   return res
 }
 
-const updateLogicConf = () => {
-  if (
-    showLogicEngine.value &&
-    showLogicEngine.value.rules &&
-    showLogicEngine.value.rules.length !== 0
-  ) {
-    showLogicEngine.value.validateSchema()
-    const showLogicConf = showLogicEngine.value.toJson()
-    // 更新逻辑配置
-    store.dispatch('edit/changeSchema', { key: 'logicConf', value: { showLogicConf } })
-  }
-}
-
-const updateWhiteConf = () => {
-  const baseConf = store.state.edit.schema.baseConf || {};
-  if (baseConf.passwordSwitch && !baseConf.password) {
-    return true;
-  }
-  if (baseConf.whitelistType!='ALL' && !baseConf.whitelist?.length) {
-    return true;
-  }
-  return false
-}
-
 const timerHandle = ref<NodeJS.Timeout | number | null>(null)
 const triggerAutoSave = () => {
   if (autoSaveStatus.value === 'saving') {
@@ -117,17 +123,12 @@ const handleSave = async () => {
   isSaving.value = true
   isShowAutoSave.value = false
 
-  try {
-    updateLogicConf()
-  } catch (error) {
-    isSaving.value = false
-    ElMessage.error('请检查逻辑配置是否有误')
-    return
-  }
-
-  if(updateWhiteConf()){
+  // 保存检测
+  const { checked, msg } = validate()
+  if (!checked) {
     isSaving.value = false
     ElMessage.error('请检查问卷设置是否有误')
+    ElMessage.error(msg)
     return
   }
 

web/src/management/pages/edit/modules/settingModule/SettingPanel.vue

@@ -39,16 +39,31 @@
 <script setup lang="ts">
 import { computed, ref, onMounted, shallowRef } from 'vue'
 import { useStore } from 'vuex'
-import { cloneDeep as _cloneDeep, isArray as _isArray, get as _get,isFunction as _isFunction} from 'lodash-es'
+import {
+  cloneDeep as _cloneDeep,
+  isArray as _isArray,
+  get as _get,
+  isFunction as _isFunction
+} from 'lodash-es'
 
-import baseConfig from './config/baseConfig'
-import baseFormConfig from './config/baseFormConfig'
+import baseConfig from '@/management/pages/edit/setterConfig/baseConfig'
+import baseFormConfig from '@/management/pages/edit/setterConfig/baseFormConfig'
 import FormItem from '@/materials/setters/widgets/FormItem.vue'
 import setterLoader from '@/materials/setters/setterLoader'
 
+import WhiteList from './components/WhiteList.vue'
+import TeamMemberList from './components/TeamMemberList.vue'
+
 const formConfigList = ref<Array<any>>([])
-const components = shallowRef<any>({})
-const registerTypes = ref<any>({})
+const components = shallowRef<any>({
+  ['WhiteList']: WhiteList,
+  ['TeamMemberList']: TeamMemberList
+})
+// 登记默认注册的高级设置器组件
+const registerTypes = ref<any>({
+  WhiteList: 'WhiteList',
+  TeamMemberList: 'TeamMemberList'
+})
 const store = useStore()
 const schemaBaseConf = computed(() => store.state.edit?.schema?.baseConf || {})
 
@@ -75,7 +90,7 @@ const setterList = computed(() => {
       formItem.value = formValue
     }
     // 动态显隐设置器
-    form.formList = form.formList.filter((item:any) => {
+    form.formList = form.formList.filter((item: any) => {
       if (_isFunction(item.relyFunc)) {
         return item.relyFunc(schemaBaseConf.value)
       }
@@ -103,7 +118,9 @@ onMounted(async () => {
   }))
 
   const formList = formConfigList.value.map((item) => item.formList).flat()
-  const typeList = formList.map((item) => ({
+  const typeList = formList
+    .filter((item) => !item.custom)
+    .map((item) => ({
       type: item.type,
       path: item.path || item.type
     }))

web/src/management/pages/edit/modules/settingModule/components/OverTime.vue

@@ -1,34 +0,0 @@
-<template>
-  <div class="over-time">
-    <img class="over-img" src="/imgs/icons/overtime.webp" />
-    <p class="title-msg" v-safe-html="resultText"></p>
-  </div>
-</template>
-<script setup lang="ts">
-import { computed } from 'vue'
-
-interface Props {
-  moduleConfig: any
-}
-const props = defineProps<Props>()
-const resultText = computed(() => props.moduleConfig?.msgContent?.msg_9001 || '问卷已过期')
-</script>
-<style lang="scss" scoped>
-.over-time {
-  text-align: center;
-  margin-bottom: 5.5rem;
-  height: 100%;
-
-  .title-msg {
-    width: 100%;
-    font-size: 16px;
-    color: #666;
-  }
-}
-
-.over-time .over-img {
-  margin-top: 1.6rem;
-  margin-bottom: 15px;
-  width: 100px;
-}
-</style>

web/src/management/pages/edit/modules/settingModule/components/SuccessContent.vue

@@ -1,56 +0,0 @@
-<template>
-  <div class="suc-page">
-    <div class="suc-content">
-      <div class="title-box">
-        <img src="/imgs/icons/success.webp" class="success-img" />
-        <div class="title-msg" v-safe-html="successText"></div>
-      </div>
-      <div class="bottom-btn"></div>
-    </div>
-  </div>
-</template>
-<script setup lang="ts">
-import { computed } from 'vue'
-
-interface Props {
-  moduleConfig: any
-}
-const props = defineProps<Props>()
-const successText = computed(() => props.moduleConfig?.msgContent?.msg_200 || '')
-</script>
-<style lang="scss" scoped>
-/*成功页面跳转全屏展示浮层*/
-.suc-page {
-  padding: 0;
-  text-align: center;
-  width: 100%;
-  display: inline-block;
-  height: 100%;
-  .success-img {
-    margin-top: -0.2rem;
-    width: 100px;
-  }
-}
-
-.suc-content {
-  max-width: 920px;
-  margin: 0 auto;
-  height: 100%;
-  width: 100%;
-  position: relative;
-  padding-top: 1.8rem;
-}
-
-.title-msg {
-  margin-top: 0.4rem;
-  margin-bottom: 0.4rem;
-  font-size: 0.36rem;
-  color: #666;
-  :deep(*) {
-    font-size: 0.36rem;
-  }
-}
-.bottom-btn {
-  height: 300px;
-}
-</style>

web/src/management/pages/edit/modules/settingModule/config/statusConfig.js

@@ -1,26 +0,0 @@
-export default {
-  Success: [
-    {
-      label: '提示文案',
-      type: 'RichText',
-      key: 'msgContent.msg_200',
-      placeholder: '提交成功',
-      value: '提交成功',
-      labelStyle: {
-        'font-weight': 'bold'
-      }
-    }
-  ],
-  OverTime: [
-    {
-      label: '提示文案',
-      type: 'RichText',
-      key: 'msgContent.msg_9001',
-      placeholder: '问卷已过期',
-      value: '问卷已过期',
-      labelStyle: {
-        'font-weight': 'bold'
-      }
-    }
-  ]
-}

web/src/management/pages/edit/modules/settingModule/result/CatalogPanel.vue

@@ -1,98 +0,0 @@
-<template>
-  <div class="tab-box">
-    <div class="title">结果页状态选择</div>
-    <div class="status-list-wrapper">
-      <div
-        v-for="(status, index) in statusList"
-        :key="index"
-        class="status-item"
-        @click="handleChangePreview({ type: status.type })"
-      >
-        <span>{{ status.title }}</span>
-        <div class="preview-item">
-          <img :src="status.previewImg" :alt="status.title" />
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-<script setup lang="ts">
-import { useStore } from 'vuex'
-import { EDIT_STATUS_MAP } from '../enum'
-
-const store = useStore()
-const statusList = [
-  {
-    type: EDIT_STATUS_MAP.SUCCESS,
-    title: '提交成功',
-    previewImg: '/imgs/icons/success.webp'
-  },
-  {
-    type: EDIT_STATUS_MAP.OVERTIME,
-    title: '问卷过期',
-    previewImg: '/imgs/icons/overtime.webp'
-  }
-]
-
-const handleChangePreview = (data: any) => {
-  const currentStatus = store.state?.edit?.currentEditStatus
-
-  if (currentStatus && currentStatus !== data.type) {
-    store.commit('edit/changeStatusPreview', data)
-  }
-}
-</script>
-<style lang="scss" scoped>
-.tab-box {
-  width: 300px;
-  height: 100%;
-  box-shadow: none;
-  border: none;
-  overflow-y: auto;
-  background-color: #fff;
-  .title {
-    height: 40px;
-    line-height: 40px;
-    font-size: 14px;
-    color: $primary-color;
-    padding-left: 20px;
-    // background: #f9fafc;
-    border-bottom: 1px solid #edeffc;
-  }
-}
-.status-list-wrapper {
-  padding: 19px 18px 100px 19px;
-  overflow-y: auto;
-  overflow-x: hidden;
-
-  label.title {
-    font-size: 16px;
-    color: #333;
-  }
-
-  .status-item {
-    position: relative;
-    margin-bottom: 24px;
-
-    span {
-      display: block;
-      margin-bottom: 17px;
-      color: $font-color-stress;
-      font-size: 16px;
-    }
-    .preview-item {
-      padding: 40px 80px;
-    }
-    img {
-      position: relative;
-      width: 100%;
-      cursor: pointer;
-      transition: all 0.2s;
-      &:hover {
-        -webkit-filter: brightness(90%);
-        filter: brightness(90%);
-      }
-    }
-  }
-}
-</style>

web/src/management/pages/edit/modules/settingModule/result/PreviewPanel.vue

@@ -1,62 +0,0 @@
-<template>
-  <div class="result-config-preview">
-    <div class="result-page-wrap">
-      <div class="result-page">
-        <component
-          :is="components[currentEditStatus]"
-          :key="currentEditStatus"
-          :module-config="moduleConfig"
-        />
-      </div>
-    </div>
-  </div>
-</template>
-<script setup lang="ts">
-import { computed } from 'vue'
-import { useStore } from 'vuex'
-import { get as _get } from 'lodash-es'
-
-import SuccessContent from '../components/SuccessContent.vue'
-import OverTime from '../components/OverTime.vue'
-import { EDIT_STATUS_MAP } from '../enum'
-
-const components = {
-  [EDIT_STATUS_MAP.SUCCESS]: SuccessContent,
-  [EDIT_STATUS_MAP.OVERTIME]: OverTime
-}
-
-const store = useStore()
-const currentEditStatus = computed(() => store.state?.edit?.currentEditStatus)
-const moduleConfig = computed(() => {
-  return _get(store.state, 'edit.schema.submitConf')
-})
-</script>
-<style lang="scss" scoped>
-.result-config-preview {
-  width: 100%;
-  height: 100%;
-  min-width: 500px;
-  padding-bottom: 80px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  background-color: #f6f7f9;
-}
-
-.result-page-wrap {
-  width: 90%;
-  margin-top: 50px;
-  min-height: 812px;
-  max-height: 812px;
-  overflow-x: hidden;
-  overflow-y: auto;
-  background-color: var(--primary-background-color);
-  padding: 0 0.3rem;
-  .result-page {
-    background: rgba(255, 255, 255, var(--opacity));
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-  }
-}
-</style>

web/src/management/pages/edit/modules/settingModule/result/SetterPanel.vue

@@ -1,120 +0,0 @@
-<template>
-  <div class="question-edit-form">
-    <div class="setter-title">
-      {{ currentEditText }}
-    </div>
-    <el-form class="question-config-form" label-position="top" @submit.prevent>
-      <template v-for="(item, index) in formFields" :key="index">
-        <FormItem
-          v-if="item.type && !item.hidden && Boolean(registerTypes[item.type])"
-          :form-config="item"
-          :style="item.style"
-        >
-          <Component
-            v-if="Boolean(registerTypes[item.type])"
-            :is="components[item.type]"
-            :module-config="moduleConfig"
-            :form-config="item"
-            @form-change="handleFormChange"
-          />
-        </FormItem>
-      </template>
-    </el-form>
-  </div>
-</template>
-<script setup lang="ts">
-import { computed, ref, shallowRef } from 'vue'
-import { useStore } from 'vuex'
-import { get as _get } from 'lodash-es'
-
-import FormItem from '@/materials/setters/widgets/FormItem.vue'
-import setterLoader from '@/materials/setters/setterLoader'
-import statusConfig from '../config/statusConfig'
-
-const textMap = {
-  Success: '提交成功页面配置',
-  OverTime: '问卷过期页面配置'
-}
-
-const store = useStore()
-
-const components = shallowRef<any>({})
-const registerTypes = ref<any>({})
-const moduleConfig = computed(() => _get(store.state, 'edit.schema.submitConf'))
-const currentEditText = computed(() => (textMap as any)[store.state.edit.currentEditStatus])
-const formFields = computed(() => {
-  const currentStatus = store.state.edit.currentEditStatus
-  const formList = (statusConfig as any)[currentStatus] || []
-  const list = formList.map((item: any) => {
-    const value = _get(moduleConfig.value, item.key, item.value)
-
-    return { ...item, value }
-  })
-
-  registerComponents(list)
-
-  return list
-})
-
-const handleFormChange = ({ key, value }: any) => {
-  store.dispatch('edit/changeSchema', {
-    key: `submitConf.${key}`,
-    value
-  })
-}
-
-const registerComponents = async (formFieldData: any) => {
-  const setters = formFieldData.map((item: any) => item.type)
-  const settersSet = new Set(setters)
-  const settersArr = Array.from(settersSet)
-  const allSetters = settersArr.map((item) => {
-    return {
-      type: item,
-      path: item
-    }
-  })
-
-  try {
-    const comps = await setterLoader.loadComponents(allSetters)
-
-    for (const comp of comps) {
-      if (!comp) {
-        continue
-      }
-
-      const { type, component, err } = comp
-
-      if (!err) {
-        const componentName = component.name
-
-        components.value[type] = component
-        registerTypes.value[type] = componentName
-      }
-    }
-  } catch (err) {
-    console.error(err)
-  }
-}
-</script>
-<style lang="scss" scoped>
-.question-edit-form {
-  width: 360px;
-  height: 100%;
-  overflow-y: auto;
-  background-color: #ffffff;
-}
-
-.setter-title {
-  height: 40px;
-  line-height: 40px;
-  font-size: 14px;
-  color: $primary-color;
-  padding-left: 20px;
-  // background: #f9fafc;
-  border-bottom: 1px solid #edeffc;
-}
-
-.question-config-form {
-  padding: 30px 20px 50px 20px;
-}
-</style>

web/src/management/pages/edit/modules/settingModule/skin/SetterPanel.vue

@@ -1,85 +0,0 @@
-<template>
-  <div class="setter-wrapper">
-    <div class="setter-title">样式设置</div>
-    <div class="setter-content">
-      <el-collapse v-model="collapse">
-        <el-collapse-item
-          v-for="(collapse, index) in skinConfig"
-          :key="index"
-          :title="collapse.name"
-          :name="collapse.key"
-        >
-          <SetterField
-            :form-config-list="collapse.formConfigList"
-            :module-config="_get(schema, collapse.key, {})"
-            @form-change="
-              (key) => {
-                handleFormChange(key, collapse.key)
-              }
-            "
-          />
-        </el-collapse-item>
-      </el-collapse>
-    </div>
-  </div>
-</template>
-<script setup lang="ts">
-import { computed, ref } from 'vue'
-import { useStore } from 'vuex'
-import { get as _get } from 'lodash-es'
-
-import skinConfig from '@/management/config/setterConfig/skinConfig'
-import SetterField from '@/management/pages/edit/components/SetterField.vue'
-
-const store = useStore()
-const collapse = ref<string>('')
-const schema = computed(() => _get(store.state, 'edit.schema'))
-
-const handleFormChange = (data: any, collapse: string) => {
-  const { key, value } = data
-  const currentEditKey = `${collapse}`
-  const resultKey = `${currentEditKey}.${key}`
-
-  store.dispatch('edit/changeSchema', { key: resultKey, value })
-}
-</script>
-<style lang="scss" scoped>
-.setter-wrapper {
-  width: 360px;
-  height: 100%;
-  overflow-x: hidden;
-  overflow-y: auto;
-  background-color: #fff;
-}
-
-.setter-title {
-  height: 40px;
-  line-height: 40px;
-  font-size: 14px;
-  color: $primary-color;
-  padding-left: 20px;
-  // background: #f9fafc;
-  border-bottom: 1px solid #edeffc;
-}
-.setter-content {
-  padding: 10px 20px;
-  .el-collapse {
-    border: none;
-    :deep(.el-collapse-item__header) {
-      font-size: 14px;
-      color: #606266;
-      font-weight: bold;
-      border: none;
-    }
-    :deep(.el-collapse-item__wrap) {
-      border: none;
-      .el-collapse-item__content {
-        padding-bottom: 0px !important;
-      }
-    }
-  }
-  .config-form {
-    padding: 0 !important;
-  }
-}
-</style>

web/src/management/pages/edit/pages/skin/ContentPage.vue

@@ -16,9 +16,9 @@ import { onMounted } from 'vue'
 import { useStore } from 'vuex'
 
 import CommonTemplate from '../../components/CommonTemplate.vue'
-import CatalogPanel from '../../modules/settingModule/skin/CatalogPanel.vue'
-import PreviewPanel from '../../modules/settingModule/skin/PreviewPanel.vue'
-import SetterPanel from '../../modules/settingModule/skin/SetterPanel.vue'
+import CatalogPanel from '../../modules/skinModule/CatalogPanel.vue'
+import PreviewPanel from '../../modules/skinModule/PreviewPanel.vue'
+import SetterPanel from '../../modules/skinModule/SetterPanel.vue'
 
 const store = useStore()
 

web/src/management/pages/edit/pages/skin/ResultPage.vue

@@ -13,7 +13,7 @@
 </template>
 <script setup lang="ts">
 import CommonTemplate from '../../components/CommonTemplate.vue'
-import ResultCatalog from '../../modules/settingModule/result/CatalogPanel.vue'
-import ResultPreview from '../../modules/settingModule/result/PreviewPanel.vue'
-import ResultSetter from '../../modules/settingModule/result/SetterPanel.vue'
+import ResultCatalog from '../../modules/resultModule/CatalogPanel.vue'
+import ResultPreview from '../../modules/resultModule/PreviewPanel.vue'
+import ResultSetter from '../../modules/resultModule/SetterPanel.vue'
 </script>

web/src/materials/setters/widgets/AnswerRadio.vue

@@ -1,41 +0,0 @@
-<template>
-  <div class="answer-radio-wrap">
-    <el-radio-group v-model="whitelistType"   @change="handleRadioGroupChange">
-      <el-radio value="ALL">所有人</el-radio>
-      <el-radio value="MEMBER">空间成员</el-radio>
-      <el-radio value="CUSTOM">白名单</el-radio>
-    </el-radio-group>
-  </div>
-</template>
-<script setup>
-
-import { ref } from 'vue'
-import { FORM_CHANGE_EVENT_KEY } from '@/materials/setters/constant'
-
-const props = defineProps({
-  formConfig: Object,
-})
-const emit = defineEmits([FORM_CHANGE_EVENT_KEY])
-
-const whitelistType = ref(props.formConfig?.value || 'ALL')
-
-const handleRadioGroupChange = (value) => {
-  const key = props.formConfig.key
-  emit(FORM_CHANGE_EVENT_KEY, { key, value })
-  emit(FORM_CHANGE_EVENT_KEY, { key:'baseConf.whitelist', value: [] })
-  emit(FORM_CHANGE_EVENT_KEY, { key: 'baseConf.memberType', value: 'MOBILE' })
-  if (whitelistType.value == 'ALL') { 
-    emit(FORM_CHANGE_EVENT_KEY, { key:'baseConf.whitelistTip', value:'' })
-  }
-}
-
-
-</script>
-<style lang="scss" scoped>
-.switch-input-wrap{
-  width: 100%;
-  .mt16{
-    margin-top: 16px;
-  }
-}
-</style>