From 67dec00cf7c385b435d495112f1fe8f2fb6b9bbb Mon Sep 17 00:00:00 2001
From: JS-LM <2497833386@QQ.com>
Date: Fri, 16 Jun 2023 11:36:33 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=96=B0=E5=A2=9E=E8=BF=90?=
 =?UTF-8?q?=E8=90=A5=E5=95=86=E6=97=B6=E4=B8=8A=E4=BC=A0logo=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jsowell-ui/src/views/pile/merchant/index.vue | 941 +++++++++++--------
 1 file changed, 535 insertions(+), 406 deletions(-)

diff --git a/jsowell-ui/src/views/pile/merchant/index.vue b/jsowell-ui/src/views/pile/merchant/index.vue
index c90f5a579..86a23e514 100644
--- a/jsowell-ui/src/views/pile/merchant/index.vue
+++ b/jsowell-ui/src/views/pile/merchant/index.vue
@@ -1,428 +1,557 @@
 <template>
-  <div class="app-container">
-    <el-form
-      :model="queryParams"
-      ref="queryForm"
-      size="small"
-      :inline="true"
-      v-show="showSearch"
-      label-width="110px"
-    >
-      <el-form-item label="运营商名称" prop="merchantName">
-        <el-input
-          v-model="queryParams.merchantName"
-          placeholder="请输入运营商名称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button
-          type="primary"
-          icon="el-icon-search"
-          size="mini"
-          @click="handleQuery"
-          >搜索</el-button
+    <div class="app-container">
+        <el-form
+            :model="queryParams"
+            ref="queryForm"
+            size="small"
+            :inline="true"
+            v-show="showSearch"
+            label-width="110px"
         >
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
-          >重置</el-button
-        >
-      </el-form-item>
-    </el-form>
-
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['pile:merchant:add']"
-          >新增</el-button
-        >
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['pile:merchant:edit']"
-          >修改</el-button
-        >
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['pile:merchant:remove']"
-          >删除</el-button
-        >
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['pile:merchant:export']"
-          >导出</el-button
-        >
-      </el-col>
-      <right-toolbar
-        :showSearch.sync="showSearch"
-        @queryTable="getList"
-      ></right-toolbar>
-    </el-row>
-
-    <el-table
-      v-loading="loading"
-      :data="merchantList"
-      @selection-change="handleSelectionChange"
-    >
-      <el-table-column type="selection" width="55" align="center" />
-      <!--<el-table-column label="" align="center" prop="id" />-->
-      <el-table-column label="运营商名称" align="center" prop="merchantName" >
-         <template slot-scope="scope">
-          <router-link
-            :to="'/merchant/detail/index/'+scope.row.id"
-            class="link-type"
-          >
-            <span>{{ scope.row.merchantName }}</span>
-          </router-link>
-        </template>
-      </el-table-column>
-      <el-table-column label="地址" align="center" prop="address" />
-      <el-table-column label="状态" align="center" prop="status" />
-      <el-table-column
-        label="组织机构代码"
-        align="center"
-        prop="organizationCode"
-      />
-      <el-table-column label="负责人姓名" align="center" prop="managerName" />
-      <el-table-column
-        label="负责人电话号码"
-        align="center"
-        prop="managerPhone"
-      />
-      <el-table-column
-        label="客服电话号码"
-        align="center"
-        prop="servicePhone"
-      />
-      <el-table-column label="logo" align="center" prop="logoUrl" />
-      <el-table-column
-        label="操作"
-        align="center"
-        v-if="checkPermi(['pile:merchant:edit'])"
-        class-name="small-padding fixed-width"
-      >
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['pile:merchant:edit']"
-            >修改</el-button
-          >
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['pile:merchant:remove']"
-            >删除</el-button
-          >
-        </template>
-      </el-table-column>
-    </el-table>
-
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
-
-    <!-- 添加或修改充电桩运营商信息对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="110px">
-        <el-row>
-          <el-col span="12">
             <el-form-item label="运营商名称" prop="merchantName">
-              <el-input
-                v-model="form.merchantName"
-                placeholder="请输入运营商名称"
-              />
+                <el-input
+                    v-model="queryParams.merchantName"
+                    placeholder="请输入运营商名称"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+                />
             </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="组织机构代码" prop="organizationCode">
-              <el-input
-                v-model="form.organizationCode"
-                placeholder="请输入组织机构代码"
-              />
+            <el-form-item>
+                <el-button
+                    type="primary"
+                    icon="el-icon-search"
+                    size="mini"
+                    @click="handleQuery"
+                    >搜索</el-button
+                >
+                <el-button
+                    icon="el-icon-refresh"
+                    size="mini"
+                    @click="resetQuery"
+                    >重置</el-button
+                >
             </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col span="24">
