9、odoo高级视图

偏执的太偏执、 2022-11-12 13:45 200阅读 0赞

### 14、高级视图 ###

[点我下载完整odoo的demo][odoo_demo]

#### 列表视图与日历视图 ####

##### Tree views列表视图 #####

可以通过一些额外的属性控制其行为

colors属性

语法 颜色：条件 如果条件为真，则列表行显示为前面的颜色，多个颜色条件之前用分号分割

odoo10中 由于使用了bootstrap主题 所以此属性发生了改变

decoration-\{$name\} = 值 对每条记录添加行的样式

\{$name\} 可以是 bf (font-weight: bold), it (font-style: italic),或 bootstrap contextual color (danger,info, muted, primary, success or warning)值是一个python表达式。表达式可以引用到tree关联记录的字段以及uid（当前用户 int）current\_date（当前时间 格式yyyy-MM-dd字符串）

*  editable = top或bottom 设置行内编辑功能（top从上方添加新行 bottom下方）

对课时行颜色进行设置 小于5天显示为蓝色 大于15天为红色

myproject/my\_first\_app/views/session\_views.xml

<record model="ir.ui.view" id="session_tree_view">
                <field name="name">session.tree</field>
                <field name="model">myproject.session</field>
                <field name="arch" type="xml">
                    <tree string="session Tree" decoration-info="duration<5" decoration-danger="duration>15">
                        <field name="name"/>
                        <field name="course_id"/>
                        <field name="duration"/>
                        <field name="start_date"/>
                        <field name="seats"/>
                        <field name="taken_seats" widget="progressbar"/>
                    </tree>
                </field>
            </record>

注意 这里需要html转义 更多转义代码请参考[这里][Link 1]

decoration-info="duration<5" decoration-danger="duration>15"
    < 表示小于号
    > 表示大于号

效果图如下：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center]

#### Calendars日历视图 ####

常用的3个属性

color 关联字段值 根据此值 相同的值会分配相同的颜色 可以用color字段手动设置颜色

date\_start与date\_end 日历中的事件开始结束时间

其中的field标签定义了每个事件显示的标签

给课时添加日历视图

添加 end\_date 自动 通过start\_date 和 duration自动计算而来

同时添加inverse方法 当设置end\_date的值时 反向改变关联的字段的值

设置完成后，事件就可以在日历拖动了

myproject/my\_first\_app/models/session.py

from datetime import timedelta

taken_seats = fields.Float(string="参与人数百分比", compute='_taken_seats')
    end_date = fields.Date(string="结束时间", store=True,
                               compute='_get_end_date', inverse='_set_end_date')

@api.depends('start_date', 'duration')
        def _get_end_date(self):
            for r in self:
                if not (r.start_date and r.duration):
                    r.end_date = r.start_date
                    continue
                # Add duration to start_date, but: Monday + 5 days = Saturday, so
                # subtract one second to get on Friday instead
                start = fields.Datetime.from_string(r.start_date)
                duration = timedelta(days=r.duration, seconds=-1)
                r.end_date = start + duration
        def _set_end_date(self):
            for r in self:
                if not (r.start_date and r.end_date):
                    continue
                # Compute the difference between dates, but: Friday - Monday = 4 days,
                # so add one day to get 5 days instead
                start_date = fields.Datetime.from_string(r.start_date)
                end_date = fields.Datetime.from_string(r.end_date)
                r.duration = (end_date - start_date).days + 1

myproject/my\_first\_app/views/session\_views.xml

<record model="ir.ui.view" id="session_calendar_view">
        <field name="name">session.calendar</field>
        <field name="model">myproject.session</field>
        <field name="arch" type="xml">
            <calendar mode="month" string="Session Calendar" date_start="start_date" date_stop="end_date" color="instructor_id">
                <field name="name"/>
            </calendar>
        </field>
    </record>

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 1]

在动作视图中添加显示日历：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 2]

更新应用后，效果如图：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 3]

#### 搜索视图与甘特图 ####

##### 搜索视图Search views #####

search的可以设置一个filter\_domain属性用来覆盖原field的domain条件，其中的self代表用户的输入值。

*  field字段用来定义默认给出的过滤选项。
 *  另外可以用预定义一些搜索条件的快捷方式。
 *  domain添加过滤条件 context添加分组条件
    
        <search string="Ideas">
          	<field name="name"/>
        	<field name="description" string="Name and description" filter_domain="['|', ('name', 'ilike', self), ('description', 'ilike', self)]"/>
          	<field name="inventor_id"/>
        	<field name="country_id" widget="selection"/>
          	<filter name="my_ideas" string="My Ideas" domain="[('inventor_id', '=', uid)]"/>
         	<group string="Group By">
              	<filter name="group_by_inventor" string="Inventor" context="{ 'group_by': 'inventor_id'}"/>
          	</group>
        </search>
    
    在action里通过search\_view\_id指定搜索视图  
    在action中还能通过在context里指定默认开启的搜索条件，使用\{‘search\_default\_field\_name’:1\} field\_name为搜索视图中filter对应的名称，1表示真值。

