我们一起聊聊审核平台前端新老仓库迁移

// entities/todo.js
export default class Todo {
    todoId
    businessId
    todoConfig
    ...
    constructor() {}
    async getTodoConfig() {
        // 获取配置
    }
}


// entities/task.js
export default class Task {
  dispatch_conf
  listData
  timeCount
  ...
  constructor() {}
  async getTaskDetail({ getTask, taskFormat, afterGetTask}) {
    // 抽象封装核心任务流程
  }
  // 计时逻辑
  startTimer() {}
  clearTimers() {}
}


// entities/resource.js
export default class Resource {
    detail
    dataReady
    constructor() {}
    async getResourceDetail({ getResource, resourceFormat, afterGetResource }) {
        // 抽象封装资源模式核心流程
    }
}

// usecase/use-single-submit
import { get } from 'lodash-es' // 三方工具库
import { ANNOTATION_SINGLE_OPER_PASS_NAME } from '@/constants' // 常量
import { workbenchApi } from '@/api'
import { setLogData } from '@/utils/xx' // 工具函数
export function getSingleSubmitParams({ data, state.xxx }) {
  //... 逻辑处理
  return params
}
export function submitAuditSingle({ data, afterTaskSubmit }) {
  const params = ...
  workbenchApi.submit(params).then((res) => {
    if(res.code = xxx){
      afterTaskSubmit() // 调用钩子函数
    }
  })
}

// store/todoConfigDetail
import { getTodoInfo } from '@/struct/TodoConfigDetailStruct/usecase/use-todo'
import { getTaskInfo, getTask, taskDispatchListFormat } from '@/struct/TodoConfigDetailStruct/usecase/use-task'
import { getSingleSubmitParams, submitAuditSingle } from '@/struct/TodoConfigDetailStruct/usecase/use-single-submit'
const todo = ref({})
async function init({ $route }) {
  const query = $route.query
  const todoId = +query.todo_id
  ...
  set(todo, getTodoInfo({ todoId, ... }))
  await get(todo).getTodoConfig()
  ...
}
function getTaskDetail() {
  get(task).getTaskDetail({
    getTask: async ({ noSeize, drillTaskIds }) => await getTask({ todo: get(todo), noSeize, drillTaskIds }),
    taskFormat: async (data) => await taskDispatchListFormat({ data, schema: get(todo).schema })
    afterGetTask: (res) => { ... }
  })
}
async function submit(data) {
  if (single) {
    const params = getSingleSubmitParams({ data, todo: get(todo) })
    submitAuditSingle({ params, afterTaskSubmit: () => { ... } })
  } else {
    ...
  }
}

// Audit.vue
const todoConfigDetailStore = useTodoConfigDetailStore()
const { todo, task, multipleSelection } = storeToRefs(todoConfigDetailStore)
const { getTaskDetail, submit } = todoConfigDetailStore

// 替换data
scriptAst.replace("data() {return {$$$};}", `const $data = reactive({$$$})`);

// 替换props
scriptAst.replace("props:{$$$}", "const props = defineProps({$$$})");

// 替换生命周期
scriptAst.replace("created(){$$$}", "onBeforeMount(()=>{$$$})")
  .replace("mounted(){$$$}", "onMounted(()=>{$$$})")
  .replace("async mounted(){$$$}", "onMounted(async ()=>{$$$})")
  .replace("beforeUnmount(){$$$}", "onBeforeUnmount(()=>{$$$})")
  .replace("unmounted(){$$$}", "onUnmounted(()=>{$$$})")
  .replace("beforeDestroy(){$$$}", "onBeforeUnmount(()=>{$$$})")
  .replace("destoryed(){$$$}", "onUnmounted(()=>{$$$})");

getDataKeys() {
  const keys = new Set();
  // 只需要第一层的key，所以deep设为1
  this.scriptAst.find('data() {$$$}').find('$_$:$_$', { deep: 1 }).each(node => {
    if (node.match[0] && node.match[0][0].node.type === 'Identifier') {
      keys.add(node.match[0][0].value);
    }
  });
  return Array.from(keys)
}
getPropsKeys() {
  const keys = new Set();
  this.scriptAst.find('props: {$$$1}', { deep: 1 }).each((node) => {
    if (node.match['$$$1']) {
      node.match['$$$1'].forEach((item) => {
        if (item.key && item.key.type === 'Identifier') {
          keys.add(item.key.name)
        }
      })
    }
  });


  return Array.from(keys)
}
// methods 有点小复杂，需要考虑异步函数，普通函数和键值对的写法
getMethodsKeys() {
  const methodsAst = this.scriptAst.find('methods:{$$$}');
  const methods = methodsAst.find('$_$() {$$$1}');
  const asyncmMethods = methodsAst.find('async $_$(){$$$1}');
  const mapKeys = methodsAst.find('$_$:$$$1', { deep: 1 });
  const methodNames = [];
  methods.each(node => {
    if (node.match[0] && node.match[0][0]) {
      methodNames.push(node.match[0][0].value);
    }
  });
  asyncmMethods.each(node => {
    if (node.match[0] && node.match[0][0]) {
      methodNames.push(node.match[0][0].value);
    }
  });
  mapKeys.each(node => {
    if (node.match[0] && node.match[0][0]) {
      methodNames.push(node.match[0][0].value);
    }
  });
  return methodNames;
}