-            <el-form-item label="地址" prop="address">
-              <el-input v-model="form.address" placeholder="请输入地址" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="负责人姓名" prop="managerName">
-              <el-input
-                v-model="form.managerName"
-                placeholder="请输入负责人姓名"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="负责人电话号码" prop="managerPhone">
-              <el-input
-                v-model="form.managerPhone"
-                placeholder="请输入负责人电话号码"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="客服电话号码" prop="servicePhone">
-              <el-input
-                v-model="form.servicePhone"
-                placeholder="请输入客服电话号码"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col span="12">
-            <el-form-item label="logo" prop="logoUrl">
-              <el-input v-model="form.logoUrl" placeholder="请输入logo" />
-            </el-form-item>
-          </el-col>
+        </el-form>
+
+        <el-row :gutter="10" class="mb8">
+            <el-col :span="1.5">
+                <el-button
+                    type="primary"
+                    plain
+                    icon="el-icon-plus"
+                    size="mini"
+                    @click="handleAdd"
+                    v-hasPermi="['pile:merchant:add']"
+                    >新增</el-button
+                >
+            </el-col>
+            <el-col :span="1.5">
+                <el-button
+                    type="success"
+                    plain
+                    icon="el-icon-edit"
+                    size="mini"
+                    :disabled="single"
+                    @click="handleUpdate"
+                    v-hasPermi="['pile:merchant:edit']"
+                    >修改</el-button
+                >
+            </el-col>
+            <el-col :span="1.5">
+                <el-button
+                    type="danger"
+                    plain
+                    icon="el-icon-delete"
+                    size="mini"
+                    :disabled="multiple"
+                    @click="handleDelete"
+                    v-hasPermi="['pile:merchant:remove']"
+                    >删除</el-button
+                >
+            </el-col>
+            <el-col :span="1.5">
+                <el-button
+                    type="warning"
+                    plain
+                    icon="el-icon-download"
+                    size="mini"
+                    @click="handleExport"
+                    v-hasPermi="['pile:merchant:export']"
+                    >导出</el-button
+                >
+            </el-col>
+            <right-toolbar
+                :showSearch.sync="showSearch"
+                @queryTable="getList"
+            ></right-toolbar>
         </el-row>
 
-        <el-row>
-          <el-col span="12">
-            <el-form-item label="小程序APPID" prop="appId">
-              <el-input
-                v-model="form.appId"
-                placeholder="请输入小程序APPID"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-table
+            v-loading="loading"
+            :data="merchantList"
+            @selection-change="handleSelectionChange"
+        >
+            <el-table-column type="selection" width="55" align="center" />
+            <!--<el-table-column label="" align="center" prop="id" />-->
+            <el-table-column
+                label="运营商名称"
+                align="center"
+                prop="merchantName"
+            >
+                <template slot-scope="scope">
+                    <router-link
+                        :to="'/merchant/detail/index/' + scope.row.id"
+                        class="link-type"
+                    >
+                        <span>{{ scope.row.merchantName }}</span>
+                    </router-link>
+                </template>
+            </el-table-column>
+            <el-table-column label="地址" align="center" prop="address" />
+            <el-table-column label="状态" align="center" prop="status" />
+            <el-table-column
+                label="组织机构代码"
+                align="center"
+                prop="organizationCode"
+            />
+            <el-table-column
+                label="负责人姓名"
+                align="center"
+                prop="managerName"
+            />
+            <el-table-column
+                label="负责人电话号码"
+                align="center"
+                prop="managerPhone"
+            />
+            <el-table-column
+                label="客服电话号码"
+                align="center"
+                prop="servicePhone"
+            />
+            <el-table-column label="logo" align="center" prop="logoUrl" >
+              <template slot-scope="scope">
+<el-image style="width: 100px; height: 100px"
+                :src="scope.row.logoUrl"></el-image>
+              </template>
+              
+            </el-table-column>
+            <el-table-column
+                label="操作"
+                align="center"
+                v-if="checkPermi(['pile:merchant:edit'])"
+                class-name="small-padding fixed-width"
+            >
+                <template slot-scope="scope">
+                    <el-button
+                        size="mini"
+                        type="text"
+                        icon="el-icon-edit"
+                        @click="handleUpdate(scope.row)"
+                        v-hasPermi="['pile:merchant:edit']"
+                        >修改</el-button
+                    >
+                    <el-button
+                        size="mini"
+                        type="text"
+                        icon="el-icon-delete"
+                        @click="handleDelete(scope.row)"
+                        v-hasPermi="['pile:merchant:remove']"
+                        >删除</el-button
+                    >
+                </template>
+            </el-table-column>
+        </el-table>
 
