上传附件统一样式

src/components/drawers/AddFaceteach.vue

@@ -128,7 +128,7 @@
                 style="width: 400px; height: 40px; border-radius: 8px;"
                 v-model:value="duration"
               ></a-input-number>
-              <span style="margin-left: 5px; width: 30px">分钟</span>
+              <span style="margin-left: 5px; width: 30px">分</span>
             </div>
           </div>
           <div class="main_item">
@@ -245,6 +245,10 @@
                 @click="innerPersion = !innerPersion"
                 >允许项目内人员临时到场参加
               </a-checkbox>
+            
+            </div>
+            <div class="btnbox">
+            
               <a-checkbox
                 v-model:checked="outPersion"
                 @click="outPersion = !outPersion"
@@ -348,20 +352,14 @@
               </a-tag>
             </div>
           </div>
-          <div class="main_item">
-            <div class="signbox">
-              <span style="margin-right: 3px">附件：</span>
-            </div>
-            <div class="btnbox">
-              <a-upload
-                @change="handleChange"
-                :action="FILE_UPLOAD_URL"
-                v-model:file-list="fileList"
-              >
-                <button class="xkbtn">上传附件</button>
-              </a-upload>
-            </div>
-          </div>
+        	<div class="mbl_items">
+							<div class="item_nam">
+							<span style="margin-right: 10px"></span>
+							</div>
+							<div class="item_inp">
+							<FJUpload v-model:value="attach" @changevalue="changevalue"/>
+							</div>
+						</div>
         </div>
       </div>
       <div class="main_btns">
@@ -388,7 +386,7 @@ import AssessmentList from "@/components/drawers/AssessmentList.vue";
 // import { toDate } from "../../api/method";、
 import { addTempTask } from "../../api/indexTaskadd";
 import ProjectManager from "@/components/project/ProjectManagerNew";
-
+import FJUpload from "@/components/common/FJUpload";
 import { detail } from "../../api/indexCourse";
 import { queryAppraiseDetailById } from "../../api/indexInvist";
 import { queryWorkDetailById } from "@/api/indexWork";
@@ -402,6 +400,7 @@ export default {
     AddTest,
     AssessmentList,
     ProjectManager,
+    FJUpload,
   },
   props: {
     addfaceteachVisible: {
@@ -497,7 +496,9 @@ export default {
       innerPersion: false,
       outPersion: false,
       assessmentName: null,
-      isClick: false
+      isClick: false,
+      attach:"",
+
     });
     const clear = () => {
       state.courseName = "";
@@ -520,6 +521,7 @@ export default {
       state.EditEvalId = null;
       state.applyFlag = "";
       state.needEval = false;
+      state.attach="";
     };
     const closeDrawer = () => {
       ctx.emit("update:addfaceteachVisible", false);
@@ -564,7 +566,22 @@ export default {
     const showDrawerAddTest = () => {
       state.addtestvisible = true;
     };
-
+	// 删除文件返回参数
+  const changevalue = (e) => {
+			let arr = state.attach.split(',')
+			let newarr = []
+			for(let i=0;i<arr.length;i++){
+				if(i!==e){
+				newarr.push(arr[i])
+				}
+			}
+			if(newarr.length==0){
+				state.attach = "";
+			}else{
+				state.attach = newarr.toString()
+			}
+			console.log('changevalue', e, newarr,  state.attach)
+		}
     //查询面授
     const queryFaceTeach = () => {
       queryFaceDetailById(props.EditFaceId).then((res) => {
@@ -585,7 +602,14 @@ export default {
         state.address = result.address;
         state.before = result.beforeStart;
         state.afterStartValue = result.afterStart;
-        state.fileList = JSON.parse(result.attach);
+      
+        let arrss =result.attach.split(',')
+					let str = ''
+					for (let i = 0; i < arrss.length; i++) {
+						i == arrss.length - 1 ? str += arrss[i].slice(arrss[i].lastIndexOf('/') + 1) : str += arrss[i].slice(arrss[i].lastIndexOf('/') + 1) + ','
+					}
+					console.log(str)
+					state.attach = str;
         state.onlySign =
           result.completeType.split(",")[0] == "1" ? true : false;
         state.completeLeave =
@@ -661,7 +685,7 @@ export default {
           teacher: state.memberValue.label,
           address: state.address,
           applyFlag: state.applyFlag,
-          attach: JSON.stringify(state.fileList),
+    
           afterStart: state.afterStartValue || 0,
           beforeStart: state.before || 0,
           beginTime: parseInt(
@@ -679,6 +703,7 @@ export default {
           offcoursePlanId: props.EditFaceId > 0 ? props.EditFaceId : 0,
           testId: state.EditTestId,
           duration: state.duration,
+          attach:state.attach,
       
         };
         console.log("obj============", obj, "6" + "9");
@@ -770,11 +795,7 @@ export default {
       }
     };
 
-    const handleChange = ({ file, fileList }) => {
-      if (file.status !== "uploading") {
-        console.log(file, fileList);
-      }
-    };
+  
     const showAssessment = () => {
       state.assessmentVisible = true;
     };
@@ -877,7 +898,7 @@ export default {
       updateTask,
       disabledDateTime,
       clear,
-      handleChange,
+      changevalue,
       showAssessment,
       disabledDate,
    
@@ -963,7 +984,7 @@ export default {
             }
           }
         }
-
+  
         .main_item2 {
           display: flex;
           align-items: flex-start;
@@ -1056,7 +1077,7 @@ export default {
       }
 
       .main_right {
-        width: 337px;
+        width: 400px;
 
         .main_item {
           display: flex;
@@ -1089,6 +1110,49 @@ export default {
             }
           }
         }
+        .mbl_items {
+                display: flex;
+                align-items: center;
+                justify-content: flex-end;
+                margin-bottom: 10px;
+
+                .item_nam {
+                  width: 100px;
+                  display: flex;
+                  align-items: center;
+                  justify-content: flex-end;
+                  white-space: nowrap;
+
+                  .asterisk_icon {
+                    width: 10px;
+                    height: 10px;
+                    margin-right: 5px;
+                    margin-top: -15px;
+                  }
+                }
+
+                .item_inp {
+                  flex: 1;
+                  position: relative;
+
+                  .inp_num {
+                    position: absolute;
+                    left: 398px;
+                    top: 10px;
+                  }
+                  .accessory{
+                    margin-left: 92px;
+                  }
+                }
+             	 }
+            .tips{
+              font-size: 12px;
+              margin-top: 10px;
+            }
+            .mbl_items12{
+              width: 373px;
+              margin-left: 10px;
+            }
       }
     }