运营商管理点击查看大图

jsowell-ui/src/views/pile/merchant/index.vue

@@ -131,10 +131,13 @@
             />
             <el-table-column label="公司logo" align="center" prop="logoUrl">
                 <template slot-scope="scope">
-<el-image style="width: 100px; height: 100px"
+                    <el-image
-                :src="scope.row.logoUrl"></el-image>
+                        style="width: 100px; height: 100px"
+                        :src="scope.row.logoUrl"
+                        :preview-src-list="[scope.row.logoUrl]"
+                        fit="fill"
+                    ></el-image>
                 </template>
-
             </el-table-column>
             <el-table-column
                 label="操作"
@@ -207,10 +210,7 @@
                     </el-col>
                 </el-row>
                 <el-form-item label="地址" prop="address">
-                            <el-input
+                    <el-input v-model="form.address" placeholder="请输入地址" />
-                                v-model="form.address"
-                                placeholder="请输入地址"
-                            />
                 </el-form-item>
                 <!-- <el-row>
                     <el-col span="24">
@@ -280,15 +280,23 @@
                 </el-form-item>
 
                 <el-row>
-                    <el-divider>填入运营商管理员账号和密码，则自动创建一个该运营商的管理员账号</el-divider>
+                    <el-divider
+                        >填入运营商管理员账号和密码，则自动创建一个该运营商的管理员账号</el-divider
+                    >
                     <el-col :span="12">
                         <el-form-item label="运营商管理员账号" prop="userName">
-                            <el-input v-model="form.userName" placeholder="请输入运营商管理员账号"/>
+                            <el-input
+                                v-model="form.userName"
+                                placeholder="请输入运营商管理员账号"
+                            />
                         </el-form-item>
                     </el-col>
                     <el-col :span="12">
                         <el-form-item label="运营商管理员密码" prop="password">
-                            <el-input v-model="form.password" placeholder="请输入运营商管理员密码"/>
+                            <el-input
+                                v-model="form.password"
+                                placeholder="请输入运营商管理员密码"
+                            />
                         </el-form-item>
                     </el-col>
                 </el-row>
@@ -363,14 +371,19 @@ export default {
                         message: "请输入运营商名称",
                         trigger: "blur",
                     },
-                    { min: 1, max: 35, message: '长度在 1 到 35 个字符', trigger: 'blur' }
+                    {
+                        min: 1,
+                        max: 35,
+                        message: "长度在 1 到 35 个字符",
+                        trigger: "blur",
+                    },
                 ],
                 organizationCode: [
                     {
                         required: true,
                         message: "请输入组织机构代码",
                         trigger: "blur",
-                    }
+                    },
                 ],
                 address: [
                     { required: true, message: "请输入地址", trigger: "blur" },
@@ -397,7 +410,11 @@ export default {
                     },
                 ],
                 logoUrl: [
-                    { required: true, message: "请上传公司logo", trigger: "blur" },
+                    {
+                        required: true,
+                        message: "请上传公司logo",
+                        trigger: "blur",
+                    },
                 ],
             },
         };
@@ -408,8 +425,8 @@ export default {
     methods: {
         checkPermi,
         closeBefore() {
-          this.open = false
+            this.open = false;
-          this.fileList = []
+            this.fileList = [];
         },
         handleExceed(files, fileList) {
             this.$message.warning(
@@ -423,7 +440,7 @@ export default {
             console.log("图片上传成功 url：", this.imageUrl);
             console.log("图片上传成功 res：", res);
             this.fileList.push({ url: res.url });
-            this.form.logoUrl = res.url
+            this.form.logoUrl = res.url;
         },
         handleRemove(file, fileList) {
             console.log("移除图片", file, fileList);
@@ -443,7 +460,10 @@ export default {
             this.loading = true;
             listMerchant(this.queryParams).then((response) => {
                 this.merchantList = response.rows;
-                  console.log('this.merchantList',this.merchantList)
+                // console.log(response.rows[0].logoUrl,222222222);
+                // this.srcList=response.rows[0].logoUrl;
+                // console.log(this.srcList,222222222);
+                console.log("this.merchantList", this.merchantList);
                 this.total = response.total;
                 this.loading = false;
             });
@@ -451,7 +471,7 @@ export default {
         // 取消按钮
         cancel() {
             this.open = false;
-            this.fileList = []
+            this.fileList = [];
             this.reset();
         },
         // 表单重置
@@ -498,8 +518,8 @@ export default {
         },
         /** 修改按钮操作 */
         handleUpdate(row) {
-            this.fileList = []
+            this.fileList = [];
-             this.fileList.push({"url": row.logoUrl});
+            this.fileList.push({ url: row.logoUrl });
             this.reset();
             const id = row.id || this.ids;
             getMerchant(id).then((response) => {
@@ -510,7 +530,7 @@ export default {
         },
         /** 提交按钮 */
         submitForm() {
-          console.log('this.form',this.form,this.form.logoUrl )
+            console.log("this.form", this.form, this.form.logoUrl);
             this.$refs["form"].validate((valid) => {
                 if (valid) {
                     if (this.form.id != null) {