|
|
@@ -178,6 +178,7 @@
|
|
|
:modelValue="newMaterial.imageUrls"
|
|
|
businessType="material"
|
|
|
@update:modelValue="handleImageUpdate"
|
|
|
+ @delete="handleImageDelete"
|
|
|
/>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -212,6 +213,23 @@
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
</view>
|
|
|
+
|
|
|
+ <!-- 删除确认弹窗 -->
|
|
|
+ <view v-if="showDeleteConfirm" class="delete-confirm-modal">
|
|
|
+ <view class="delete-confirm-mask" @click="showDeleteConfirm = false"></view>
|
|
|
+ <view class="delete-confirm-content">
|
|
|
+ <text class="delete-confirm-title">确认删除</text>
|
|
|
+ <text class="delete-confirm-text">确定要删除这张图片吗?</text>
|
|
|
+ <view class="delete-confirm-btns">
|
|
|
+ <view class="delete-confirm-cancel" @click="showDeleteConfirm = false">
|
|
|
+ <text class="delete-confirm-cancel-text">取消</text>
|
|
|
+ </view>
|
|
|
+ <view class="delete-confirm-ok" @click="confirmDeleteImage">
|
|
|
+ <text class="delete-confirm-ok-text">确定</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -264,6 +282,8 @@ const isSearching = ref<boolean>(false)
|
|
|
const showAddMaterialModal = ref<boolean>(false)
|
|
|
const showMeasurePicker = ref<boolean>(false)
|
|
|
const measureList = ref<UTSJSONObject[]>([])
|
|
|
+const showDeleteConfirm = ref<boolean>(false)
|
|
|
+const deleteImageIndex = ref<number>(0)
|
|
|
|
|
|
type NewMaterial = {
|
|
|
itemName: string
|
|
|
@@ -661,6 +681,17 @@ const handleImageUpdate = (value: UploadResponse[]): void => {
|
|
|
newMaterial.value.imageUrls = value
|
|
|
}
|
|
|
|
|
|
+// 处理图片删除
|
|
|
+const handleImageDelete = (index: number, currentList: UploadResponse[]): void => {
|
|
|
+ deleteImageIndex.value = index
|
|
|
+ showDeleteConfirm.value = true
|
|
|
+}
|
|
|
+
|
|
|
+const confirmDeleteImage = (): void => {
|
|
|
+ newMaterial.value.imageUrls.splice(deleteImageIndex.value, 1)
|
|
|
+ showDeleteConfirm.value = false
|
|
|
+}
|
|
|
+
|
|
|
// 处理新增物料
|
|
|
const handleAddMaterial = async (): Promise<void> => {
|
|
|
// 验证输入
|
|
|
@@ -1396,4 +1427,78 @@ onMounted(() => {
|
|
|
font-size: 24rpx;
|
|
|
color: #999999;
|
|
|
}
|
|
|
-</style>
|
|
|
+
|
|
|
+ /* 删除确认弹窗样式 */
|
|
|
+ .delete-confirm-modal {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ z-index: 10000;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete-confirm-mask {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ background-color: rgba(0, 0, 0, 0.5);
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete-confirm-content {
|
|
|
+ position: relative;
|
|
|
+ width: 600rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ padding: 40rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete-confirm-title {
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333333;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete-confirm-text {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #666666;
|
|
|
+ margin-bottom: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete-confirm-btns {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ gap: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete-confirm-cancel {
|
|
|
+ padding: 20rpx 60rpx;
|
|
|
+ background-color: #f5f5f5;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete-confirm-cancel-text {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete-confirm-ok {
|
|
|
+ padding: 20rpx 60rpx;
|
|
|
+ background-color: #ff4d4f;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete-confirm-ok-text {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ </style>
|