添加 my\_courses filter 过滤出我所负责的课程 ，添加负责人分组

myproject/my\_first\_app/views/course\_views.xml

<record model="ir.ui.view" id="course_view_search">
                <field name="name">course.search</field>
                <field name="model">myproject.course</field>
                <field name="arch" type="xml">
                    <search>
                        <field string="名称" name="name"/>
                        <field name="name"/>
                        <field name="description"/>
                        <filter name="my_courses" string="我的课程" domain="[('responsible_id','=',uid)]"/>
                        <filter string="男" name="sex_male" domain="[('sex', '=', True)]"/>
                        <filter string="女" name="sex_female" domain="[('sex', '=', False)]"/>
    
                        <filter string="性别" context="{ 'group_by':'sex'}" name="sex"/>
                        <group string="分组">
                            <filter name="by_responsible" string="Responsible" context="{ 'group':'responsible_id'}"/>
                        </group>
                    </search>
                </field>
            </record>

<record id="course_list_action" model="ir.actions.act_window">
                <field name="name">课程</field>
                <field name="res_model">myproject.course</field>
                <field name="view_mode">tree,form</field>
                <field name="view_id" ref="course_tree_view"/>
                <field name="help" type="html">
                    <p class="o_view_nocontent_smiling_face">
                        Setup a new automated automation
                    </p>
                </field>
                
                <field name="context" eval="{ 'search_default_my_courses': 1}"/>
                <field name="groups_id" eval="[(4, ref('base.group_user'))]"/>
            </record>

效果图如下：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 4]

#### 甘特图Gantt ####

用来直观的显示进度

创建hours计算字段 表示课时的持续时长小时数  
myproject/my\_first\_app/models/session.py

end_date = fields.Date(string="结束时间", store=True,
                               compute='_get_end_date', inverse='_set_end_date')
    hours = fields.Float(string="Duration in hours",
                         compute='_get_hours', inverse='_set_hours')
    
    @api.depends('duration')
    def _get_hours(self):
        for r in self:
            r.hours = r.duration * 24
    
            def _set_hours(self):
                for r in self:
                    r.duration = r.hours / 24

创建session的甘特视图

myproject/my\_first\_app/views/session\_views.xml

<record model="ir.ui.view" id="session_gantt_view">
        <field name="name">session.gantt</field>
        <field name="model">myproject.session</field>
        <field name="arch" type="xml">
            <gantt string="Session Gantt" date_start="start_date" date_delay="hours" default_group_by='instructor_id'>
            </gantt>
        </field>
    </record>
    
    <record id="session_list_action" model="ir.actions.act_window">
        <field name="name">讲座</field>
        <field name="res_model">myproject.session</field>
        <field name="view_mode">tree,form,calendar,gantt</field>
        <field name="view_id" ref="session_tree_view"/>
        <field name="groups_id" eval="[(4, ref('base.group_user'))]"/>
    </record>

date\_delay 对应时长为小时

#### 图表视图、数据透视图与看板视图 ####

##### **图表视图Graph views** #####

用于显示一个model的多种统计图表，支持以下三种，通过type属性指定。

**视图类型**：

1、Bar 柱状图（不写type默认为bar）

2、Line 条形图

3、Pie 饼图

**Graph图表视图只支持3种type，pivot算是单独的view。**

[点我下载完整odoo的demo][odoo_demo]

**Pivot 数据透视表**

**视图属性**

stacked=”True” 设置堆叠条形图

orientation=”vertical” 显示方式 horizontal 或 vertical

interval=”day” 时间间隔 只在bar图里生效

**视图字段属性**

row默认 measure禁用分组

视图中field字段有一个type属性用来指定聚合方式，有两个值可选

**注意**

graph的field如果是计算字段 必须store=True

添加课程人数图表

myproject/my\_first\_app/models/session.py中session类增加方法：

attendees_count = fields.Integer(
            string="Attendees count", compute='_get_attendees_count', store=True)
    # attendees_count 图表视图
    @api.depends('attendee_ids')
    def _get_attendees_count(self):
        for r in self:
            r.attendees_count = len(r.attendee_ids)

myproject/my\_first\_app/views/session\_views.xml增加一个记录：

<record model="ir.ui.view" id="session_graph_view">
        <field name="name">session.graph</field>
        <field name="model">myproject.session</field>
        <field name="arch" type="xml">
            <graph string="Session Graph">
                <field name="course_id"/>
                <field name="attendees_count" type="measure"/>
            </graph>
        </field>
    </record>
    
    <record id="session_list_action" model="ir.actions.act_window">
        <field name="name">讲座</field>
        <field name="res_model">myproject.session</field>
        <field name="view_mode">tree,form,calendar,gantt,graph</field>
        <field name="view_id" ref="session_tree_view"/>
        <field name="groups_id" eval="[(4, ref('base.group_user'))]"/>
    </record>

