油站信息

src/views/station/adjustment/index.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="tabZujian">
     <el-tabs v-model="activeName" >
-      <el-tab-pane label="油站信息" name="adjust" key="adjust">
+      <el-tab-pane label="油品管理" name="adjust" key="adjust">
         <adjust/>
       </el-tab-pane>
-      <el-tab-pane label="支付配置" name="record" key="record">
+      <el-tab-pane label="调价记录" name="record" key="record">
         <record/>
       </el-tab-pane>
     </el-tabs>

src/views/station/configuration/info.vue

@@ -2,178 +2,84 @@
   <div class="app-container">
     <el-row>
       <el-col :span="24">
-        <el-card :body-style="{ padding: '20px', margin: '0 auto'}">
+        <el-card :body-style="{ padding: '20px', margin: '0 auto' }">
           <div class="imgbox">
-            <img
-              src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
-              class="image"
-              style="margin: 0 auto"
-            />
-          </div>
-
-          <el-form ref="form" :model="form" :rules="rules" label-width="auto" width="">
-            <el-form-item label="油站名称" prop="deptName">
-              <el-input v-model="form.deptName" placeholder="请输入油站名称" />
-            </el-form-item>
-            <el-form-item label="油站地址" prop="deptAddress">
-              <el-input
-                v-model="form.deptAddress"
-                placeholder="请输入油站地址"
+            <el-upload
+              class="uploader"
+              :action="addressUrl"
+              :show-file-list="false"
+              :headers="headers"
+              :on-success="handleAvatarSuccess"
+              :before-upload="beforeAvatarUpload"
+              :disabled="editable"
+            >
+              <img
+                v-if="form.stationPic"
+                :src="form.stationPic"
+                class="avatar"
               />
-            </el-form-item>
-            <el-form-item label="联系人" prop="leader">
-              <el-input v-model="form.leader" placeholder="请输入联系人" />
-            </el-form-item>
-            <el-form-item label="电话" prop="phone">
-              <el-input v-model="form.phone" placeholder="请输入电话" />
-            </el-form-item>
-          </el-form>
+              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+              <div class="el-upload__tip" slot="tip" v-show="!editable">
+                点击图片可以重新上传
+              </div>
+            </el-upload>
+          </div>
+          <div class="station">
+            <el-form ref="form" :model="form" :rules="rules" label-width="auto">
+              <el-form-item label="油站名称" prop="deptName">
+                <el-input
+                  v-model="form.deptName"
+                  placeholder="请输入油站名称"
+                  :disabled="editable"
+                />
+              </el-form-item>
+              <el-form-item label="油站地址" prop="deptAddress">
+                <el-input
+                  v-model="form.deptAddress"
+                  placeholder="请输入油站地址"
+                  :disabled="editable"
+                />
+              </el-form-item>
+              <el-form-item label="联系人" prop="leader">
+                <el-input
+                  v-model="form.leader"
+                  placeholder="请输入联系人"
+                  :disabled="editable"
+                />
+              </el-form-item>
+              <el-form-item label="电话" prop="phone">
+                <el-input
+                  v-model="form.phone"
+                  placeholder="请输入电话"
+                  :disabled="editable"
+                />
+              </el-form-item>
+            </el-form>
+            <el-button
+              type="primary"
+              size="small"
+              @click="
+                () => {
+                  this.editable = !editable;
+                }
+              "
+            >
+              {{ editable ? "修改资料" : "取消保存" }}
+            </el-button>
+            <el-button
+              type="primary"
+              size="small"
+              v-show="!editable"
+              @click="submitForm"
+            >
+              保存资料
+            </el-button>
+          </div>
         </el-card>
       </el-col>
     </el-row>
 
