diff --git a/src/components/piAsset/index.vue b/src/components/piAsset/index.vue
index 9cc4872..e3ef373 100644
--- a/src/components/piAsset/index.vue
+++ b/src/components/piAsset/index.vue
@@ -1,9 +1,9 @@
 <template>
 	<div class="pi-asset">
 		<div class="file-item" v-for="(item, index) in value" :key="index" :style="style">
-			<el-image v-if="obj.isImg(item)" :src="config.API_URL + '/' + item" :style="style" :preview-src-list="[config.API_URL + '/' + item]" fit="cover"
+			<el-image v-if="obj.isImg(item)" :src="item" :style="style" :preview-src-list="[item]" fit="cover"
 					  preview-teleported :z-index="9999"></el-image>
-			<pi-player v-else-if="obj.isVideo(item)" :src="config.API_URL + '/' + item" :options="videoOptions"></pi-player>
+			<pi-player v-else-if="obj.isVideo(item)" :src="item" :options="videoOptions"></pi-player>
 			<el-icon v-else :style="style" style="color: #409eff;" :size="32">
 				<component :is="'pi-icon-task'"/>
 			</el-icon>
@@ -26,7 +26,6 @@ import pickerDialog from "./picker.vue";
 import assetConfig from "@/config/asset"
 import piPlayer from '@/components/piPlayer'
 import {nextTick, ref, watch} from "vue";
-import config from "@/config"
 
 const emit = defineEmits(['update:modelValue'])
 const props = defineProps({
diff --git a/src/components/piImage/index.vue b/src/components/piImage/index.vue
new file mode 100644
index 0000000..5170fb6
--- /dev/null
+++ b/src/components/piImage/index.vue
@@ -0,0 +1,20 @@
+<template>
+	<el-image :src="prefix+src" :preview-src-list="previewList" v-bind="attrs"/>
+</template>
+
+<script setup>
+import config from "@/config"
+import {computed, useAttrs} from "vue"
+
+const attrs = useAttrs()
+const props = defineProps({
+	src: {type: String, default: ""},
+	previewSrcList: {type: Array, default: []}
+})
+const prefix = config.API_URL + '/'
+
+const previewList = computed(() => {
+	if (!props.previewSrcList?.length) return []
+	return props.previewSrcList.map(i => prefix + i)
+})
+</script>
diff --git a/src/components/piPlayer/index.vue b/src/components/piPlayer/index.vue
index 0f81c68..7dabcf8 100644
--- a/src/components/piPlayer/index.vue
+++ b/src/components/piPlayer/index.vue
@@ -6,7 +6,9 @@
 import Player from 'xgplayer'
 import HlsPlayer from 'xgplayer-hls'
 import {ref, watch, onMounted} from "vue";
+import config from "@/config"
 
+const prefix = config.API_URL + '/'
 const videoRef = ref(null)
 const props = defineProps({
 	src: {type: String, required: true, default: ""},
@@ -23,9 +25,9 @@ let player = ref(null)
 
 watch(() => props.src, (val) => {
 	if (player.value.hasStart) {
-		player.value.src = val
+		player.value.src = prefix + val
 	} else {
-		player.value.start(val)
+		player.value.start(prefix + val)
 	}
 })
 
@@ -36,7 +38,7 @@ onMounted(() => {
 function init() {
 	player.value = new Player({
 		el: videoRef.value,
-		url: props.src,
+		url: prefix + props.src,
 		autoplay: props.autoplay,
 		loop: props.loop,
 		controls: props.controls,
@@ -49,7 +51,7 @@ function init() {
 function initHls() {
 	player.value = new HlsPlayer({
 		el: videoRef.value,
-		url: props.src,
+		url: prefix + props.src,
 		autoplay: props.autoplay,
 		loop: props.loop,
 		controls: props.controls,
diff --git a/src/pi.ts b/src/pi.ts
index 4807402..bcaea2d 100644
--- a/src/pi.ts
+++ b/src/pi.ts
@@ -13,6 +13,7 @@ import piDialog from "@/components/piDialog"
 import piTable from "@/components/piTable"
 import piUpload from "@/components/piUpload"
 import piSelect from "@/components/piSelect"
+import piImage from "@/components/piImage"
 
 export default {
 	install(app: App) {
@@ -21,6 +22,7 @@ export default {
 		app.component('piTable', piTable)
 		app.component('piUpload', piUpload)
 		app.component('piSelect', piSelect)
+		app.component('piImage', piImage)
 
 		//注册全局指令
 		app.directive('auth', auth)