标签初稿

src/api/label/label.js

@@ -0,0 +1,50 @@
+import request from '@/utils/request'
+
+// 查询标签名，标签功能是否开启
+export function sysDeptDemoList(query) {
+  return request({
+    url: '/label/rule/sysDeptDemoList',
+    method: 'get',
+    params: query
+  })
+}
+
+// 新增修改标签
+export function addlabel(data) {
+  return request({
+    url: '/label/rule/addlabel',
+    method: 'post',
+    data: data
+  })
+}
+// 查询标签名
+export function labelRulelist(query) {
+  return request({
+    url: '/label/rule/list',
+    method: 'get',
+    params: query
+  })
+}
+// 查询标签名
+export function selectLabelList(query) {
+  return request({
+    url: '/label/rule/selectLabelList',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查查询删除
+export function deleteLabelRuleDetail(query) {
+  return request({
+    url: '/label/detail/deleteLabelRuleDetail',
+    method: 'get',
+    params: query
+  })
+}
+
+
+
+
+
+

src/views/label/Label_AddLabel.vue

@@ -2,11 +2,11 @@
   <div>
     <div
       style="
-        width: 300px;
+        width: 450px;
         margin: 0 auto;
         margin-top: 20px;
         margin-bottom: 60px;
-        border:1px solid red;
+        border: 1px solid red;
         box-sizing: border-box;
         padding: 20px;
       "
@@ -24,17 +24,17 @@
     <el-form
       :model="labelForm"
       ref="labelForm"
-      label-width="80px"
-      size="mini"
-      style="width: 300px; margin: 0 auto"
+      label-width="90px"
+      style="width: 400px; margin: 0 auto"
+      label-position="left"
     >
       <el-form-item label="启用标签" prop="labelFlag">
-        <el-radio-group v-model="labelForm.labelFlag">
+        <el-radio-group v-model="labelForm.labelFlag" :disabled="editable">
           <el-radio label="0">关闭</el-radio>
           <el-radio label="1">开启</el-radio>
         </el-radio-group>
       </el-form-item>
-      <div v-if="labelForm.labelFlag==1">
+      <div v-if="labelForm.labelFlag == 1">
         <el-form-item
           v-for="(label, index) in labelForm.labelArr"
           :label="'标签' + (index + 1)"
@@ -47,24 +47,41 @@
           }"
         >
           <el-input v-model="label.labelName" :disabled="editable"></el-input>
-          <el-button @click.prevent="removeLabel(label)" :disabled="editable">删除</el-button>
-        </el-form-item>
-        <el-form-item>
-          <el-button @click="addLabel" :disabled="editable">新增</el-button>
-          <el-button 
-            type="primary" 
-            @click="submitForm('labelForm')"
-            :disabled="editable"
-            v-show="!editable"
-            >提交</el-button
+          <el-popconfirm
+            title="此标签在用，删除前请仔细检查，是否删除？"
+            confirm-button-text='删除'
+            @onConfirm="removeLabel(label)"
+            v-if="!!label.id"
           >
-          <el-button type="danger" @click="editLabel">{{editable?'修改标签':'取消'}}</el-button>
+            <el-button slot="reference"  :disabled="editable">删除</el-button>
+          </el-popconfirm>
+          <el-button @click="removeLabel(label)"  :disabled="editable" v-else>删除</el-button>
         </el-form-item>
       </div>
+      <el-form-item>
+        <el-button
+          @click="addLabel"
+          :disabled="editable"
+          v-show="labelForm.labelFlag == 1"
+          >新增</el-button
+        >
+        <el-button
+          type="primary"
+          @click="submitForm('labelForm')"
+          :disabled="editable"
+          v-show="!editable"
+          >提交</el-button
+        >
+        <el-button type="danger" @click="editLabel">{{
+          editable ? "修改标签" : "取消"
+        }}</el-button>
+      </el-form-item>
     </el-form>
   </div>
 </template>
 <script>
+import { sysDeptDemoList, addlabel } from "@/api/label/label";
+
 export default {
   name: "Label_AddLabel",
   data() {
@@ -75,36 +92,62 @@ export default {
           {
             id: "",
             labelName: "hah",
-          },
-          {
-            id: "",
-            labelName: "ha151115155h",
-          },
-          {
-            id: "",
-            labelName: "ha151115155h",
-          },
+          }
         ],
+        delArr: [],
       },
       editable: true,
-      tempForm:undefined,
+      tempForm: undefined,
+      delLabelItem:{}
     };
   },