-        <!--<el-form-item label="删除标识" prop="delFlag">
+        <pagination
+            v-show="total > 0"
+            :total="total"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getList"
+        />
+
+        <!-- 添加或修改充电桩运营商信息对话框 -->
+        <el-dialog
+            :title="title"
+            :visible.sync="open"
+            width="50%"
+            append-to-body
+            :before-close="closeBefore"
+        >
+            <el-form
+                ref="form"
+                :model="form"
+                :rules="rules"
+                label-width="200px"
+            >
+                <el-row>
+                    <el-col :span="12">
+                        <el-form-item label="运营商名称" prop="merchantName">
+                            <el-input
+                                v-model="form.merchantName"
+                                placeholder="请输入运营商名称"
+                            />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item
+                            label="组织机构代码"
+                            prop="organizationCode"
+                        >
+                            <el-input
+                                v-model="form.organizationCode"
+                                placeholder="请输入组织机构代码"
+                            />
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+                <el-form-item label="地址" prop="address">
+                            <el-input
+                                v-model="form.address"
+                                placeholder="请输入地址"
+                            />
+                        </el-form-item>
+                <!-- <el-row>
+                    <el-col span="24">
+                        
+                    </el-col>
+                </el-row> -->
+                <el-row>
+                    <el-col :span="12">
+                        <el-form-item label="负责人姓名" prop="managerName">
+                            <el-input
+                                v-model="form.managerName"
+                                placeholder="请输入负责人姓名"
+                            />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item
+                            label="负责人电话号码"
+                            prop="managerPhone"
+                        >
+                            <el-input
+                                v-model="form.managerPhone"
+                                placeholder="请输入负责人电话号码"
+                            />
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+                <el-row>
+                    <el-col :span="12">
+                        <el-form-item label="客服电话号码" prop="servicePhone">
+                            <el-input
+                                v-model="form.servicePhone"
+                                placeholder="请输入客服电话号码"
+                            />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="小程序APPID" prop="appId">
+                            <el-input
+                                v-model="form.appId"
+                                placeholder="请输入小程序APPID"
+                            />
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+                <el-form-item label="logo" prop="logoUrl">
+                    <el-upload
+                        class="upload-demo"
+                        :action="actionUrl"
+                        :headers="headers"
+                        :on-success="handleSuccess"
+                        :on-preview="handlePreview"
+                        :on-remove="handleRemove"
+                        :file-list="fileList"
+                        list-type="picture"
+                        :limit="1"
+                        :on-exceed="handleExceed"
+                    >
+                        <el-button size="small" type="primary"
+                            >点击上传</el-button
+                        >
+                        <div slot="tip" class="el-upload__tip">
+                            只能上传jpg/png文件，且不超过500kb
+                        </div>
+                    </el-upload>
+                    <!-- <el-input v-model="form.logoUrl" placeholder="" /> -->
+                </el-form-item>
+
+                <!-- <el-row>
+            <el-col span="12">
+            
+          </el-col>
+
+        
+        </el-row> -->
+
+                <!--<el-form-item label="删除标识" prop="delFlag">
           <el-input v-model="form.delFlag" placeholder="请输入删除标识" />
         </el-form-item>-->
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
-  </div>
+            </el-form>
+            <div slot="footer" class="dialog-footer">
+                <el-button type="primary" @click="submitForm" >确 定</el-button>
+                <el-button @click="cancel">取 消</el-button>
+            </div>
+        </el-dialog>
+    </div>
 </template>
 
 <script>
 import {
-  listMerchant,
-  getMerchant,
-  delMerchant,
-  addMerchant,
-  updateMerchant,
+    listMerchant,
+    getMerchant,
+    delMerchant,
+    addMerchant,
+    updateMerchant,
 } from "@/api/pile/merchant";
