fix : 修改联系方式

src/pages/index/contact_us/contact_info/index.vue

@@ -1,76 +1,58 @@
 <template>
   <!-- 面包屑 -->
   <el-breadcrumb>
-    <el-breadcrumb-item>联系我们</el-breadcrumb-item>
+    <el-breadcrumb-item>联系方式</el-breadcrumb-item>
     <el-breadcrumb-item to="/ContactInfo'">联系方式</el-breadcrumb-item>
   </el-breadcrumb>
   <el-form ref="formRef" :model="formData" :rules="rules">
     <el-row>
+
+
       <el-col :span="12">
-        <el-form-item
+        <el-form-item :label-width="labelWidth" label="咨询热线" prop="contact_info_phone">
-          :label-width="labelWidth"
+          <el-input v-model='formData.contact_info_phone' type="text" placeholder='请输入咨询热线'></el-input>
-          label="客户微信"
-          prop="customer_service_wx"
-        >
-          <el-input
-            v-model="formData.customer_service_wx"
-            type="text"
-            placeholder="请输入客户微信"
-          ></el-input>
         </el-form-item>
       </el-col>
-      <el-col :span="12">
+      <el-col :span='24'>
-        <el-form-item
+        <el-form-item :label-width='labelWidth' label='定位' prop='contact_info_location'>
-          :label-width="labelWidth"
+          <Map :mapCb="mapCb()" v-model='locationList' style='margin-top: 20px;'></Map>
-          label="联系电话"
-          prop="contact_info_phone"
-        >
-          <el-input
-            v-model="formData.contact_info_phone"
-            type="text"
-            placeholder="请输入联系电话"
-          ></el-input>
-        </el-form-item>
-      </el-col>
-      <el-col :span="12">
-        <el-form-item :label-width="labelWidth" label="纬度" prop="latitude">
-          <el-input
-            v-model="formData.latitude"
-            type="text"
-            placeholder="请输入纬度"
-          ></el-input>
-        </el-form-item>
-      </el-col>
-      <el-col :span="12">
-        <el-form-item :label-width="labelWidth" label="经度" prop="longitude">
-          <el-input
-            v-model="formData.longitude"
-            type="text"
-            placeholder="请输入经度"
-          ></el-input>
         </el-form-item>
       </el-col>
+
       <el-col :span="24">
-        <el-form-item
+        <el-form-item :label-width="labelWidth" label="联系我们简介" prop="contact_info_content">
-          :label-width="labelWidth"
+          <RichText v-model='formData.contact_info_content' :min-height='196'></RichText>
-          label="定位"
-          prop="contact_info_location"
-        >
-          <Map v-model="locationList" style="margin-top: 20px"></Map>
         </el-form-item>
       </el-col>
-      <el-col :span="24">
+      <el-col :span='6'>
-        <el-form-item
+        <el-form-item :label-width='labelWidth' label='客服微信图片' prop='customer_service_wx_img'>
-          :label-width="labelWidth"
+          <UploadImage ref='uploadRef' v-model='formData.customer_service_wx_img' :data=uoloadData :limit='1'
-          label="加盟简介"
+            :fileSize='5' :drag='true' :isShowTip='false' />
-          prop="join_apply_content"
-        >
-          <RichText
-            v-model="formData.join_apply_content"
-            :min-height="196"
-          ></RichText>
         </el-form-item>
       </el-col>
+
+      <el-col :span='6'>
+        <el-form-item :label-width='labelWidth' label='微信公众号图片' prop='wx_office_accounts_img'>
+          <UploadImage ref='uploadRef' v-model='formData.wx_office_accounts_img' :data=uoloadData :limit='1' :fileSize='5'
+            :drag='true' :isShowTip='false' />
+        </el-form-item>
+      </el-col>
+
+      <el-col :span='6'>
+        <el-form-item :label-width='labelWidth' label='官方微博图片' prop='weibo_img'>
+          <UploadImage ref='uploadRef' v-model='formData.weibo_img' :data=uoloadData :limit='1' :fileSize='5' :drag='true'
+            :isShowTip='false' />
+        </el-form-item>
+      </el-col>
+
+      <el-col :span='6'>
+        <el-form-item :label-width='labelWidth' label='官方qq图片' prop='qq_img'>
+          <UploadImage ref='uploadRef' v-model='formData.qq_img' :data=uoloadData :limit='1' :fileSize='5' :drag='true'
+            :isShowTip='false' />
+        </el-form-item>
+      </el-col>
+
+
     </el-row>
     <el-row>
       <el-button type="primary" class="sus_button" @click="save(formRef)">