更新应有后，效果如下：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 5]

##### Pivot数据透视表 #####

因为pivot算是单独的view，pivot要展示出来,需要在model=”ir.actions.act\_window”，view\_mode补上pivot.

myproject/my\_first\_app/views/myproject\_view.xml在id="session\_list\_action"的记录中name="view\_mode"的firld中添加一个pivot，意思就是显示pivot：

<record id="session_list_action" model="ir.actions.act_window">
        <field name="name">讲座</field>
        <field name="res_model">myproject.session</field>
        <field name="view_mode">tree,form,calendar,gantt,graph,pivot</field>
        <field name="view_id" ref="session_tree_view"/>
        <field name="groups_id" eval="[(4, ref('base.group_user'))]"/>
    </record>

更新应用后，效果如图：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 6]

##### 看板视图Kanban #####

常用来展示任务或产品开发的进度。kanban视图包含很多卡片，卡片在一个个的列表组中，一个卡片代表一条记录，一个列表代表聚合字段。例如产品任务卡片可以分在不同的产品阶段中或不同的负责人中。  
kanban xml中每个card是用qweb格式定义。

通过kanban显示课时 以课程作为组。

myproject/my\_first\_app/models/session.py，在session类中增加一个color字段：

attendees_count = fields.Integer(
            string="Attendees count", compute='_get_attendees_count', store=True)
    color = fields.Integer()

myproject/my\_first\_app/views/session\_views.xml增加一个看板记录，并在act\_window中显示出来：

<record model="ir.ui.view" id="session_kanban_view">
                <field name="name">session.kanban</field>
                <field name="model">myproject.session</field>
                <field name="arch" type="xml">
                    <kanban default_group_by="course_id">
                        <field name="color"/>
                        <templates>
                            <t t-name="kanban-box">
                                <div t-attf-class="oe_kanban_color_{ {kanban_getcolor(record.color.raw_value)}} oe_kanban_global_click_edit oe_semantic_html_override oe_kanban_card { {record.group_fancy==1 ? 'oe_kanban_card_fancy': ''}}">
                                    <div class="oe_dropdown_kanban">
                                        <div class="oe_dropdown_toggle">
                                            <i class="fa fa-bars fa-lg"/>
                                            <ul class="oe_dropdown_menu">
                                                <li>
                                                    <a type="delete">Delete</a>
                                                </li>
                                                <li>
                                                    <ul class="oe_kanban_colorpicker"/>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="oe_clear">
    
                                        </div>
                                    </div>
                                    <div t-attf-class="oe_kanban_content">
                                        Session name:
                                        <field name="name"/>
                                        <br/>
                                        Start date:
                                        <field name="start_date"/>
                                        duration:
                                        <field name="duration"/>
                                    </div>
                                </div>
                            </t>
                        </templates>
                    </kanban>
                </field>
            </record>
            
            <record id="session_list_action" model="ir.actions.act_window">
                <field name="name">讲座</field>
                <field name="res_model">myproject.session</field>
                <field name="view_mode">tree,form,calendar,gantt,graph,pivot,kanban</field>
                <field name="view_id" ref="session_tree_view"/>
                <field name="groups_id" eval="[(4, ref('base.group_user'))]"/>
            </record>

说明：default\_group\_by=”course\_id” 分组字段，表示按course\_id进行分组。

更新应用后，效果如图：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 7]  
[点我下载完整odoo的demo][odoo_demo]

## 后记 ##

【后记】为了让大家能够轻松学编程，我创建了一个公众号【轻松学编程】，里面有让你快速学会编程的文章，当然也有一些干货提高你的编程水平，也有一些编程项目适合做一些课程设计等课题。

也可加我微信【1257309054】，拉你进群，大家一起交流学习。  
如果文章对您有帮助，请我喝杯咖啡吧！

公众号

![公众号][20200317124808234.jpg]

![赞赏码][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70]

关注我，我们一起成长~~

[odoo_demo]: https://download.csdn.net/download/lm_is_dc/16818292
[Link 1]: http://tool.oschina.net/commons?type=2
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center]: /images/20221022/6e0af9836ace4ca0a744c71a66f3b0d4.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221022/5666ddb20642477984dd7d971e2e4e22.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 2]: /images/20221022/a97e0b13d2e9403c99100987ccd91955.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 3]: /images/20221022/dc82d2d795474c05afa10f4ea3d60f8b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 4]: /images/20221022/03b25e5e0f704991859e96246953cc54.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 5]: /images/20221022/c5a1a334d9924913b730174fafef79ef.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 6]: /images/20221022/2f8d2d6df1d4419da43f3a0d9685d7f9.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70_pic_center 7]: /images/20221022/8a0121c6f3d84a12a4491ab7bcd1f981.png
[20200317124808234.jpg]: /images/20221022/fd92cd5beded4a05806ef3350eb07904.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xtX2lzX2Rj_size_16_color_FFFFFF_t_70]: /images/20221022/cd76300058e04c3a9e6844bf4c627ff9.png