-import {checkPermi} from "@/utils/permission";
-
+import { checkPermi } from "@/utils/permission";
+import { getToken } from "@/utils/auth";
 export default {
-  name: "Merchant",
-  data() {
-    return {
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 充电桩运营商信息表格数据
-      merchantList: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        merchantName: null,
-        address: null,
-        status: null,
-        organizationCode: null,
-        managerName: null,
-        managerPhone: null,
-        servicePhone: null,
-        logoUrl: null,
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-        merchantName: [
-          { required: true, message: "请输入运营商名称", trigger: "blur" },
-        ],
-        organizationCode: [
-          { required: true, message: "请输入组织机构代码", trigger: "blur" },
-        ],
-        address: [{ required: true, message: "请输入地址", trigger: "blur" }],
-        managerName: [
-          { required: true, message: "请输入负责人姓名", trigger: "blur" },
-        ],
-        managerPhone: [
-          { required: true, message: "请输入负责人电话号码", trigger: "blur" },
-        ],
-        servicePhone: [
-          { required: true, message: "请输入客服电话号码", trigger: "blur" },
-        ],
-        logoUrl: [{ required: true, message: "请输入logo", trigger: "blur" }],
-      },
-    };
-  },
-  created() {
-    this.getList();
-  },
-  methods: {
-    checkPermi,
-    /** 查询充电桩运营商信息列表 */
-    getList() {
-      this.loading = true;
-      listMerchant(this.queryParams).then((response) => {
-        this.merchantList = response.rows;
-        this.total = response.total;
-        this.loading = false;
-      });
+    name: "Merchant",
+    data() {
+        return {
+            actionUrl: process.env.VUE_APP_BASE_API + "/common/uploadOSS",
+            dialogImageUrl: "",
+            headers: {
+                Authorization: "Bearer " + getToken(),
+            },
+            imageUrl: null,
+            fileList: [],
+            // 遮罩层
+            loading: true,
+            // 选中数组
+            ids: [],
+            // 非单个禁用
+            single: true,
+            // 非多个禁用
+            multiple: true,
+            // 显示搜索条件
+            showSearch: true,
+            // 总条数
+            total: 0,
+            // 充电桩运营商信息表格数据
+            merchantList: [],
+            // 弹出层标题
+            title: "",
+            // 是否显示弹出层
+            open: false,
+            // 查询参数
+            queryParams: {
+                pageNum: 1,
+                pageSize: 10,
+                merchantName: null,
+                address: null,
+                status: null,
+                organizationCode: null,
+                managerName: null,
+                managerPhone: null,
+                servicePhone: null,
+                logoUrl: null,
+            },
+            // 表单参数
+            form: {},
+            // 表单校验
+            rules: {
+                merchantName: [
+                    {
+                        required: true,
+                        message: "请输入运营商名称",
+                        trigger: "blur",
+                    },
+                ],
+                organizationCode: [
+                    {
+                        required: true,
+                        message: "请输入组织机构代码",
+                        trigger: "blur",
+                    },
+                ],
+                address: [
+                    { required: true, message: "请输入地址", trigger: "blur" },
+                ],
+                managerName: [
+                    {
+                        required: true,
+                        message: "请输入负责人姓名",
+                        trigger: "blur",
+                    },
+                ],
+                managerPhone: [
+                    {
+                        required: true,
+                        message: "请输入负责人电话号码",
+                        trigger: "blur",
+                    },
+                ],
+                servicePhone: [
+                    {
+                        required: true,
+                        message: "请输入客服电话号码",
+                        trigger: "blur",
+                    },
+                ],
+                logoUrl: [
+                    { required: true, message: "请输入logo", trigger: "blur" },
+                ],
+            },
+        };
     },
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
+    created() {
+        this.getList();
     },
-    // 表单重置
-    reset() {
-      this.form = {
-        id: null,
-        merchantName: null,
-        address: null,
-        status: "0",
-        organizationCode: null,
-        managerName: null,
-        managerPhone: null,
-        servicePhone: null,
-        logoUrl: null,
-        createBy: null,
-        createTime: null,
-        updateBy: null,
-        updateTime: null,
-        delFlag: null,
-      };
-      this.resetForm("form");
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    // 多选框选中数据
-    handleSelectionChange(selection) {
-      this.ids = selection.map((item) => item.id);
-      this.single = selection.length !== 1;
-      this.multiple = !selection.length;
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加运营商信息";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset();
-      const id = row.id || this.ids;
-      getMerchant(id).then((response) => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改运营商信息";
-      });
-    },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate((valid) => {
-        if (valid) {
-          if (this.form.id != null) {
-            updateMerchant(this.form).then((response) => {
-              this.$modal.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            });
-          } else {
-            addMerchant(this.form).then((response) => {
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            });
-          }
-        }
-      });
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const ids = row.id || this.ids;
-      this.$modal
-        .confirm('是否确认删除充电桩运营商信息编号为"' + ids + '"的数据项？')
-        .then(function () {
-          return delMerchant(ids);
-        })
-        .then(() => {
-          this.getList();
-          this.$modal.msgSuccess("删除成功");
-        })
-        .catch(() => {});
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download(
-        "pile/merchant/export",
-        {
-          ...this.queryParams,
+    methods: {
+        checkPermi,
+        closeBefore(){
+          this.open = false
+          this.fileList = []
+        },
+        handleExceed(files, fileList) {
+            this.$message.warning(
+                `当前限制选择 1 个文件，本次选择了 ${
+                    files.length
+                } 个文件，共选择了 ${files.length + fileList.length} 个文件`
+            );
+        },
+        handleSuccess(res, file) {
+            this.imageUrl = URL.createObjectURL(file.raw);
+            console.log("图片上传成功 url：", this.imageUrl);
+            console.log("图片上传成功 res：", res);
+            this.fileList.push({ url: res.url });
+            this.form.logoUrl = res.url
+        },
+        handleRemove(file, fileList) {
+            console.log("移除图片", file, fileList);
+            // 从pics数组中，找到图片对应的索引值
+            const i = this.fileList.findIndex((x) => x.uid === file.uid);
+            // 调用splice方法，移除图片信息
+            this.fileList.splice(i, 1);
+        },
+        handlePreview(file) {
+            // console.log(file);
+            this.dialogImageUrl = file.url;
+            console.log(this.dialogImageUrl);
+            this.dialogVisible = true;
+        },
+        /** 查询充电桩运营商信息列表 */
+        getList() {
+            this.loading = true;
+            listMerchant(this.queryParams).then((response) => {
+                this.merchantList = response.rows;
+                  console.log('this.merchantList',this.merchantList)
+                this.total = response.total;
+                this.loading = false;
+            });
+        },
+        // 取消按钮
+        cancel() {
+            this.open = false;
+            this.fileList = []
+            this.reset();
+        },
+        // 表单重置
+        reset() {
+            this.form = {
+                id: null,
+                merchantName: null,
+                address: null,
+                status: "0",
+                organizationCode: null,
+                managerName: null,
+                managerPhone: null,
+                servicePhone: null,
+                logoUrl: null,
+                createBy: null,
+                createTime: null,
+                updateBy: null,
+                updateTime: null,
+                delFlag: null,
+            };
+            this.resetForm("form");
+        },
+        /** 搜索按钮操作 */
+        handleQuery() {
+            this.queryParams.pageNum = 1;
+            this.getList();
+        },
+        /** 重置按钮操作 */
+        resetQuery() {
+            this.resetForm("queryForm");
+            this.handleQuery();
+        },
+        // 多选框选中数据
+        handleSelectionChange(selection) {
+            this.ids = selection.map((item) => item.id);
+            this.single = selection.length !== 1;
+            this.multiple = !selection.length;
+        },
+        /** 新增按钮操作 */
+        handleAdd() {
+            this.reset();
+            this.open = true;
+            this.title = "添加运营商信息";
+        },
+        /** 修改按钮操作 */
+        handleUpdate(row) {
+            this.fileList = []
+             this.fileList.push({"url": row.logoUrl});
+            this.reset();
+            const id = row.id || this.ids;
+            getMerchant(id).then((response) => {
+                this.form = response.data;
+                this.open = true;
+                this.title = "修改运营商信息";
+            });
+        },
+        /** 提交按钮 */
+        submitForm() {
+          console.log('this.form',this.form,this.form.logoUrl )
+            this.$refs["form"].validate((valid) => {
+                if (valid) {
+                    if (this.form.id != null) {
+                        updateMerchant(this.form).then((response) => {
+                            this.$modal.msgSuccess("修改成功");
+                            this.open = false;
+                            this.getList();
+                        });
+                    } else {
+                        addMerchant(this.form).then((response) => {
+                            this.$modal.msgSuccess("新增成功");
+                            this.open = false;
+                            this.getList();
+                        });
+                    }
+                }
+            });
+        },
+        /** 删除按钮操作 */
+        handleDelete(row) {
+            const ids = row.id || this.ids;
+            this.$modal
+                .confirm(
+                    '是否确认删除充电桩运营商信息编号为"' + ids + '"的数据项？'
+                )
+                .then(function () {
+                    return delMerchant(ids);
+                })
+                .then(() => {
+                    this.getList();
+                    this.$modal.msgSuccess("删除成功");
+                })
+                .catch(() => {});
+        },
+        /** 导出按钮操作 */
+        handleExport() {
+            this.download(
+                "pile/merchant/export",
+                {
+                    ...this.queryParams,
+                },
+                `merchant_${new Date().getTime()}.xlsx`
+            );
         },
-        `merchant_${new Date().getTime()}.xlsx`
-      );
     },
-  },
 };
 </script>