@@ -80,44 +62,63 @@
   </el-form>
 </template>
 <script setup>
-import { get } from 'lodash';
+import { ref, reactive } from "vue";
-import { ref, reactive } from 'vue';
+import { getContactInfo, editContactInfo } from "~/service/contact_info";
-import { getContactInfo, editContactInfo } from '~/service/contact_info';
+import { useLoginStore } from "~/store";
-import { useLoginStore } from '~/store';
 
 const store = useLoginStore();
 const headers = {
-  Accept: 'application/json',
+  Accept: "application/json",
-  ...store.headers
+  ...store.headers,
 };
 
 let formData = ref({});
-const locationList = ref({});
+const locationList = ref({})
+
 
 const uoloadData = ref({
-  dirName: 'ContactInfo'
+  dirName: "ContactInfo"
-});
+})
 
 //验证规则
 const rules = reactive({
-  customer_service_wx: [
-    {
-      required: true,
-      message: '客户微信不能为空'
-    }
-  ],
   contact_info_phone: [
     {
       required: true,
-      message: '联系电话不能为空'
+      message: '咨询热线不能为空'
     }
   ],
-  join_apply_content: [
+  contact_info_content: [
     {
       required: true,
-      message: '加盟简介不能为空'
+      message: '联系我们简介不能为空'
     }
-  ]
+  ],
+  customer_service_wx_img: [
+    {
+      required: true,
+      message: '客服微信图片不能为空'
+    }
+  ],
+  wx_office_accounts_img: [
+    {
+      required: true,
+      message: '微信公众号图片不能为空'
+    }
+  ],
+  weibo_img: [
+    {
+      required: true,
+      message: '官方微博图片不能为空'
+    }
+  ],
+  qq_img: [
+    {
+      required: true,
+      message: '官方qq图片不能为空'
+    }
+  ],
+
 });
 
 const labelWidth = 200;
@@ -134,52 +135,41 @@ const getContent = async () => {
       locationList.value.longitude = formData.value.longitude;
       locationList.value.latitude = formData.value.latitude;
     }
-    console.log(locationList.value.address);
+
   }
 };
 
 
-
 let mapCb = function () {
-  getContent();
-};
-
-
-//调用
-function getInfo(){
   getContent()
-};
+}
-getInfo()
-
-
-
 
 
 
 //保存
-const save = async formEl => {
+const save = async (formEl) => {
   if (!formEl) return;
-  formEl.validate(async valid => {
+  formEl.validate(async (valid) => {
     if (!valid) {
       return;
     }
 
+
     // 地址处理
     if (!locationList.value.address) {
       ElMessage.error('请选择contact_info_location');
-      return;
+      return
     }
+    let locationData = locationList.value
+    formData.value.contact_info_location = locationData.address
+    formData.value.longitude = locationData.longitude
+    formData.value.latitude = locationData.latitude
 
-    let locationData = locationList.value;
-    formData.contact_info_location = locationData.address;
-    formData.longitude = locationData.longitude;
-    formData.latitude = locationData.latitude;
 
     const { code } = await editContactInfo(formData.value);
-    console.log(formData.value);
   });
-
 };
+
 </script>
 <style lang="scss" scoped>
 .sus_button {
@@ -187,13 +177,16 @@ const save = async formEl => {
   height: 50px;
   margin: 20px auto;
 }
+
 .upLoadEl {
   :deep(.el-upload-list__item) {
     height: 200px;
     width: 300px;
   }
+
   :deep(.el-upload-list__item-thumbnail) {
     object-fit: contain;
   }
 }
 </style>
+