+  created() {
+    this.init();
+  },
   methods: {
-    submitForm(formName) {
-      this.$refs[formName].validate((valid) => {
-        if (valid) {
-          alert("submit!");
+    init() {
+      this.getList();
+    },
+    test(){
+      
+    },
+    getList() {
+      return sysDeptDemoList().then((res) => {
+        if (res.code == 200) {
+          this.labelForm = res.data;
+          this.labelForm.delArr = [];
         } else {
-          console.log("error submit!!");
-          return false;
+          this.msgError("初始化数据失败");
+        }
+      });
+    },
+    delLabel(label){
+      this.delLabelItem = label;
+    },
+    submitForm(labelForm) {
+      this.$refs[labelForm].validate((valid) => {
+        if (valid) {
+          addlabel(this.labelForm).then((res) => {
+            if (res.code == 200) {
+              this.getList().then((res) => {
+                this.editable = true;
+                this.msgSuccess("标签提交成功！");
+              });
+            } else {
+              this.msgError("标签提交时出现错误，请刷新重试！");
+            }
+          });
         }
       });
     },
-    resetForm(formName) {
-      this.$refs[formName].resetFields();
+    resetForm(labelForm) {
+      this.$refs[labelForm].resetFields();
     },
     removeLabel(item) {
+      if(!!item.id){
+        this.labelForm.delArr.push(item.id);
+        console.log(this.labelForm.delArr)
+      }
       var index = this.labelForm.labelArr.indexOf(item);
       if (index !== -1) {
         this.labelForm.labelArr.splice(index, 1);
@@ -116,16 +159,17 @@ export default {
         key: Date.now(),
       });
     },
-    editLabel(){
-      if(!this.editable){
-        if(this.tempForm !== undefined){
-          this.labelForm = JSON.parse(this.tempForm)
+    editLabel() {
+      if (!this.editable) {
+        if (this.tempForm !== undefined) {
+          this.labelForm = JSON.parse(this.tempForm);
+          this.labelForm.delArr = []
         }
-      }else{
-        this.tempForm = JSON.stringify({...this.labelForm});
+      } else {
+        this.tempForm = JSON.stringify({ ...this.labelForm });
       }
       this.editable = !this.editable;
-    }
+    },
   },
 };
 </script>

src/views/label/Label_AddUser.vue

@@ -0,0 +1,172 @@
+<template>
+  <div v-if="labelForm.labelFlag == 1" >
+    <div v-if="labelForm.labelArr.length == 0">
+      你未添加标签，请先添加标签后再来设置规则
+    </div>
+    <el-collapse v-model="activeNames" @change="handleChange" class="collapse" accordion>
+      <el-collapse-item title="标签2" name="2">
+        <div>
+          控制反馈：通过界面样式和交互动效让用户可以清晰的感知自己的操作；
+        </div>
+        <div>页面反馈：操作后，通过页面元素的变化清晰地展现当前状态。</div>
+      </el-collapse-item>
+      <el-collapse-item title="标签3" name="3">
+        <div>简化流程：设计简洁直观的操作流程；</div>
+        <div>
+          清晰明确：语言表达清晰且表意明确，让用户快速理解进而作出决策；
+        </div>
+        <div>
+          帮助用户识别：界面简单直白，让用户快速识别而非回忆，减少用户记忆负担。
+        </div>
+      </el-collapse-item>
+    </el-collapse>
+  </div>
+  <div v-else>你未启用标签功能</div>
+</template>
+
+<script>
+import { sysDeptDemoList, labelRulelist } from "@/api/label/label";
+import { listPrice } from "@/api/station/price";
+export default {
+  name:"Label_SetLabel",
+  data() {
+    return {
+      activeNames: ["1"],
+      discountList: [
+        {
+          searchValue: null,
+          createBy: "13",
+          createTime: "2021-06-16 09:40:39",
+          updateBy: null,
+          updateTime: null,
+          remark: null,
+          params: {},
+          stationIdList: null,
+          id: 26,
+          grade: "92#",
+          discountTerm: "2",
+          discountAmt: "100",
+          gasoilDiscountAmt: "1",
+          vipDiscountyPlus: "0",
+          couponPlus: "0",
+          discountPlanType: "3",
+          oilName: "92#",
+          stationId: 123,
+          stationName: "智慧易加-西站",
+          status: "0",
+        },
+        {
+          searchValue: null,
+          createBy: "13",
+          createTime: "2021-06-16 09:40:58",
+          updateBy: null,
+          updateTime: null,
+          remark: null,
+          params: {},
+          stationIdList: null,
+          id: 27,
+          grade: "95#",
+          discountTerm: "2",
+          discountAmt: "100",
+          gasoilDiscountAmt: "1",
+          vipDiscountyPlus: "0",
+          couponPlus: "0",
+          discountPlanType: "3",
+          oilName: "95#",
+          stationId: 123,
+          stationName: "智慧易加-西站",
+          status: "0",
+        },
+        {
+          searchValue: null,
+          createBy: "13",
+          createTime: "2021-06-16 09:45:56",
+          updateBy: null,
+          updateTime: null,
+          remark: null,
+          params: {},
+          stationIdList: null,
+          id: 28,
+          grade: "98#",
+          discountTerm: "2",
+          discountAmt: "100",
+          gasoilDiscountAmt: "0.5",
+          vipDiscountyPlus: "0",
+          couponPlus: "0",
+          discountPlanType: "3",
+          oilName: "98#",
+          stationId: 123,
+          stationName: "智慧易加-西站",
+          status: "0",
+        },
+      ],
+      openDialog: false,
+      updateForm: {},
+      labelForm: {},
+      oilNameOptions: [],
+    };
+  },
+  created() {
+    this.init();
+    // setTimeout(() => {
+    //   console.log("哈哈");
+    //   console.log(this.oilNameOptions);
+    //   const arr = this.filterOilNameOptions([
+    //     {
+    //       oilName: "92#",
+    //     },
+    //   ]);
+    //   console.log(arr);
+    // }, 1000);
+  },
+  methods: {
+    init() {
+      this.getList();
+      listPrice().then((response) => {
+        this.oilNameOptions = response.rows;
+        console.log(this.oilNameOptions);
+      });
+    },
+    handleChange(val) {
+      console.log(val);
+    },
+    addRule(e) {
+      e.stopPropagation();
+      console.log(1);
+      this.openDialog = true;
+    },
+    handleSubmit() {},
+    cancelSubmit() {},
+    getList() {
+      return sysDeptDemoList().then((res) => {
+        if (res.code == 200) {
+          this.labelForm = res.data;
+          console.log(this.labelForm);
+        } else {
+          this.msgError("初始化数据失败");
+        }
+      });
+    },
+    filterOilNameOptions(arr) {
+      return this.oilNameOptions.filter((ele) => {
+        let flag = true;
+        arr.forEach((item) => {
+          if (ele.oilName == item.oilName) {
+            flag = false;
+          }
+        });
+        return flag;
+      });
+    },
+  },
+};
+</script>
+<style lang="scss">
+.collapse {
+  width: 600px;
+  margin: 0 auto;
+  .el-collapse-item__wrap {
+    // border-bottom: 1px solid;
+  }
+}
+</style>

src/views/label/Label_SetLabel.vue

@@ -0,0 +1,393 @@
+<template>
+  <div v-if="labelForm.labelFlag == 1">
+    <div v-if="labelForm.labelArr.length == 0">
+      你未添加标签，请先添加标签后再来设置规则
+    </div>
+    <el-collapse v-model="activeNames" @change="handleChange" class="collapse">
+      <el-collapse-item title="标签1" name="1">
+        <div style="margin-left: 200px; float: right" @click="addRule($event)">
+          <i class="header-icon el-icon-plus"></i>添加规则
+        </div>
+        <el-table :data="discountList" :border="false" :stripe="false">
+          <af-table-column label="油品名称" align="center" prop="oilName" />
+          <af-table-column label="优惠条件" align="center">
+            <template slot-scope="scope">
+              满 {{ scope.row.discountAmt }}
+              {{ scope.row.discountTerm == 2 ? "元" : "L" }}，每升优惠
+              {{ scope.row.discountLitersAmt }} 元
+            </template>
+          </af-table-column>
+          <af-table-column
+            label="优惠条件金额"
+            v-if="false"
+            align="center"
+            prop="discountAmt"
+          />
+          <af-table-column
+            label="优惠金额"
+            v-if="false"
+            align="center"
+            prop="discountLitersAmt"
+          />
+          <af-table-column
+            label="优惠方案类型"
+            v-if="false"
+            align="center"
+            prop="discountPlanType"
+          />
+          <af-table-column
+            label="操作"
+            align="center"
+            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
+          > -->
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-delete"
+                @click.stop="handleDelete(scope.row)"
+                >删除</el-button
+              >
+            </template>
+          </af-table-column>
+        </el-table>
+      </el-collapse-item>
+      <el-collapse-item title="标签2" name="2">
+        <div>
+          控制反馈：通过界面样式和交互动效让用户可以清晰的感知自己的操作；
+        </div>
+        <div>页面反馈：操作后，通过页面元素的变化清晰地展现当前状态。</div>
+      </el-collapse-item>
+      <el-collapse-item title="标签3" name="3">
+        <div>简化流程：设计简洁直观的操作流程；</div>
+        <div>
+          清晰明确：语言表达清晰且表意明确，让用户快速理解进而作出决策；
+        </div>
+        <div>
+          帮助用户识别：界面简单直白，让用户快速识别而非回忆，减少用户记忆负担。
+        </div>
+      </el-collapse-item>
+      <el-collapse-item
+        :title="ele.labelName"
+        :name="ele.id"
+        v-for="ele in labelForm.labelArr"
+        :key="ele.id"
+      >
+        <el-table
+          :data="ele.labelRuleDetailList"
+          :border="false"
+          :stripe="false"
+        >
+          <af-table-column label="油品名称" align="center" prop="oilName" />
+          <af-table-column label="优惠条件" align="center">
+            <template slot-scope="scope">
+              满 {{ scope.row.discountAmt }}
+              {{ scope.row.discountTerm == 2 ? "元" : "L" }}，每升优惠
+              {{ scope.row.discountLitersAmt }} 元
+            </template>
+          </af-table-column>
+          <af-table-column
+            label="优惠条件金额"
+            v-if="false"
+            align="center"
+            prop="discountAmt"
+          />
+          <af-table-column
+            label="优惠金额"
+            v-if="false"
+            align="center"
+            prop="discountLitersAmt"
+          />
+          <af-table-column
+            label="优惠方案类型"
+            v-if="false"
+            align="center"
+            prop="discountPlanType"
+          />
+          <af-table-column
+            label="操作"
+            align="center"
+            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
+          > -->
+              <el-popconfirm
+                title="确认删除此条规则？"
+                confirm-button-text="删除"
+                @onConfirm="handleDelete(scope.row)"
+              >
+                <el-button slot="reference"  size="mini" type="text" icon="el-icon-delete"
+                  >删除</el-button
+                >
+              </el-popconfirm>
+            </template>
+          </af-table-column>
+        </el-table>
+      </el-collapse-item>
+    </el-collapse>
+    <el-dialog
+      :visible.sync="openDialog"
+      width="600px"
+      append-to-body
+      title="满减"
+    >
+      <el-form ref="updateForm" :model="updateForm" label-width="140px">
+        <el-form-item label="方案名称" prop="grade">
+          <el-input v-model="updateForm.grade" placeholder="请输入方案名称" />
+        </el-form-item>
+        <el-form-item label="油品名称" prop="oilName">
+          <el-select
+            v-model="updateForm.oilName"
+            placeholder="油品名称"
+            clearable
+          >
+            <!--
+            <el-option
+              v-for="dict in filterOilNameOptions"
+              :key="dict.oilName"
+              :label="dict.oilName"
+              :value="dict.oilName"
+            />
+            -->
+          </el-select>
+        </el-form-item>
+        <!--
+        <el-form-item label="优惠条件" prop="discountLitersAmt" required>
+          <el-radio-group
+            v-model="updateForm.discountTerm"
+            v-if="discountSetting == 3"
+          >
+            <el-radio :label="2">按加油金额优惠</el-radio>
+            <el-radio :label="1">按加油升数优惠</el-radio>
+          </el-radio-group>
+          <div
+            v-show="
+              updateForm.discountTerm == 2 ||
+              updateForm.discountTerm == 1 ||
+              discountSetting == 1 ||
+              discountSetting == 2
+            "
+          >
+            {{ ["", "每满", "满", "满"][discountSetting] }}
+            <el-input-number
+              v-model="updateForm.discountAmt"
+              size="mini"
+              :min="0"
+            />
+
+            <span>{{
+              updateForm.discountTerm == 1 && discountSetting == 3 ? "L" : "元"
+            }}</span>
+            ，{{ ["", "减", "减", "每升优惠"][discountSetting] }}
+            <el-input-number
+              v-model="updateForm.discountLitersAmt"
+              size="mini"
+              :min="0"
+            />元
+          </div>
+        </el-form-item>
+        <el-form-item label="叠加等级优惠" prop="vipDiscountyPlus">
+          <el-radio-group v-model="updateForm.vipDiscountyPlus">
+            <el-radio label="1">是</el-radio>
+            <el-radio label="0">否</el-radio>
+          </el-radio-group>
+          <div style="margin-left: 20px; color: red">
+            注："否" 客户只享受 {{ discountName }} 优惠
+          </div>
+        </el-form-item>
+        <el-form-item label="可否叠加劵" prop="couponPlus">
+          <el-radio-group v-model="updateForm.couponPlus">
+            <el-radio label="1">是</el-radio>
+            <el-radio label="0">否</el-radio>
+          </el-radio-group>
+          <div style="margin-left: 20px; color: red">
+            注："否" 客户只享受 {{ discountName }} 优惠
+          </div>
+        </el-form-item>
+        -->
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="handleSubmit">确 定</el-button>
+        <el-button @click="cancelSubmit">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+  <div v-else>你未启用标签功能</div>
+</template>
+
+<script>
+import {
+  sysDeptDemoList,
+  labelRulelist,
+  selectLabelList,
+  deleteLabelRuleDetail,
+} from "@/api/label/label";
+import { listPrice } from "@/api/station/price";
+export default {
+  name: "Label_SetLabel",
+  data() {
+    return {
+      activeNames: ["1"],
+      discountList: [
+        {
+          searchValue: null,
+          createBy: "13",
+          createTime: "2021-06-16 09:40:39",
+          updateBy: null,
+          updateTime: null,
+          remark: null,
+          params: {},
+          stationIdList: null,
+          id: 26,
+          grade: "92#",
+          discountTerm: "2",
+          discountAmt: "100",
+          discountLitersAmt: "1",
+          vipDiscountyPlus: "0",
+          couponPlus: "0",
+          discountPlanType: "3",
+          oilName: "92#",
+          stationId: 123,
+          stationName: "智慧易加-西站",
+          status: "0",
+        },
+        {
+          searchValue: null,
+          createBy: "13",
+          createTime: "2021-06-16 09:40:58",
+          updateBy: null,
+          updateTime: null,
+          remark: null,
+          params: {},
+          stationIdList: null,
+          id: 27,
+          grade: "95#",
+          discountTerm: "2",
+          discountAmt: "100",
+          discountLitersAmt: "1",
+          vipDiscountyPlus: "0",
+          couponPlus: "0",
+          discountPlanType: "3",
+          oilName: "95#",
+          stationId: 123,
+          stationName: "智慧易加-西站",
+          status: "0",
+        },
+        {
+          searchValue: null,
+          createBy: "13",
+          createTime: "2021-06-16 09:45:56",
+          updateBy: null,
+          updateTime: null,
+          remark: null,
+          params: {},
+          stationIdList: null,
+          id: 28,
+          grade: "98#",
+          discountTerm: "2",
+          discountAmt: "100",
+          discountLitersAmt: "0.5",
+          vipDiscountyPlus: "0",
+          couponPlus: "0",
+          discountPlanType: "3",
+          oilName: "98#",
+          stationId: 123,
+          stationName: "智慧易加-西站",
+          status: "0",
+        },
+      ],
+      openDialog: false,
+      updateForm: {},
+      labelForm: {},
+      oilNameOptions: [],
+    };
+  },
+  created() {
+    this.init();
+    // setTimeout(() => {
+    //   console.log("哈哈");
+    //   console.log(this.oilNameOptions);
+    //   const arr = this.filterOilNameOptions([
+    //     {
+    //       oilName: "92#",
+    //     },
+    //   ]);
+    //   console.log(arr);
+    // }, 1000);
+    selectLabelList().then((res) => {
+      console.log("哈哈");
+      console.log(res);
+    });
+  },
+  methods: {
+    init() {
+      this.getList();
+      listPrice().then((response) => {
+        this.oilNameOptions = response.rows;
+        console.log(this.oilNameOptions);
+      });
+    },
+    handleChange(val) {
+      console.log(val);
+    },
+    addRule(e) {
+      e.stopPropagation();
+      console.log(1);
+      this.openDialog = true;
+    },
+    handleSubmit() {},
+    cancelSubmit() {},
+    getList() {
+      return selectLabelList().then((res) => {
+        if (res.code == 200) {
+          this.labelForm = res.data;
+          console.log(this.labelForm);
+        } else {
+          this.msgError("初始化数据失败");
+        }
+      });
+    },
+    handleDelete(ele) {
+      console.log(1222222222);
+      deleteLabelRuleDetail({
+        id: ele.id,
+      }).then((res) => {
+        console.log(res);
+      });
+    },
+    filterOilNameOptions(arr) {
+      return this.oilNameOptions.filter((ele) => {
+        let flag = true;
+        arr.forEach((item) => {
+          if (ele.oilName == item.oilName) {
+            flag = false;
+          }
+        });
+        return flag;
+      });
+    },
+  },
+};
+</script>
+<style lang="scss">
+.collapse {
+  width: 600px;
+  margin: 0 auto;
+  .el-collapse-item__wrap {
+    // border-bottom: 1px solid;
+  }
+}
+</style>

src/views/market/Market_Discount.vue

@@ -374,7 +374,6 @@ export default {
     init() {
       listPrice().then((response) => {
         this.oilNameOptions = response.rows;
-        console.log(this.oilNameOptions)
       });
       this.getPay().then(() => {
         this.getList();