feat: IAgree

src/components/IAgree/index.ts

@@ -0,0 +1,4 @@
+import IAgree from './src/IAgree.vue'
+
+export type { LinkItem, IAgreeProps } from './src/types'
+export { IAgree }

src/components/IAgree/src/IAgree.vue

@@ -0,0 +1,41 @@
+<script lang="ts" setup>
+import { ElCheckbox } from 'element-plus'
+import { Highlight } from '@/components/Highlight'
+import { PropType, computed } from 'vue'
+import { LinkItem } from './types'
+
+const props = defineProps({
+  text: {
+    type: String,
+    default: ''
+  },
+  link: {
+    type: Array as PropType<LinkItem[]>,
+    default: undefined
+  }
+})
+
+const modelValue = defineModel<boolean>()
+
+const highlightKeys = computed(() => {
+  return props.link?.map((item) => item.text) || []
+})
+
+const keyClick = (key: string) => {
+  const linkItem = props.link?.find((item) => item.text === key)
+  if (linkItem?.url) {
+    window.open(linkItem.url)
+    return
+  }
+  if (linkItem?.onClick) {
+    linkItem.onClick()
+  }
+}
+</script>
+
+<template>
+  <div class="flex items-center">
+    <ElCheckbox v-model="modelValue" class="mr-0px!" />
+    <Highlight class="ml-10px" :keys="highlightKeys" @click="keyClick">{{ text }}</Highlight>
+  </div>
+</template>

src/components/IAgree/src/types/index.ts

@@ -0,0 +1,10 @@
+export interface LinkItem {
+  text: string
+  url?: string
+  onClick?: () => void
+}
+
+export interface IAgreeProps {
+  text: string
+  link: LinkItem[]
+}