feat: 完成前端业务闭环与后端联调

pages/records/ceremony-editor.vue

@@ -107,6 +107,7 @@
           <text v-if="coverFileName" class="upload-receipt"
             >已上传：{{ coverFileName }}</text
           >
+          <button v-if="coverOssId" class="remove-cover-button" :disabled="uploading || submitting" @click="clearCover">移除封面</button>
         </view>
         <text v-if="uploadError" class="form-error">{{ uploadError }}</text>
         <text v-if="submitError" class="form-error">{{ submitError }}</text>
@@ -370,6 +371,12 @@ const uploadCover = async () => {
     if (pageActive) uploading.value = false;
   }
 };
+const clearCover = () => {
+  if (uploading.value || submitting.value) return;
+  coverOssId.value = null;
+  coverFileName.value = "";
+  uploadError.value = "";
+};
 const saveCeremony = async () => {
   if (uploading.value || submitting.value || !hasValidContext.value) return;
   if (!form.ceremonyType.trim() || !form.ceremonyTitle.trim()) {
@@ -382,7 +389,7 @@ const saveCeremony = async () => {
   const payload = {
     ...ceremonyForm,
     ceremonyTime: ceremonyTime.value,
-    ...(coverOssId.value ? { coverOssId: coverOssId.value } : {}),
+    coverOssId: coverOssId.value,
     ...(isEdit.value ? preservedUpdateFields.value : {}),
   };
   const createAttempt = isEdit.value ? null : ceremonyCreateGuard.begin(payload);
@@ -463,12 +470,13 @@ onUnload(() => {
 }
 .page-content {
   flex: 1;
-  padding: 22rpx 28rpx 72rpx;
+  padding: 22rpx 28rpx calc(72rpx + env(safe-area-inset-bottom));
 }
 .editor-card,
 .state-card {
   @include adaptive-records-content;
   box-sizing: border-box;
+  background-color: rgba($paper, 0.82);
 }
 .editor-card {
   padding: 38rpx 32rpx 42rpx;
@@ -593,6 +601,18 @@ onUnload(() => {
   font-size: clamp(13px, 21rpx, 16px);
   overflow-wrap: anywhere;
 }
+.remove-cover-button {
+  justify-self: start;
+  min-height: 72rpx;
+  margin: 0;
+  padding: 0 18rpx;
+  border: 1rpx solid rgba($brand-red, 0.38);
+  border-radius: 8rpx;
+  background: transparent;
+  color: $brand-red;
+  font-size: clamp(13px, 21rpx, 16px);
+}
+.remove-cover-button::after { border: 0; }
 .form-error {
   margin-top: 10rpx;
   color: $brand-red;