calf-feed-pc/src/views/basicSettings/DefaultPara.vue

<template>
 
  <div>
    <el-card>
 
    <el-form  ref="addFormRef"  :rules="addFormRules"  :model="addForm"  label-position="right" label-width="200px"  style="width:70%;">
      
        <el-row>
          <el-col :span="12">
       
            <el-form-item label="代乳粉与水的比例：" prop="name">
              <el-col :span="11">
                <el-form-item prop="milk_replace_min">
                  <el-input-number v-model="addForm.milk_replace_min" style="width:100%;" :controls="false" placeholder="比例" />
                </el-form-item>
              </el-col>
              <el-col class="line" :span="2">-</el-col>
              <el-col :span="11">
                <el-form-item prop="milk_replace_max">
                  <el-input-number v-model="addForm.milk_replace_max" style="width:100%;" :controls="false" placeholder="比例" />
                </el-form-item>
              </el-col> 
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="饲喂班次数量：" prop="class_number">
                <el-select  v-model="addForm.class_number" filterable placeholder="请选择"   style="width: 98%;" >
                  <el-option v-for="item in classList" :key="item.id" :label="item.value" :value="item.id" />
                </el-select>
              </el-form-item> 
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="计量单位小数点位数：" prop="measurement_decimals">
                <el-select  v-model="addForm.measurement_decimals" filterable placeholder="请选择"   style="width: 98%;" >
                  <el-option v-for="item in unitList1" :key="item.id" :label="item.value" :value="item.id" />
                </el-select>
              </el-form-item> 
          </el-col>
          <el-col :span="12">
            <el-form-item label="比例小数点位数：" prop="ratio_decimals">
                <el-select  v-model="addForm.ratio_decimals" filterable placeholder="请选择"   style="width: 98%;" >
                  <el-option v-for="item in unitList2" :key="item.id" :label="item.value" :value="item.id" />
                </el-select>
              </el-form-item> 
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
       
            <el-form-item label="犊牛断奶提醒：" prop="weaning_reminder">
              <el-input  v-model="addForm.weaning_reminder" :controls="false" placeholder="比例" >
                <template slot="append">天</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="饲喂时间误差范围：" prop="feed_plan_time_rang">
              <el-input  v-model="addForm.feed_plan_time_rang" :controls="false" placeholder="比例" >
                <template slot="append">分钟</template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-button type="warning" v-if="isButtonEdit"  @click="reset_save()">恢复默认</el-button>
            <el-button type="primary" v-if="isButtonEdit"  @click="add_dialog_save()">保存</el-button>
          </el-col>
        </el-row>


 


      
            
              
    </el-form>
   
  
    </el-card>
  </div>


</template> 

