修改招募，关于我们，产品，服务，资源逻辑改为上传图片不使用富文本编辑器

src/api/product.js

@@ -23,6 +23,10 @@ const uploadFile = (params) => {
 const deleteProduct = (params) => {
     return http.del('/api/product', params)
 }
+//根据id修改状态
+const updateProductIsindex = (params) => {
+    return http.put('/api/productisindex', params)
+}
 export default {
-    getProductList, getProductDetail, addProduct, updateProduct, deleteProduct, uploadFile
+    getProductList, getProductDetail, addProduct, updateProduct, deleteProduct, uploadFile,updateProductIsindex
 }

src/view/contents/Detail.vue

@@ -16,7 +16,14 @@
           <el-input v-model="contentsDetail.synopsis" placeholder="请输入简介" />
         </el-form-item>
         <el-form-item label="详情:">
-          <EditorWithBinding v-model="contentsDetail.detail"/>
+          <el-image v-model="contentsDetail.detail" style="width: 100px; height: 100px; margin-right: 10px"
+                        fit="cover"></el-image>
+          <el-upload :http-request="detailhttpRequests" multiple :show-file-list="true" list-type="picture-card">
+            <el-icon>
+              <Plus />
+            </el-icon>
+          </el-upload>
+          <!-- <EditorWithBinding v-model="contentsDetail.detail"/> -->
         </el-form-item>
       </el-form>
     </el-card>
@@ -43,7 +50,26 @@ const handleEditorChange = (newHtml) => {
   console.log(newHtml)
   contentsDetail.detail = newHtml; // 当子组件编辑器内容变化时，更新父组件的数据
 };
+
+
+const detailfileLists = ref([])
+
+//自定义函数用来覆盖原有的XHR行为（默认提交行为）
+function detailhttpRequests(option) {
+  //将图片存到数组中
+  detailfileLists.value.push(option)
+}
+
 const updateContent = async () => {
+   //详情图开始
+   let detaildataForms = new FormData();
+  detaildataForms.append('types', "file")
+  //将图片的二进制通过表单的形式发送到后台
+  detailfileLists.value.forEach((it, index) => {
+    detaildataForms.append('file', it.file)
+  })
+  const detailfileRes = await product.uploadFile(detaildataForms)
+  contentsDetail.detail = detailfileRes.data.Data
   const res = await contents.updateRecruit({
     id: parseInt(route.query.id),
     title: contentsDetail.title,

src/view/contents/add.vue

@@ -10,28 +10,34 @@
       </template>
       <el-form>
         <el-form-item label="标题:">
-          <el-input v-model="contentsDetail.title" placeholder="请输入标题"/>
+          <el-input v-model="contentsDetail.title" placeholder="请输入标题" />
         </el-form-item>
         <el-form-item>
-          <el-switch v-model="contentsDetail.types" active-value="1" inactive-value="0" active-text="招募"
-                     inactive-text="关于我们"/>
+          <el-switch v-model="contentsDetail.types" active-value="recruit" inactive-value="about" active-text="招募"
+            inactive-text="关于我们" />
         </el-form-item>
         <el-form-item label="简介:">
-          <el-input v-model="contentsDetail.synopsis" placeholder="请输入简介"/>
+          <el-input v-model="contentsDetail.synopsis" placeholder="请输入简介" />
         </el-form-item>
         <el-form-item label="详情:">
-          <EditorWithBinding v-model="contentsDetail.detail"></EditorWithBinding>
+          <el-upload :http-request="detailhttpRequests" multiple :show-file-list="true" list-type="picture-card">
+            <el-icon>
+              <Plus />
+            </el-icon>
+          </el-upload>
+          <!-- <EditorWithBinding v-model="contentsDetail.detail"></EditorWithBinding> -->
         </el-form-item>
       </el-form>
     </el-card>
   </div>
 </template>
 <script setup>
-import {onBeforeMount, reactive} from 'vue';
-import {useRoute, useRouter} from 'vue-router'
+import { onBeforeMount, reactive, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router'
 import contents from "../../api/contents.js";
-import {ElMessage} from "element-plus";
+import { ElMessage } from "element-plus";
 import EditorWithBinding from "../EditorWithBinding.vue";
+import product from "../../api/product.js";
 
 const route = useRoute();
 const router = useRouter();
@@ -41,7 +47,24 @@ const contentsDetail = reactive({
   synopsis: '',
   types: '',
 })
+
+const detailfileLists = ref([])
+
+//自定义函数用来覆盖原有的XHR行为（默认提交行为）
+function detailhttpRequests(option) {
+  //将图片存到数组中
+  detailfileLists.value.push(option)
+}
 const addContent = async () => {
+  //详情图开始
+  let detaildataForms = new FormData();
+  detaildataForms.append('types', "file")
+  //将图片的二进制通过表单的形式发送到后台
+  detailfileLists.value.forEach((it, index) => {
+    detaildataForms.append('file', it.file)
+  })
+  const detailfileRes = await product.uploadFile(detaildataForms)
+  contentsDetail.detail = detailfileRes.data.Data
   const res = await contents.addRecruit({
     id: parseInt(route.query.id),
     title: contentsDetail.title,
@@ -52,17 +75,23 @@ const addContent = async () => {
   if (res.data.Code === 200) {
     ElMessage.success("添加成功")
     await getRecruitDetail()
+    Object.assign(contentsDetail, {
+      title: '',
+      detail: '',
+      synopsis: '',
+      types: '',
+    })
   } else {
     ElMessage.error(res.data.Msg)
   }
 }
 const getRecruitDetail = async () => {
-  const res = await contents.getRecruitDetail({id: route.query.id})
+  const res = await contents.getRecruitDetail({ id: route.query.id })
   Object.assign(contentsDetail, res.data.Data);
 }
 onBeforeMount(async () => {
   if (route.query.id) {
-    const res = await contents.getRecruitDetail({id: route.query.id})
+    const res = await contents.getRecruitDetail({ id: route.query.id })
     Object.assign(contentsDetail, res.data.Data);
   }
 })

src/view/product/Detail.vue

@@ -14,18 +14,11 @@
                     <el-input v-model="productDetail.title"></el-input>
                 </el-form-item>
                 <el-form-item label="图片:">
-                    <el-image
-                        v-model="productDetail.url"
-                        style="width: 100px; height: 100px; margin-right: 10px"
+                    <el-image v-model="productDetail.url" style="width: 100px; height: 100px; margin-right: 10px"
                         fit="cover"></el-image>
-                    <el-upload
-                        :http-request="httpRequests"
-                        multiple
-                        :show-file-list="true"
-                        list-type="picture-card"
-                    >
+                    <el-upload :http-request="httpRequests" multiple :show-file-list="true" list-type="picture-card">
                         <el-icon>
-                            <Plus/>
+                            <Plus />
                         </el-icon>
                     </el-upload>
                 </el-form-item>
@@ -33,7 +26,15 @@
                     <el-input v-model="productDetail.synopsis"></el-input>
                 </el-form-item>
                 <el-form-item label="详情:">
-                    <EditorWithBinding v-model="productDetail.detail"></EditorWithBinding>
+                    <el-image v-model="productDetail.detail" style="width: 100px; height: 100px; margin-right: 10px"
+                        fit="cover"></el-image>
+                    <el-upload :http-request="detailhttpRequests" multiple :show-file-list="true"
+                        list-type="picture-card">
+                        <el-icon>
+                            <Plus />
+                        </el-icon>
+                    </el-upload>
+                    <!-- <EditorWithBinding v-model="productDetail.detail"></EditorWithBinding> -->
                 </el-form-item>
                 <el-form-item label="产品介绍:">
                     <EditorWithBinding v-model="productDetail.product_introduction"></EditorWithBinding>
@@ -45,15 +46,10 @@
                     <EditorWithBinding v-model="productDetail.instructions"></EditorWithBinding>
                 </el-form-item>
                 <el-form-item label="支持软件:">
-                    <el-upload
-                        :http-request="httpRequest"
-                        class="upload-demo"
-                        drag
-                        action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
-                        multiple
-                    >
+                    <el-upload :http-request="httpRequest" class="upload-demo" drag
+                        action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15" multiple>
                         <el-icon class="el-icon--upload">
-                            <upload-filled/>
+                            <upload-filled />
                         </el-icon>
                         <div class="el-upload__text" style="width: 300px">
                             选择上传文件
@@ -69,10 +65,10 @@
 </template>
 
 <script setup>
-import {onBeforeMount, reactive, ref} from 'vue';
-import {useRoute, useRouter} from 'vue-router'
+import { onBeforeMount, reactive, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router'
 import product from "../../api/product.js";
-import {ElMessage} from "element-plus";
+import { ElMessage } from "element-plus";
 import EditorWithBinding from "../EditorWithBinding.vue";
 import resource from "../../api/resource.js";
 
@@ -93,14 +89,20 @@ const productDetail = reactive({
 //定义一个响应式数组用来接收图片
 const fileList = ref([])
 const fileLists = ref([])
+const detailfileLists = ref([])
 
 //自定义函数用来覆盖原有的XHR行为（默认提交行为）
+function detailhttpRequests(option) {
+    //将图片存到数组中
+    detailfileLists.value.push(option)
+}
+//自定义函数用来覆盖原有的XHR行为（默认提交行为）
 function httpRequest(option) {
-//将图片存到数组中
+    //将图片存到数组中
     fileList.value.push(option)
 }
 function httpRequests(option) {
-//将图片存到数组中
+    //将图片存到数组中
     fileLists.value.push(option)
 }
 const handleContentChange = (htmlContent) => {
@@ -116,6 +118,16 @@ const updateProduct = async () => {
     })
     const files = await product.uploadFile(dataForm)
     productDetail.supporting_software = files.data.Data
+
+    //详情图开始
+    let detaildataForms = new FormData();
+    detaildataForms.append('types', "file")
+    //将图片的二进制通过表单的形式发送到后台
+    detailfileLists.value.forEach((it, index) => {
+        detaildataForms.append('file', it.file)
+    })
+    const detailfileRes = await product.uploadFile(detaildataForms)
+    productDetail.detail = detailfileRes.data.Data
     //上传图片
     let dataForms = new FormData();
     dataForms.append('types', "product")
@@ -145,13 +157,11 @@ const updateProduct = async () => {
 }
 onBeforeMount(async () => {
     if (route.query.id) {
-        const res = await product.getProductDetail({id: route.query.id})
+        const res = await product.getProductDetail({ id: route.query.id })
         console.log(res.data)
         Object.assign(productDetail, res.data.Data);
     }
 })
 </script>
 
-<style lang="scss" scoped>
-
-</style>
+<style lang="scss" scoped></style>

src/view/product/add.vue

@@ -15,35 +15,40 @@
                 <el-form-item label="图片:">
                     <el-upload :http-request="httpRequest" multiple :show-file-list="true" list-type="picture-card">
                         <el-icon>
-                            <Plus/>
+                            <Plus />
                         </el-icon>
                     </el-upload>
                 </el-form-item>
                 <el-form-item label="类型:">
                     <el-select v-model="productDetail.type" @change="handleTypeChange" placeholder="请选择添加类型">
-                        <el-option label="服务" value="serve"/>
-                        <el-option label="产品" value="product"/>
+                        <el-option label="服务" value="serve" />
+                        <el-option label="产品" value="product" />
                     </el-select>
                 </el-form-item>
                 <el-form-item label="产品类型:">
                     <el-select v-model="productDetail.ptype" :disabled="productDetail.type === 'serve'"
-                               placeholder="请选择软件或者硬件"
-                               style="width: 20vw">
-                        <el-option label="硬件" value="hardware"/>
-                        <el-option label="软件" value="software"/>
+                        placeholder="请选择软件或者硬件" style="width: 20vw">
+                        <el-option label="硬件" value="hardware" />
+                        <el-option label="软件" value="software" />
                     </el-select>
                 </el-form-item>
                 <el-form-item label="是否首页展示:">
                     <el-select v-model="productDetail.isIndex" placeholder="请选择是否首页显示" style="width: 20vw">
-                        <el-option label="是" value="true"/>
-                        <el-option label="否" value="false"/>
+                        <el-option label="是" value="true" />
+                        <el-option label="否" value="false" />
                     </el-select>
                 </el-form-item>
                 <el-form-item label="简介:">
                     <el-input v-model="productDetail.synopsis"></el-input>
                 </el-form-item>
                 <el-form-item label="详情:">
-                    <EditorWithBinding v-model="productDetail.detail"></EditorWithBinding>
+                    <el-upload :http-request="detailhttpRequests" multiple :show-file-list="true"
+                        list-type="picture-card">
+                        <el-icon>
+                            <Plus />
+                        </el-icon>
+                    </el-upload>
+                    <!-- <EditorWithBinding v-model="productDetail.detail"></EditorWithBinding> -->
                 </el-form-item>
                 <el-form-item label="产品介绍:">
                     <EditorWithBinding v-model="productDetail.product_introduction"></EditorWithBinding>
@@ -55,14 +60,9 @@
                     <EditorWithBinding v-model="productDetail.instructions"></EditorWithBinding>
                 </el-form-item>
                 <el-form-item label="支持软件:">
-                    <el-upload
-                        :http-request="httpRequests"
-                        class="upload-demo"
-                        drag
-                        multiple
-                    >
+                    <el-upload :http-request="httpRequests" class="upload-demo" drag multiple>
                         <el-icon class="el-icon--upload">
-                            <upload-filled/>
+                            <upload-filled />
                         </el-icon>
                         <div class="el-upload__text" style="width: 300px">
                             选择上传文件
@@ -78,12 +78,12 @@
 </template>
 
 <script setup>
-import {onBeforeMount, reactive, ref} from 'vue';
-import {useRoute, useRouter} from 'vue-router'
+import { onBeforeMount, reactive, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router'
 import product from "../../api/product.js";
-import {ElMessage} from "element-plus";
+import { ElMessage } from "element-plus";
 import EditorWithBinding from "../EditorWithBinding.vue";
-import {Plus} from "@element-plus/icons-vue";
+import { Plus } from "@element-plus/icons-vue";
 import resource from "../../api/resource.js";
 
 const route = useRoute();
@@ -119,10 +119,18 @@ const fileLists = ref([])
 
 //自定义函数用来覆盖原有的XHR行为（默认提交行为）
 function httpRequests(option) {
-//将图片存到数组中
+    //将图片存到数组中
     fileLists.value.push(option)
 }
 
+const detailfileLists = ref([])
+
+//自定义函数用来覆盖原有的XHR行为（默认提交行为）
+function detailhttpRequests(option) {
+    //将图片存到数组中
+    detailfileLists.value.push(option)
+}
+
 const addProduct = async () => {
     let dataForm = new FormData();
     dataForm.append('types', "serve")
@@ -136,6 +144,16 @@ const addProduct = async () => {
     fileLists.value.forEach((it, index) => {
         dataForms.append('file', it.file)
     })
+    //详情图开始
+    let detaildataForms = new FormData();
+    detaildataForms.append('types', "file")
+    //将图片的二进制通过表单的形式发送到后台
+    detailfileLists.value.forEach((it, index) => {
+        detaildataForms.append('file', it.file)
+    })
+    const detailfileRes = await product.uploadFile(detaildataForms)
+    productDetail.detail = detailfileRes.data.Data
+    //详情图结束
     const fileRes = await product.uploadFile(dataForms)
     productDetail.supporting_software = fileRes.data.Data
     const resoursRes = await resource.uploadResource(dataForm)
@@ -176,7 +194,7 @@ const addProduct = async () => {
 }
 onBeforeMount(async () => {
     if (route.query.id) {
-        const res = await product.getProductDetail({id: route.query.id})
+        const res = await product.getProductDetail({ id: route.query.id })
         console.log(res.data)
         Object.assign(productDetail, res.data.Data);
     }

src/view/product/product.vue

@@ -23,7 +23,7 @@
                 <el-table-column prop="title" label="是否首页显示" width="180">
                     <template #default="scope">
                         <el-switch v-model="scope.row.isIndex" size="large" active-text="显示" inactive-text="不显示"
-                            @change="updateProducts(scope.row)" />
+                            @change="updateProductsIsindex(scope.row)" />
                     </template>
                 </el-table-column>
                 <el-table-column prop="ptype" label="产品类型" width="180">
@@ -124,6 +124,16 @@ const updateProducts = async (row) => {
         ElMessage.error(res.data.Msg)
     }
 }
+//根据id修改产品状态
+const updateProductsIsindex = async (row) => {
+    const res = await product.updateProductIsindex({ id: row.ID, isIndex: row.isIndex });
+    if (res.data.Code === 200) {
+        ElMessage.success("修改成功")
+        // await getProductAll();
+    } else {
+        ElMessage.error(res.data.Msg)
+    }
+}
 
 const handleSizeChange = (size) => {
     searchForm.size = size;

src/view/resource/upload.vue

@@ -63,6 +63,7 @@ async function onBtn() {
     if (res.data.Code === 200) {
         ElMessage.success("上传成功")
         dataForm.set('file', '')
+        isUploading.value = false
     } else {
         ElMessage.error(res.data.Msg)
     }

src/view/serve/Detail.vue

@@ -48,7 +48,21 @@
                     </el-select>
                 </el-form-item>
                 <el-form-item label="详情:">
-                    <EditorWithBinding v-model="serveDetail.detail"/>
+                    <el-image
+                        v-model="serveDetail.detail"
+                        style="width: 100px; height: 100px; margin-right: 10px"
+                        fit="cover"></el-image>
+                    <el-upload
+                        :http-request="httpRequest"
+                        multiple
+                        :show-file-list="true"
+                        list-type="picture-card"
+                    >
+                        <el-icon>
+                            <Plus/>
+                        </el-icon>
+                    </el-upload>
+                    <!-- <EditorWithBinding v-model="serveDetail.detail"/> -->
                 </el-form-item>
             </el-form>
         </el-card>

src/view/serve/add.vue

@@ -10,41 +10,31 @@
       </template>
       <el-form>
         <el-form-item label="标题:">
-          <el-input v-model="serveDetail.title" placeholder="请输入标题"/>
+          <el-input v-model="serveDetail.title" placeholder="请输入标题" />
         </el-form-item>
         <el-form-item label="图片:">
-          <el-upload
-              :http-request="httpRequest"
-              multiple
-              :show-file-list="true"
-              list-type="picture-card"
-          >
+          <el-upload :http-request="httpRequest" multiple :show-file-list="true" list-type="picture-card">
             <el-icon>
-              <Plus/>
+              <Plus />
             </el-icon>
           </el-upload>
         </el-form-item>
         <el-form-item label="分类:">
-          <el-select
-              @click="getServeType"
-              v-model="serveDetail.product_id"
-              clearable
-              placeholder="选择分类信息"
-              style="width: 240px"
-          >
-            <el-option
-                v-for="item in ServeType.value"
-                :key="item.ID"
-                :label="item.title"
-                :value="item.ID"
-            />
+          <el-select @click="getServeType" v-model="serveDetail.product_id" clearable placeholder="选择分类信息"
+            style="width: 240px">
+            <el-option v-for="item in ServeType.value" :key="item.ID" :label="item.title" :value="item.ID" />
           </el-select>
         </el-form-item>
         <el-form-item label="简介:">
-          <el-input v-model="serveDetail.synopsis" placeholder="请输入简介"/>
+          <el-input v-model="serveDetail.synopsis" placeholder="请输入简介" />
         </el-form-item>
         <el-form-item label="详情:">
-          <EditorWithBinding v-model="serveDetail.detail"></EditorWithBinding>
+          <el-upload :http-request="detailListRequest" multiple :show-file-list="true" list-type="picture-card">
+            <el-icon>
+              <Plus />
+            </el-icon>
+          </el-upload>
+          <!-- <EditorWithBinding v-model="serveDetail.detail"></EditorWithBinding> -->
         </el-form-item>
 
       </el-form>
@@ -53,11 +43,11 @@
   </div>
 </template>
 <script setup>
-import {onMounted, reactive, ref} from 'vue';
-import {useRoute, useRouter} from 'vue-router'
+import { onMounted, reactive, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router'
 import serve from "../../api/serve.js";
-import {ElMessage} from "element-plus";
-import {Plus} from "@element-plus/icons-vue";
+import { ElMessage } from "element-plus";
+import { Plus } from "@element-plus/icons-vue";
 import resource from "../../api/resource.js";
 import EditorWithBinding from "../EditorWithBinding.vue";
 
@@ -74,23 +64,35 @@ const serveDetail = reactive({
 })
 const ServeType = reactive([{}])
 const fileList = ref([])
+const detailList = ref([])
 const formData = reactive({
   types: '',
 });
 function httpRequest(option) {
-//将图片存到数组中
+  //将图片存到数组中
   fileList.value.push(option)
 }
+function detailListRequest(option) {
+  //将图片存到数组中
+  detailList.value.push(option)
+}
 
 const addContent = async () => {
   let dataForm = new FormData();
+  let detaildataForm = new FormData();
   dataForm.append('types', "serve")
+  detaildataForm.append('types', "serve")
   //将图片的二进制通过表单的形式发送到后台
   fileList.value.forEach((it, index) => {
     dataForm.append('file', it.file)
   })
+  detailList.value.forEach((it, index) => {
+    detaildataForm.append('file', it.file)
+  })
   const fileRes = await resource.uploadResource(dataForm)
-  serveDetail.image=fileRes.data.Data
+  const detailfileRes = await resource.uploadResource(detaildataForm)
+  serveDetail.image = fileRes.data.Data
+  serveDetail.detail = detailfileRes.data.Data
   const res = await serve.addService({
     id: parseInt(route.query.id),
     title: serveDetail.title,
@@ -108,7 +110,7 @@ const addContent = async () => {
     serveDetail.types = '';
     serveDetail.image = '';
     serveDetail.product_id = '';
-    fileList.value=[];
+    fileList.value = [];
   } else {
     ElMessage.error(res.data.Msg)
   }