handlTemplate() {
    // 替换attr, 例如 <div :value="value"></div>
    this.ast.find("<template></template>").find(`<$_$ ="$$$0" >$$$1</$_$>`).each((node) => {
      node.match['$$$0'].forEach(attr => {
        if (attr && attr.value) {
          this.dataKeys.some(keyName => {
            const reg = new RegExp(`${keyName}\\b`, 'g')
            const macth = reg.test(attr.value.content);
            attr.value.content = attr.value.content.replace(reg, `$data.${keyName}`)
            if (macth) {
              return true;
            }
          })
          this.methodsKeys.some(keyName => {
            const reg = new RegExp(`\\b${keyName}\\b`, 'g')
            const macth = reg.test(attr.value.content);
            attr.value.content = attr.value.content.replace(reg, `methods.${keyName}`)
            if (macth) {
              return true;
            }
          })


          this.propsKeys.some(keyName => {
            const reg = new RegExp(`\\b${keyName}\\b`, 'g')
            const macth = reg.test(attr.value.content);
            attr.value.content = attr.value.content.replace(reg, `props.${keyName}`)
            if (macth) {
              return true;
            }
          })
        }
      })
      // 替换content，例如：<div>{{value}}<div>
      node.match['$$$1'].forEach(node => {
        if (node.content && node.content.value) {
          // 省略：与上面类似
        }
      })
    })
  }

// 正则替换更方便，所以需要放在最后一步替换
handlThis(code) {
  code = code.replace(/this\.([_$0-9a-zA-Z]+)/g, (match, $1) => {
    // 替换function body 中的 data引用
    if (this.dataKeys.includes($1)) {
      return `$data.${$1}`;
    }
    // 替换function body 中的 methods调用
    else if (this.methodsKeys.includes($1)) {
      return `methods.${$1}`;
    }
    // 替换 vm 私有属性
    else if ($1 && $1[0] === '$') {
      return `$vm.${$1}`;
    } else if (this.computedKeys.includes($1)) {
      return $1
    } else if (this.propsKeys.includes($1)) {
      return `props.${$1}`
    }
    return `$vm.${$1}`
  })
  // 替换function body 中的 动态methods调用
  code = code.replace(/this\[(.+)\]/g, (match, $1) => {
    return `methods[${$1}]`;
  })
  return code
}

async parseOpenDialog(payload) {
  const { schema, data } = payload
  await this[schema.method](
    parseSchema,
    data,
    dialogParams,
    dialogType
  )
}

const parseOpenDialog = async (payload) => {
}

const methods = {
  parseOpenDialog: async (payload) => {
  },
  xxx: async() => {
  }
}

import { getCurrentInstance } from 'vue'
const { proxy: $vm } = getCurrentInstance()


$vm.xxx = '自定义属性'

// 获取store 使用storeToRefs
if (this.storeType === 'pinia') {
  this.scriptAst
  .find("computed:{}")
  .before(`const {${stateNames.join(',')}} = storeToRefs(${this.getPiniaStoreName(key)})`)
  .replace("computed:{$$$}", "$$$")
}

def compare_images(url1, url2):
  loss_fn = lpips.LPIPS(net = 'alex')
  img1 = cv2.imread(url1)
  img2 = cv2.imread(url2)
  if img1 is not None and img2 is not None and img1.size > 0 and img2.size > 0:
      img2 = cv2.resize(img2, (img1.shape[1], img1.shape[0]))
      cv2.imwrite(url2, img2)
      combined_image = cv2.hconcat([img1, img2])
      ex_img1 = lpips.im2tensor(lpips.load_image(url1))
      ex_img2 = lpips.im2tensor(lpips.load_image(url2))
      d = loss_fn.forward(ex_img1, ex_img2)
      if d is not None:
          cv2.putText(combined_image,'score: %.3f'%(1 - d.mean()), (20, 20), cv2.FONT_ITALIC, 0.4, (255, 0, 255))
      return d, combined_image
  else:
      return None