-    <el-table
-      v-loading="loading"
-      :data="infoList"
-      @selection-change="handleSelectionChange"
-    >
-      <el-table-column
-        v-if="false"
-        label="自增主键id"
-        align="center"
-        prop="deptId"
-      />
-      <el-table-column label="油站名称" align="center" prop="deptName" />
-      <el-table-column label="油站地址" align="center" prop="deptAddress" />
-      <el-table-column label="联系人" align="center" prop="leader" />
-      <el-table-column label="电话" align="center" prop="phone" />
-      <el-table-column
-        v-if="false"
-        label="集团id"
-        align="center"
-        prop="stationGroupId"
-      />
-      <el-table-column
-        v-if="false"
-        label="集团名称"
-        align="center"
-        prop="stationGroupName"
-      />
-      <el-table-column
-        v-if="false"
-        label="油站照片"
-        align="center"
-        prop="stationPic"
-      />
-      <el-table-column
-        label="油站经度"
-        align="center"
-        prop="stationLongitude"
-      />
-      <el-table-column label="油站纬度" align="center" prop="stationLatitude" />
-      <el-table-column label="商户编码" align="center" prop="mno" />
-      <el-table-column
-        label="操作"
-        align="c--enter"
-        class-name="small-padding fixed-width"
-      >
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            >修改</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="500px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="90px">
-        <el-form-item label="油站形象照" prop="stationPic">
-          <el-upload
-            class="avatar-uploader"
-            :action="addressUrl"
-            :show-file-list="false"
-            :headers="headers"
-            :on-success="handleAvatarSuccess"
-            :before-upload="beforeAvatarUpload"
-          >
-            <img
-              v-if="form.stationPic"
-              :src="form.stationPic"
-              style="width: 150px; height: 150px"
-              class="avatar"
-            />
-            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
-            <div class="el-upload__tip" slot="tip">
-              点击图片重新上传，只能上传jpg/png文件，图片大小不超过2M
-            </div>
-          </el-upload>
-        </el-form-item>
-        <el-form-item label="油站名称" prop="deptName">
-          <el-input v-model="form.deptName" placeholder="请输入油站名称" />
-        </el-form-item>
-        <el-form-item label="油站地址" prop="deptAddress">
-          <el-input v-model="form.deptAddress" placeholder="请输入油站地址" />
-        </el-form-item>
-        <el-form-item label="联系人" prop="leader">
-          <el-input v-model="form.leader" placeholder="请输入联系人" />
-        </el-form-item>
-        <el-form-item label="电话" prop="phone">
-          <el-input v-model="form.phone" placeholder="请输入电话" />
-        </el-form-item>
-        <el-form-item label="油站经度" prop="stationLongitude">
-          <el-input
-            v-model="form.stationLongitude"
-            :disabled="true"
-            placeholder="请输入油站经度"
-          />
-        </el-form-item>
-        <el-form-item label="油站纬度" prop="stationLatitude">
-          <el-input
-            v-model="form.stationLatitude"
-            :disabled="true"
-            placeholder="请输入油站纬度"
-          />
-        </el-form-item>
-        <el-form-item label="商户编码" prop="mno">
-          <el-input
-            v-model="form.mno"
-            :disabled="true"
-            placeholder="请输入商户编码"
-          />
-        </el-form-item>
-        <el-form-item label="小程序appid" prop="appId">
-          <el-input
-            v-model="form.appId"
-            :disabled="true"
-            placeholder="小程序appid"
-          />
-        </el-form-item>
-        <el-form-item label="小程序appSecret" prop="appSecret">
-          <el-input
-            v-model="form.appSecret"
-            :disabled="true"
-            placeholder="小程序appSecret"
-          />
-        </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>
 </template>
 
@@ -194,21 +100,22 @@ export default {
   name: "Info",
   components: { Treeselect },
   data() {
+    var validatorPhone = (rule, value, callback) => {
+      if (!value) {
+        return callback(new Error("手机号不能为空"));
+      } else {
+        const reg = /^1[3|4|5|7|8][0-9]\d{8}$/;
+        if (reg.test(value)) {
+          callback();
+        } else {
+          return callback(new Error("请输入正确的手机号"));
+        }
+      }
+    };
     return {
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
+      editable: true,
       // 总条数
       total: 0,
-      // 油站信息表格数据
-      infoList: [],
       // 部门树选项
       deptOptions: undefined,
       // 弹出层标题
@@ -229,12 +136,25 @@ export default {
         stationLongitude: null,
         stationLatitude: null,
         mno: null,
-        deptId: null,
+        deptId: this.deptId,
       },
       // 表单参数
       form: {},
       // 表单校验
-      rules: {},
+      rules: {
+        deptName:[
+          { required: true, message: '请填写油站名', trigger: 'blur' }
+        ],
+        deptAddress:[
+          { required: true, message: '请填写活动形式', trigger: 'blur' }
+        ],
+        leader:[
+          { required: true, message: '请填写联系人', trigger: 'blur' }
+        ],
+        phone:[
+          { validator: validatorPhone, required: true, trigger: 'blur' }
+        ]
+      },
       imageUrl: "",
       headers: { Authorization: "Bearer " + getToken() },
       addressUrl:
@@ -247,121 +167,35 @@ export default {
   },
   created() {
     this.getList();
-    this.getTreeselect();
   },
 
   methods: {
     /** 查询油站信息列表 */
     getList() {
-      this.loading = true;
-      this.queryParams.deptId = this.$store.selectDeptId;
-      if (this.queryParams.deptId == null || this.queryParams.deptId == "") {
-        this.queryParams.deptId = this.$store.state.user.deptId;
-      }
       listInfo(this.queryParams).then((response) => {
-        this.infoList = response.rows;
-        this.total = response.total;
-        this.loading = false;
-      });
-    },
-    getTreeselect() {
-      treeselect().then((response) => {
-        this.deptOptions = response.data;
+        this.form = response.rows[0];
       });
     },
 
-    // 获取当前选中部门的名称
-    selectDepart(val) {
-      this.form.stationGroupName = val.label;
-    },
-
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 表单重置
-    reset() {
-      this.form = {
-        deptId: null,
-        deptName: null,
-        deptAddress: null,
-        oilGunNum: null,
-        contacts: null,
-        phone: null,
-        stationGroupId: null,
-        stationGroupName: null,
-        stationPic: null,
-        stationLongitude: null,
-        stationLatitude: null,
-        mno: null,
-        deptId: 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.stationId);
-      this.single = selection.length !== 1;
-      this.multiple = !selection.length;
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加油站信息";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset();
-      const deptId = row.deptId || this.ids;
-      getInfo(deptId).then((response) => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改油站信息";
-      });
-      // this.upload.fileList = [{ name: this.form.fileName, url: this.form.filePath }];
-    },
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate((valid) => {
         if (valid) {
-          if (this.form.deptId != null) {
+          this.$confirm("确认更新油站信息", "警告", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning",
+          }).then(() => {
             updateInfo(this.form).then((response) => {
               this.msgSuccess("修改成功");
               this.open = false;
+              this.editable=true
               this.getList();
             });
-          }
+          });
         }
       });
     },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const stationIds = row.deptId || this.ids;
-      this.$confirm("是否确认删除油站信息", "警告", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      })
-        .then(function () {
-          return delInfo(stationIds);
-        })
-        .then(() => {
-          this.getList();
-          this.msgSuccess("删除成功");
-        });
-    },
     /** 导出按钮操作 */
     handleExport() {
       const queryParams = this.queryParams;
@@ -377,27 +211,8 @@ export default {
           this.download(response.msg);
         });
     },
