图片上传完成

src/components/uploadImg/uploadImg.vue

@@ -1,6 +1,5 @@
 <template>
     <div>
-        <!-- :action="http://115.238.57.190:8010/farm-huyang/common/pic" -->
         <el-upload
             class="avatar-uploader"
             :action="serverAddress+'/farm-huyang/common/pic'"
@@ -9,27 +8,31 @@
             :show-file-list="false"
             :on-success="handleAvatarSuccess"
             :before-upload="beforeAvatarUpload"
+            :on-remove="handleRemove"
+            :on-preview="handlePictureCardPreview"
         >
             <img v-if="imgUrl || imageUrl" :src="imgUrl || imageUrl" class="avatar" />
-            <!-- <img v-if="imageUrl" :src="imageUrl" class="avatar" /> -->
             <i v-else class="el-icon-plus avatar-uploader-icon"></i>
         </el-upload>
+        <el-dialog :visible.sync="dialogVisible" append-to-body>
+            <img width="100%" :src="imgUrl || imageUrl" alt />
+        </el-dialog>
+        <el-link type="primary" @click="dialogVisible=true">查看大图</el-link>
     </div>
 </template>
 
 
 <script>
 import { reqUploadImg } from "@/api/material.js";
-import config from '@/sdk/config'
-const { serverAddress } = config
-// http://192.168.1.5:8016/files/2ceed3f6bfbfd9fc6d6c9b8c455158ec-1000.jpg  $attrs.value
-// http://192.168.1.5:8016/files/v2-996be5e52e4b43d08ae6ca8cae80b0fd_r.jpg
-// http://192.168.1.5:8016/files/v2-a862735c06feb9edce4369859daf5c12_r.jpg
+import config from "@/sdk/config";
+const { serverAddress } = config;
+
 export default {
     data() {
         return {
             imageUrl: "",
-            serverAddress
+            serverAddress,
+            dialogVisible: false
         };
     },
     props: {
@@ -38,7 +41,7 @@ export default {
     watch: {
         value(v, ov) {
             console.log(v);
-            this.imageUrl = ''
+            this.imageUrl = "";
         }
     },
     computed: {
@@ -47,20 +50,26 @@ export default {
         }
     },
     beforeCreate() {
-        this.token = localStorage.getItem("token")
+        this.token = localStorage.getItem("token");
     },
     created() {},
     methods: {
         handleAvatarSuccess(res, file) {
-            console.log('===========')
-            console.log(res)
+            console.log("===========");
+            console.log(res);
             this.$emit("on-msg", res);
             this.imageUrl = URL.createObjectURL(file.raw);
         },
+        handleRemove(file, fileList) {
+            console.log(file, fileList);
+        },
+        handlePictureCardPreview(file) {
+            this.dialogImageUrl = file.url;
+            this.dialogVisible = true;
+        },
         beforeAvatarUpload(file) {
             // const isJPG = file.type === "image/jpeg";
             // const isLt2M = file.size / 1024 / 1024 < 2;
-
             // if (!isJPG) {
             //     this.$message.error("上传头像图片只能是 JPG 格式!");
             // }

src/views/material/basicsInfo.vue

@@ -29,20 +29,18 @@
                     </el-table-column>
                     <el-table-column prop="id" label="序号" width="60"></el-table-column>
                     <el-table-column prop="name" label="名称"></el-table-column>
-                    <el-table-column prop="specifications" label="规格" width="60"></el-table-column>
-                    <el-table-column label="有效期限" width="100">
+                    <el-table-column label="有效期限">
                         <template v-slot="scope">
                             <div>{{ scope.row['periodOfValidity'] + CPeriodOfValidityUnit(scope.row['unit'])}}</div>
                         </template>
                     </el-table-column>
-                    <el-table-column prop="usageIntro" label="用法"></el-table-column>
                     <el-table-column prop="safeThreshold" label="安全库存">
                         <template v-slot="scope">
                             <div>{{ scope.row['safeThreshold'] + scope.row['specifications']}}</div>
                         </template>
                     </el-table-column>
                     <el-table-column prop="factory" label="厂家"></el-table-column>
-                    <el-table-column prop="img" label="图片"></el-table-column>
+                    <!-- <el-table-column prop="img" label="图片"></el-table-column> -->
                     <el-table-column prop="status" label="状态">
                         <template v-slot="scope">
                             <div v-for="item in $store.state['drugStatus']" :key="item.value">
@@ -50,6 +48,7 @@
                             </div>
                         </template>
                     </el-table-column>
+                    <el-table-column prop="usageIntro" label="用法"></el-table-column>
                     <el-table-column label="操作" width="150">
                         <template v-slot="scope">
                             <el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
@@ -112,26 +111,20 @@
                                 </el-col>
                             </el-row>
                         </el-form-item>
-                        <el-form-item label="用法">
-                            <el-input v-model="formData.usageIntro"></el-input>
-                        </el-form-item>
                         <el-form-item label="厂家">
                             <el-input v-model="formData.factory"></el-input>
                         </el-form-item>
+                        <el-form-item label="用法">
+                            <el-input type="textarea" autosize v-model="formData.usageIntro"></el-input>
+                        </el-form-item>
                         <el-form-item label="注意事项">
                             <el-input type="textarea" autosize v-model="formData.note"></el-input>
                         </el-form-item>
-                        <!-- <el-form-item label="图片地址">
-                            <el-input v-model="formData.img"></el-input>
-                        </el-form-item> -->
                         <el-form-item label="图片地址">
                             <uploadImg v-model="formData.img" @on-msg="onMsg"></uploadImg>
                         </el-form-item>
-                        <!-- <el-form-item label="图片地址">
-                            <input @change="cc" type="file" value="">
-                        </el-form-item> -->
                         <el-form-item label="状态">
-                            <el-radio-group v-model="formData.density">
+                            <el-radio-group v-model="formData.status">
                                 <el-radio
                                     v-for="item in $store.state['drugStatus']"
                                     :key="item.value"
@@ -185,7 +178,7 @@ export default {
                 factory: "xx药厂",
                 note: "",
                 img: "",
-                density: this.$store.state["drugStatus"][1].value
+                status: this.$store.state["drugStatus"][1].value
             },
             isAdd: false,
             rules
@@ -199,7 +192,6 @@ export default {
     methods: {
         
         onMsg(imgUrl) {
-            console.log(imgUrl)
             this.formData.img = imgUrl
         },
         submitForm(formName) {
@@ -251,7 +243,7 @@ export default {
                 factory: "xx药厂",
                 note: "",
                 img: "",
-                density: this.$store.state["drugStatus"][1].value
+                status: this.$store.state["drugStatus"][1].value
             }
         },
         edit(row) {