使用react-web-tabs将视图重置为默认选项卡

时间:2019-04-01 03:21:59

标签: reactjs

我的默认标签是收入。我在选项卡顶部有一个下拉组件。如果下拉菜单中的值更改,则需要将视图重置为默认选项卡(收入)。请帮助我。

    # -*- coding: utf-8 -*-

import datetime
import calendar
calendar.setfirstweekday(calendar.SUNDAY)

from odoo import models, fields, api

class HrMission(models.Model):
    _name = "hr.employee.mission"
    _description = "hr mission"
    _inherit = "hr.employee.mission"

    days_compensation =fields.Float(compute='get_compensation', compstring='Jours de récupération', help="Jours de récupération si la mission contient les jours de repos",
                             required=True, readonly=True,)

    @api.multi
    @api.depends('mission_start_date', 'mission_end_date')
    def get_compensation(self):
        for rec in self:
            if rec.mission_start_date and rec.mission_end_date:
                time1 = datetime.datetime.strptime(rec.mission_start_date, "%Y-%m-%d")
                time2 = datetime.datetime.strptime(rec.mission_end_date, "%Y-%m-%d")
                week = {}
                leave_value = {}
        # Compute Number Of Friday And Saturday
                for i in range((time2 - time1).days):
                    day = calendar.day_name[(time1 + datetime.timedelta(days=i+1)).weekday()]
                    week[day] = week[day] + 1 if day in week else 1                    
                fri = week.get('Friday')  # Result Number 4 Of Friday If "Start Date", "End date" --> "01/01/2017", "31/01/2017"
                sat = week.get('Saturday') # Same thing that friday
                friandsat = mon + sat # Error ---> "TypeError: unsupported operand type(s) for +: 'NoneType' and 'NoneType'"
                rec.days_compensation = friandsat

1 个答案:

答案 0 :(得分:0)

将defaultTab值设置为状态,这样它就可以是动态的,并在需要时进行相应的更新(在您的情况下,下拉组件的onChange值。

例如

 class TabSample extends React.Component {

    state = {
      defaultTab: 'Income'
    }

    onDropdownChange = () => {
     // reset default tab value to initial state
     this.setState({defaultTab: 'Income'})
    }

    render(){
     const { defaultTab } = this.state;
     return <Tabs
              defaultTab={defaultTab}
              onChange={(tabId) => { console.log(tabId) }}>
              <TabList>
                <Tab tabFor="income">Income</Tab>
                <Tab tabFor="expense">Expense</Tab>
                <Tab tabFor="liability">Liabilities</Tab>
              </TabList>
              <TabPanel tabId="income">
               <p>Income</p>
              </TabPanel>
              <TabPanel tabId="expense">
                <p>Expense</p>
              </TabPanel>
              <TabPanel tabId="liability">
                <p>Liability</p>
              </TabPanel>
            </Tabs>
     }

    }