-    // 文件提交处理
-    submitUpload() {
-      this.$refs.upload.submit();
-    },
-    // 文件上传中处理
-    handleFileUploadProgress(event, file, fileList) {
-      this.upload.isUploading = true;
-    },
-    // 文件上传成功处理++ =
-    handleFileSuccess(response, file, fileList) {
-      this.upload.isUploading = false;
-      let imgurl =
-        location.protocol +
-        "//" +
-        location.host +
-        process.env.VUE_APP_BASE_API +
-        response.fileName;
-      this.form.stationPic = imgurl;
-      this.msgSuccess(response.msg);
-    },
     handleAvatarSuccess(res, file) {
+      console.log("img", res, file);
       let imgurl =
         location.protocol +
         "//" +
@@ -408,12 +223,12 @@ export default {
     },
     beforeAvatarUpload(file) {
       const isJPG = file.type === "image/jpeg";
-      const isLt2M = file.size / 1024 / 1024 < 2;
-      if (!isJPG) {
-        this.$message.error("上传头像图片只能是 JPG 格式!");
-      }
+      const isLt2M = file.size / 1024 / 1024 < 4;
+      // if (!isJPG) {
+      //   this.$message.error("上传头像图片只能是 JPG 格式!");
+      // }
       if (!isLt2M) {
-        this.$message.error("上传头像图片大小不能超过 2MB!");
+        this.$message.error("上传头像图片大小不能超过 4MB!");
       }
       return isJPG && isLt2M;
     },
@@ -421,14 +236,39 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-  .imgbox{
-    width: 50%;
-    height:300px;
-    margin: 0 auto;
-    padding:20px;
-    img{
-      width:100%;
-      height:100%;
+.imgbox {
+  margin: 0 auto;
+  padding: 20px;
+  width: 200px;
+  height: 240px;
+  img {
+    width: 100%;
+    height: 100%;
+  }
+  .uploader {
+    width: 100%;
+    height: 100%;
+    .el-upload {
+      width: 100%;
+      height: 100%;
+    }
+    .avatar {
+      width: 100%;
+      height: 100%;
+      margin: 0 auto;
+    }
+    .el-upload__tip {
+      text-align: center;
+      color: red;
+    }
+    .el-upload {
+      color: red;
     }
   }
+}
+.station {
+  width: 40%;
+  min-width: 300px;
+  margin: 0 auto;
+}
 </style>

src/views/station/order/notOilOrder.vue

@@ -15,15 +15,6 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="联系电话" prop="orderNo">
-        <el-input
-          v-model="queryParams.likeCustomerPhone"
-          placeholder="请输入联系电话"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
       <el-form-item label="创建时间" prop="createdDate">
         <el-date-picker
           style="width: 350px"
@@ -166,7 +157,6 @@ export default {
         createdDate: null,
         orderType: 2,
         likeConsumer: null,
-        likeCustomerPhone: null,
       },
       // 表单参数
       form: {},

src/views/station/order/oilOrder.vue

@@ -15,15 +15,6 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="联系电话" prop="likeCustomerPhone">
-        <el-input
-          v-model="queryParams.likeCustomerPhone"
-          placeholder="请输入订单号"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
       <el-form-item label="油品名称" prop="oilName">
         <el-select
           v-model="queryParams.oilName"
@@ -216,7 +207,6 @@ export default {
         oilPersonnel: null,
         createdDate: null,
         likeConsumer: null,
-        likeCustomerPhone: null,
       },
       // 表单校验
       rules: {},