Merge pull request '能源类型' (#13) from zjl into test

Reviewed-on: #13

.env.dev

@@ -5,7 +5,8 @@ ENV = 'development'
 VUE_APP_TITLE = 芋道管理系统
 
 # 芋道管理系统/开发环境
-VUE_APP_BASE_API = 'http://192.168.0.33:48080'
+# VUE_APP_BASE_API = 'http://192.168.0.33:48080'
+VUE_APP_BASE_API = 'http://192.168.1.188:48080'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

src/api/base/energyType.js

@@ -0,0 +1,62 @@
+import request from '@/utils/request'
+
+// 创建能源类型
+export function createEnergyType(data) {
+  return request({
+    url: '/base/energy-type/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新能源类型
+export function updateEnergyType(data) {
+  return request({
+    url: '/base/energy-type/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除能源类型
+export function deleteEnergyType(id) {
+  return request({
+    url: '/base/energy-type/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得能源类型
+export function getEnergyType(id) {
+  return request({
+    url: '/base/energy-type/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得能源类型分页
+export function getEnergyTypePage(data) {
+  return request({
+    url: '/base/energy-type/page',
+    method: 'post',
+    data: data
+  })
+}
+
+// 获得能源类型编码
+export function getEnergyTypeCode() {
+  return request({
+    url: '/base/energy-type/getCode',
+    method: 'get'
+  })
+}
+
+// 导出能源类型 Excel
+export function exportEnergyTypeExcel(query) {
+  return request({
+    url: '/base/energy-type/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/utils/dict.js

@@ -86,6 +86,9 @@ export const DICT_TYPE = {
   // ============== PRODUCT - 产品模块 =============
   UNIT_DICT: 'unit_dict',
   PRODUCT_TYPE: 'product_type',
+
+  // ============== ENERGY - 能源模块 =============
+  ENERGY_UNIT: 'energy_unit'
 }
 
 /**
@@ -95,7 +98,7 @@ export const DICT_TYPE = {
  * @returns {*|Array} 数据字典数组
  */
 export function getDictDatas(dictType) {
-  console.log('---> ', dictType, store.getters.dict_datas)
+  // console.log('---> ', dictType, store.getters.dict_datas)
   return store.getters.dict_datas[dictType] || []
 }
 
@@ -145,3 +148,15 @@ export function getDictDataLabel(dictType, value) {
   const dict = getDictData(dictType, value);
   return dict ? dict.label : '';
 }
+
+// table中用来过滤字典
+export function publicFormatter(dictTable) {
+  const dictDatas = getDictDatas(dictTable)
+  return function (val) {
+    const arr = {}
+    dictDatas.map((item) => {
+      arr[item.value] = item.label
+    })
+    return arr?.[val]
+  }
+}

src/views/energy/base/energyType/components/InnerTable.vue

@@ -0,0 +1,107 @@
+<template>
+  <el-popover placement="right" width="400" trigger="click">
+    <el-table :data="tableData" v-if='tableProps.length'>
+      <el-table-column
+        v-for='item in tableProps'
+        :key="item.prop"
+        :prop="item.prop" 
+        :label="item.label" 
+        width="120">
+      </el-table-column>
+    </el-table>
+    <span v-if='singlePrice'><span class='priceTitle'>单价(元): </span>{{ singlePrice }}</span>
+    <el-button
+      slot="reference"
+      type="text"
+      class="tableInnerButton"
+      @click="showInnerTable(injectData)"
+      >详情</el-button
+    >
+  </el-popover>
+</template>
+<script>
+import { getEnergyType } from '@/api/base/energyType'
+const temp1 = [
+  {
+    prop: 'startTime',
+    label: '开始时间'
+  },
+  {
+    prop: 'endTime',
+    label: '结束时间'
+  },
+  {
+    prop: 'price',
+    label: '单价(元)'
+  }
+]
+const temp2 = [
+  {
+    prop: 'startUsed',
+    label: '下限值'
+  },
+  {
+    prop: 'endUsed',
+    label: '上限值'
+  },
+  {
+    prop: 'price',
+    label: '单价(元)'
+  }
+]
+export default {
+  name: 'InnerTable',
+  props: {
+    injectData: {
+      type: Object,
+      default: () => ({})
+    },
+    itemProp: {
+      type: String
+    }
+  },
+  data() {
+    return {
+      list: this.injectData,
+      tableData: [],
+      tableProps: [],
+      singlePrice:'',
+      temp1,
+      temp2
+    }
+  },
+  methods: {
+    showInnerTable(data) {
+      let id = data.id
+      getEnergyType(id).then((res) => {
+        if (res.code === 0) {
+          console.log(res)
+          if (res.data.pricingMethod === 0) {
+            this.tableProps = this.temp1
+            this.tableData = res.data.segPriceList
+            this.singlePrice = ''
+          } else if (res.data.pricingMethod === 1) {
+            this.tableProps = this.temp2
+            this.tableData = res.data.usedPriceList
+            this.singlePrice = ''
+          } else {
+            this.tableProps = []
+            this.tableData = []
+            this.singlePrice = res.data.singlePrice
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.tableInnerButton {
+  padding: 0;
+}
+.priceTitle {
+  color: #515A5E;
+  font-weight: bold;
+  margin-right: 10px;
+}
+</style>

src/views/energy/base/energyType/components/InputArea.vue

@@ -0,0 +1,37 @@
+<template>
+  <div class="tableInner">
+    <el-input-number v-model="list[itemProp]" @blur="changeInput" :min="0" :max="100000000" style="width: 100%" :controls='false'></el-input-number>
+  </div>
+</template>
+<script>
+export default {
+  name: 'InputArea',
+  props: {
+    injectData: {
+      type: Object,
+      default: () => ({})
+    },
+    itemProp: {
+      type: String
+    }
+  },
+  data() {
+    return {
+      list: this.injectData
+    }
+  },
+  methods: {
+    changeInput() {
+      console.log(this.list)
+      this.$emit('emitData', this.list)
+    }
+  }
+}
+</script>
+<style lang="scss">
+.tableInner .el-input__inner {
+  border: none;
+  padding: 0;
+  height: 33px;
+}
+</style>

src/views/energy/base/energyType/components/TimePickerArea.vue

@@ -0,0 +1,43 @@
+<template>
+  <div class="tableInner">
+    <el-time-picker
+      v-model="list[itemProp]"
+      @blur="changeInput"
+      style="width: 100%"
+      format='HH:mm:ss'
+      value-format='HH:mm:ss'
+    ></el-time-picker>
+  </div>
+</template>
+<script>
+export default {
+  name: 'TimePickerArea',
+  props: {
+    injectData: {
+      type: Object,
+      default: () => ({})
+    },
+    itemProp: {
+      type: String
+    }
+  },
+  data() {
+    return {
+      list: this.injectData
+    }
+  },
+  methods: {
+    changeInput() {
+      console.log(this.list)
+      this.$emit('emitData', this.list)
+    }
+  }
+}
+</script>
+<style lang="scss">
+.tableInner .el-input--prefix .el-input__inner {
+  border: none;
+  padding-left: 30px;
+  height: 33px;
+}
+</style>

src/views/energy/base/energyType/components/energyTypeAdd.vue

@@ -0,0 +1,332 @@
+<template>
+  <el-form ref="form" :rules="rules" label-width="80px" :model="form">
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="能源类型" prop="name">
+          <el-input v-model="form.name"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="类型编码" prop="code">
+          <el-input v-model="form.code" disabled></el-input>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="单位" prop="unit">
+          <el-select v-model="form.unit" placeholder="请选择" style="width: 100%;">
+            <el-option
+              v-for="item in getDictDatas(DICT_TYPE.ENERGY_UNIT)"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="计价方式" prop="pricingMethod">
+          <el-select v-model="form.pricingMethod" placeholder="请选择" style="width: 100%;">
+            <el-option label="时间段" :value= '0' ></el-option>
+            <el-option label="使用量" :value= '1' ></el-option>
+            <el-option label="固定价位" :value= '2' ></el-option>
+          </el-select>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :span="12" v-show="form.pricingMethod === 2">
+        <el-form-item label="单价(元)" prop="singlePrice">
+          <el-input v-model="form.singlePrice"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24"  v-show="form.pricingMethod === 0">
+        <el-form-item label="时间段">
+          <base-table
+            :key='timeKye'
+            :table-props="tableProps1"
+            :table-data="tableData1"
+            :add-button-show="addButtonShow"
+            @emitButtonClick="emitButtonClick1"
+            @emitFun="inputChange1"
+          >
+            <method-btn
+              v-if="tableBtn.length"
+              slot="handleBtn"
+              :width="80"
+              label="操作"
+              :method-list="tableBtn"
+              @clickBtn="handleClick1"
+            />
+          </base-table>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24" v-show="form.pricingMethod === 1">
+        <el-form-item label="使用量">
+          <base-table
+            :key='usedKye'
+            :table-props="tableProps2"
+            :table-data="tableData2"
+            :add-button-show="addButtonShow"
+            @emitButtonClick="emitButtonClick2"
+            @emitFun="inputChange2"
+          >
+            <method-btn
+              v-if="tableBtn.length"
+              slot="handleBtn"
+              :width="80"
+              label="操作"
+              :method-list="tableBtn"
+              @clickBtn="handleClick2"
+            />
+          </base-table>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :span="24">
+        <el-form-item label="描述" prop="description">
+          <el-input v-model="form.description"></el-input>
+        </el-form-item>
+      </el-col>
+    </el-row>
+  </el-form>
+</template>
+<script>
+import { getEnergyType, updateEnergyType, createEnergyType, getEnergyTypeCode } from '@/api/base/energyType'
+import inputArea from './InputArea.vue'
+import timePickerArea from './TimePickerArea.vue'
+const tableProps1 = [
+  {
+    prop: 'startTime',
+    label: '开始时间',
+    subcomponent: timePickerArea
+  },
+  {
+    prop: 'endTime',
+    label: '结束时间',
+    subcomponent: timePickerArea
+  },
+  {
+    prop: 'price',
+    label: '单价(元)',
+    subcomponent: inputArea
+  }
+]
+const tableProps2 = [
+  {
+    prop: 'startUsed',
+    label: '下限值',
+    // subcomponent: inputArea
+  },
+  {
+    prop: 'endUsed',
+    label: '上限量',
+    subcomponent: inputArea
+  },
+  {
+    prop: 'price',
+    label: '单价(元)',
+    subcomponent: inputArea
+  }
+]
+export default {
+  name: 'energyTypeAdd',
+  data() {
+    return {
+      form: {
+        id: '',
+        name: '',
+        code: '',
+        nuit: '',
+        pricingMethod: 1,
+        leaderName: ''
+      },
+      isEdit: false, //是否是编辑
+      rules: {
+        name: [{ required: true, message: '能源类型不能为空', trigger: 'blur' }]
+      },
+      timeKye: 0,
+      usedKye: 0,
+      tableProps1,
+      tableProps2,
+      tableData1: [],
+      tableData2: [],
+      tableBtn: [
+        {
+          type: 'delete',
+          name: '删除'
+        }
+      ],
+      addButtonShow: '新增'
+    }
+  },
+  methods: {
+    init(id) {
+      if (id) {
+        this.isEdit = true
+        this.form.id = id
+        getEnergyType( id ).then((res) => {
+          if (res.code === 0) {
+            this.form = res.data
+            switch(this.form.pricingMethod) {
+              case 0:
+                this.tableData1 = this.form.segPriceList
+                break;
+              case 1:
+                this.tableData2 = this.form.usedPriceList
+                break;
+              default:
+            }
+          }
+        })
+      } else {
+        this.isEdit = false
+        this.form.id = ''
+        getEnergyTypeCode().then((res) => {
+          this.form.code = res.data
+        })
+      }
+    },
+    // 输入框失去焦点
+    inputChange1(val) {
+      this.tableData1[val._pageIndex - 1][val.prop] = val[val.prop]
+      if ((this.tableData1.length > val._pageIndex) && val.prop === 'endTime') {
+        this.tableData1[val._pageIndex].startTime = val[val.prop]
+      }
+      this.timeKye++
+    },
+    inputChange2(val) {
+      // 上限值必须大于下限值
+      if (!!val.endUsed && (val.endUsed <= val.startUsed)) {
+        this.$modal.msgError('上限值不能等于或者小于下限值')
+        return false
+      }
+      this.tableData2[val._pageIndex - 1][val.prop] = val[val.prop]
+      if ((this.tableData2.length > val._pageIndex) && val.prop === 'endUsed') {
+        this.tableData2[val._pageIndex].startUsed = val[val.prop]
+      }
+      this.usedKye++
+    },
+    // 增加
+    emitButtonClick1() {
+      let n = this.tableData1.length
+      if (n >=3) {
+        this.$modal.msgWarning('最多可添加3档计价')
+        return false
+      }
+      let obj = {}
+      obj.startTime = n === 0 ? '' : this.tableData1[n-1].endTime
+      obj.endTime = ''
+      obj.price = 0
+      this.tableData1.push(obj)
+    },
+    emitButtonClick2() {
+      let n = this.tableData2.length
+      if (n >=3) {
+        this.$modal.msgWarning('最多可添加3档计价')
+        return false
+      }
+      let obj = {}
+      obj.startUsed = n === 0 ? 0 : this.tableData2[n-1].endUsed
+      obj.endUsed = 0
+      obj.price = 0
+      this.tableData2.push(obj)
+    },
+    // 删除
+    handleClick1(val) {
+      this.tableData1.splice(val.data._pageIndex - 1, 1)
+      this.timeKye++
+    },
+    handleClick2(val) {
+      this.tableData2.splice(val.data._pageIndex - 1, 1)
+      this.usedKye++
+    },
+    submitForm() {
+      this.$refs['form'].validate((valid) => {
+        if (valid) {
+          switch(this.form.pricingMethod) {
+            case 0:// 时间段
+              if (this.tableData1.length === 0) {
+                this.$modal.msgError('时间段表格数据不能为空')
+                return false
+              } else {
+                this.tableData1.map(item => {
+                  if (item.price <= 0) {
+                    this.$modal.msgError('单价有误请检查，请检查')
+                    return false
+                  }
+                })
+              }
+              break;
+            case 1:// 使用量
+              if (this.tableData2.length === 0) {
+                this.$modal.msgError('使用量表格数据不能为空')
+                return false
+              } else {
+                this.tableData1.map(item => {
+                  if (item.price <= 0) {
+                    this.$modal.msgError('单价有误请检查，请检查')
+                    return false
+                  }
+                })
+              }
+              break;
+            default:// 固定单价
+              if (!this.form.singlePrice) {
+                this.$modal.msgError('单价有误请检查1，请检查')
+                  return false
+              }
+          }
+          if (this.isEdit) {
+            // 编辑
+            updateEnergyType({
+              id: this.form.id,
+              code: this.form.code,
+              name: this.form.name,
+              unit: this.form.unit,
+              pricingMethod: this.form.pricingMethod,
+              description: this.form.description,
+              singlePrice: this.form.pricingMethod === 2 ? this.form.singlePrice : '',
+              segPriceList: this.form.pricingMethod === 0 ? this.tableData1: [],
+              usedPriceList: this.form.pricingMethod === 1 ? this.tableData2: []
+            }).then((res) => {
+              if (res.code === 0) {
+                this.$modal.msgSuccess("操作成功");
+                this.$emit('successSubmit')
+              }
+            })
+          } else {
+            createEnergyType({
+              code: this.form.code,
+              name: this.form.name,
+              unit: this.form.unit,
+              pricingMethod: this.form.pricingMethod,
+              description: this.form.description,
+              singlePrice: this.form.pricingMethod === 2 ? this.form.singlePrice : '',
+              segPriceList: this.form.pricingMethod === 0 ? this.tableData1: [],
+              usedPriceList: this.form.pricingMethod === 1 ? this.tableData2: []
+            }).then((res) => {
+              if (res.code === 0) {
+                this.$modal.msgSuccess("操作成功");
+                this.$emit('successSubmit')
+              }
+            })
+          }
+        } else {
+          return false
+        }
+      })
+    },
+    formClear() {
+      this.$refs.form.resetFields()
+      this.isEdit = false
+      this.timeKye = 0
+      this.usedKye = 0
+      this.tableData1 = []
+      this.tableData2 = []
+    }
+  }
+}
+</script>

src/views/energy/base/energyType/index.vue

@@ -0,0 +1,217 @@
+<template>
+  <div class="app-container">
+
+    <!-- 搜索工作栏 -->
+    <search-bar
+      :formConfigs="formConfig"
+      ref="searchBarForm"
+      @headBtnClick="buttonClick"
+    />
+    <!-- 列表 -->
+    <base-table
+      :page="queryParams.pageNo"
+      :limit="queryParams.pageSize"
+      :table-props="tableProps"
+      :table-data="list"
+      :max-height="tableH"
+    >
+      <method-btn
+        v-if="tableBtn.length"
+        slot="handleBtn"
+        :width="80"
+        label="操作"
+        :method-list="tableBtn"
+        @clickBtn="handleClick"
+      />
+    </base-table>
+    <pagination
+      :page.sync="queryParams.pageNo"
+      :limit.sync="queryParams.pageSize"
+      :total="total"
+      @pagination="getList"
+    />
+    <!-- 新增 -->
+    <base-dialog
+      :dialogTitle="addOrEditTitle"
+      :dialogVisible="centervisible"
+      @cancel="handleCancel"
+      @confirm="handleConfirm"
+      :before-close="handleCancel"
+    >
+      <energy-type-add ref="energyType" @successSubmit="successSubmit" />
+    </base-dialog>
+  </div>
+</template>
+
+<script>
+import { getEnergyTypePage, deleteEnergyType, updateGroupTeam } from "@/api/base/energyType";
+import { publicFormatter } from '@/utils/dict'
+import InnerTable from './components/InnerTable'
+import EnergyTypeAdd from './components/energyTypeAdd.vue'
+const tableProps = [
+  {
+    prop: 'code',
+    label: '类型编码'
+  },
+  {
+    prop: 'name',
+    label: '能源类型'
+  },
+  {
+    prop: 'unit',
+    label: '单位',
+    filter: publicFormatter('energy_unit')
+  },
+  {
+    prop: 'pricingMethod',
+    label: '计价方式'
+  },
+  {
+    prop: 'price',
+    label: '价格(元)',
+    subcomponent: InnerTable
+  }
+]
+export default {
+  name: "GroupTeam",
+  components: { EnergyTypeAdd },
+  data() {
+    return {
+      formConfig: [
+        {
+          type: 'input',
+          label: '能源类型',
+          placeholder: '能源类型',
+          param: 'name'
+        },
+        {
+          type: 'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary'
+        },
+        {
+          type: 'separate'
+        },
+        {
+          type: this.$auth.hasPermi('base:energy-type:create') ? 'button' : '',
+          btnName: '新增',
+          name: 'add',
+          color: 'success',
+          plain: true
+        }
+      ],
+      tableProps,
+      tableBtn: [
+        this.$auth.hasPermi('base:energy-type:update')
+          ? {
+              type: 'edit',
+              btnName: '编辑'
+            }
+          : undefined,
+        this.$auth.hasPermi('base:energy-type:delete')
+          ? {
+              type: 'delete',
+              btnName: '删除'
+            }
+          : undefined
+      ].filter((v) => v),
+      tableH: this.tableHeight(260),
+      pricingMethodList: [
+        {value: 0,label: '分时间段计价'},
+        {value: 1,label: '分使用量计价'},
+        {value: 2,label: '单一计价'}
+      ],
+      // 总条数
+      total: 0,
+      // 班次基础信息列表
+      list: [],
+      // 弹出层标题
+      addOrEditTitle: "",
+      // 是否显示弹出层
+      centervisible: false,
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 20,
+        name: null,
+        code: null
+      }
+    };
+  },
+  created() {
+    window.addEventListener('resize', () => {
+      this.tableH = this.tableHeight(260)
+    })
+    this.getList();
+  },
+  methods: {
+    buttonClick(val) {
+      switch (val.btnName) {
+        case 'search':
+          this.queryParams.pageNo = 1;
+          this.queryParams.name = val.name
+          this.queryParams.code = val.code
+          this.getList()
+          break
+        default:
+          this.addOrEditTitle = '新增'
+          this.centervisible = true
+          this.$nextTick(() => {
+            this.$refs.energyType.init()
+          })
+      }
+    },
+    /** 查询列表 */
+    getList() {
+      getEnergyTypePage(this.queryParams).then(response => {
+        let arr = response.data.list || [];
+        arr&&arr.map(item => {
+          this.pricingMethodList.map(i => {
+            if (item.pricingMethod === i.value) {
+              item.pricingMethod = i.label
+            }
+          })
+        })
+        this.list = arr
+        this.total = response.data.total;
+      });
+    },
+    handleClick(val) {
+      switch (val.type) {
+        case 'edit':
+          this.addOrEditTitle = '编辑'
+          this.$nextTick(() => {
+            this.$refs.energyType.init(val.data.id)
+          })
+          this.centervisible = true
+          break
+        default:
+        this.handleDelete(val.data)
+      }
+    },
+    handleCancel() {
+      this.$refs.energyType.formClear()
+      this.centervisible = false
+      this.addOrEditTitle = ''
+    },
+    handleConfirm() {
+      this.$refs.energyType.submitForm()
+    },
+    successSubmit() {
+      this.handleCancel()
+      this.getList()
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$modal.confirm('是否确认删除能源类型为"' + row.name + '"的数据项?').then(function() {
+          return deleteEnergyType(row.id);
+        }).then(() => {
+          this.queryParams.pageNo = 1;
+          this.getList();
+          this.$modal.msgSuccess("删除成功");
+        }).catch(() => {});
+    }
+  }
+};
+</script>

src/views/group/base/groupTeam/index.vue

@@ -87,14 +87,14 @@ export default {
       formConfig: [
         {
           type: 'input',
-          label: '名称',
-          placeholder: '名称',
+          label: '班次名称',
+          placeholder: '班次名称',
           param: 'name'
         },
         {
           type: 'input',
-          label: '编码',
-          placeholder: '编码',
+          label: '班次编码',
+          placeholder: '班次编码',
           param: 'code'
         },
         {