<script>
import {  ajaxDataGet, ajaxDataPost, ajaxDataPut, ajaxDataDelete, checkButtons} from '@/api/common'
import { parseTime, json2excel } from '@/utils/index.js'
export default {
  data() {


    
 
  
    return {

 

      //接口 - 获取 - 表格
      url_get_table:'/api/v1/ops/base_setting/default_params/list',
      //接口 - 新增 - 表格
      url_add_table:'/api/v1/ops/base_setting/default_params/edit',  
      //接口 - 修改 - 表格
 
      
      //接口 - 下拉框 列表 
      url_get_select1:'/role/getAll',

      //按钮权限
      isButtonEdit:false,

      //获取 - 表格数据 - 参数
      searchData:{
        name: "",
        page: 1,  //页码
        page_size: 10,   //每页数量
        total:0,  //总页数
        pastureId: ""
      },
      tableLoading: false,
      //表格内容
      tableList:[
        //  { username:"admin", id:100, date:'2023-12-01',email:'测试信息1123',roleList:[2,3] },
        // { username:"epans", id:200, date:'2023-12-01',email:'测试信息1123',roleList:[] },
        // { username:"derek", id:300, date:'2023-12-01',email:'测试信息1123' },
        // { username:"admin", id:100, date:'2023-12-01',email:'测试信息1123' },
        // { username:"epans", id:200, date:'2023-12-01',email:'测试信息1123' },
        // { username:"derek", id:300, date:'2023-12-01',email:'测试信息1123' },
        // { username:"admin", id:100, date:'2023-12-01',email:'测试信息1123' },
        // { username:"epans", id:200, date:'2023-12-01',email:'测试信息1123' },
        // { username:"derek", id:300, date:'2023-12-01',email:'测试信息1123' },
        // { username:"admin", id:100, date:'2023-12-01',email:'测试信息1123' },
        // { username:"epans", id:200, date:'2023-12-01',email:'测试信息1123' },
        // { username:"derek", id:300, date:'2023-12-01',email:'测试信息1123' },
      ],


      
      classList:[
        {id: 1, value: 1},
        {id: 2, value: 2},
        {id: 3, value: 3},
        {id: 4, value: 4},
      ],

      unitList1:[
        {id: 1, value: '整数'},
        {id: 2, value: '保留1位'},
        {id: 3, value: '保留2位'},
        {id: 4, value: '保留3位'},
      ],

      unitList2:[
        {id: 1, value: '整数'},
        {id: 2, value: '保留1位'},
        {id: 3, value: '保留2位'},
        {id: 4, value: '保留3位'},
      ],


    

 


      addFormShow:false,
      addFormStatus: '',
      addFormTxt: {  edit: '修改',  create: '新增' },
      addForm:{
        name:'',id:'' 
      },

      addFormRules:{
        // name: [
        //   { required: true, message: '类型必填', trigger: 'blur' },
        // ],
   

      },

     
       
    }
  },
  created(){
      //获取按钮权限
      const isButtonEdit = checkButtons(this.$store.state.buttonsList, "默认标准参数编辑")
      this.isButtonEdit = isButtonEdit
      console.log('this.isButtonEdit==========',this.isButtonEdit)
     

     //获取下拉框
     // this.get_select_list1()

      //表格 - 初始化 
      this.get_table_data()

     

    
  },
  methods:{

    
    //获取 下拉框
    get_select_list1(){
        var me = this
        ajaxDataGet(me.url_get_select1, {"roleName": "",  "page": 1,   "page_size": 1000}).then(e => {
          console.log("下拉框1：",e)

          //打印请求成功结果
          if(e.data == null || e.data == undefined ||e.data.length == 0   ){
            me.roleList = []
          } else {
            me.roleList = e.data
          }

         
  
        })


        ajaxDataGet('/authdata/pasture', {  "page": 1,   "page_size": 1000}).then(e => {
          console.log("牧场下拉框1：",e)

          //打印请求成功结果
          if(e.data == null || e.data == undefined ||e.data.length == 0   ){
            me.pastureList = []
          } else {
            me.pastureList = e.data
          }
  
        })

    
    },

    
    //获取 表格
    get_table_data() {
 
     var me = this

     me.tableLoading = true
     console.log("searchData======>", me.searchData)

      var send_url = me.url_get_table  

      ajaxDataGet(send_url,  {}).then(e => {
        console.log("表格请求结果：",e)
          //打印请求成功结果
          if(e.code == 200 ){
            me.addForm = e.data

          } else {
            me.$message({ type: 'error', message: '请求默认数据失败！' + e.msg, duration: 2000 })
          }

      
  
        })

       
    },
    //搜索 查询表格
    form_search(){
      var me = this
      console.log('请求表格列表searchData',me.searchData)
      me.get_table_data()

    },

    //重置 表格
    form_clear(){
      var me = this
      me.searchData.name = ""
      me.get_table_data()
    },

    //监听 page_size 改变的事件
    change_size_page(item){
      console.log(item)
     // this.searchData.page_size = item
      //  this.getUserList()
    },

    //监听 page 改变的事件
    change_current_page(item){
      console.log(item)
       this.searchData.page = item
       this.get_table_data()
    },

    //清空弹窗表单信息
    reset_form(){
      this.addForm.name = ''
    },

    //新增
    form_add() {
      this.reset_form()
      this.addFormStatus = 'create'
      this.addFormShow = true
      this.$nextTick(() => {
        this.$refs['addFormRef'].clearValidate()
      })
    },

    //编辑
    form_edit(row) {
      console.log('行内容row=========', row)
      //编辑行内容赋值
      this.addForm = Object.assign({}, row)  
      this.addFormStatus = 'edit'
      this.addFormShow = true
      this.$nextTick(() => {
        this.$refs['addFormRef'].clearValidate()
      })
    },


    //新增关闭
    add_dialog_close(){
       //内容重置
       this.$refs['addFormRef'].resetFields()
    },

    //新增 保存
    add_dialog_save() {
      var me = this
      this.$refs['addFormRef'].validate(valid => {
        //验证成功
        if (valid) {
          //发起请求
          var send_data = {
              "milk_replace_min": me.addForm.milk_replace_min,
              "milk_replace_max": me.addForm.milk_replace_max,
              "class_number": me.addForm.class_number,
              "measurement_decimals": me.addForm.measurement_decimals,
              "ratio_decimals": me.addForm.ratio_decimals,
              "weaning_reminder": parseFloat(me.addForm.weaning_reminder),
              "feed_plan_time_rang": parseFloat(me.addForm.feed_plan_time_rang) 
          }
          console.log("弹窗参数：", send_data)

          //关闭弹窗
          // me.addFormShow = false
         //加载 - 发送新增保存
           ajaxDataPost(me.url_add_table, send_data).then(e => {
                console.log("新增结果：",e)
                //打印请求成功结果
                if(e.code == 200  ){
                  me.$message({ type: 'success', message: '修改成功！'  , duration: 2000 })
         
                  me.get_table_data()
                } else {
                  me.$message({ type: 'error', message: '修改失败！' + e.msg, duration: 2000 })
                }
            })
         
        }
      })
    },
    


    reset_save(){
      var me = this
      ajaxDataPost('/api/v1/ops/base_setting/default_params/reset', {}).then(e => {
                console.log("新增结果：",e)
                //打印请求成功结果
                if(e.code == 200  ){
                  me.$message({ type: 'success', message: '恢复成功！'  , duration: 2000 })
         
                  me.get_table_data()
                } else {
                  me.$message({ type: 'error', message: '恢复失败！' + e.msg, duration: 2000 })
                }
            })
    },
    



 
     
     

  }
}
</script>
<!-- 加了scoped，则是仅在此组件里生效 -->
<style scoped>

</style>