x-spreadsheet 在线表格 集成 odoo 13.14.15.16.17

文章介绍了x-spreadsheet如何作为插件集成到Odoo中,提供了在线打印、数据批量新增和修改接口、Excel导出等功能,并通过前端和后端的调用示例展示其易用性。该插件对所有数据模型适用,简化了开发过程。
摘要由CSDN通过智能技术生成

x-spreadsheet在线表格插件 集成odoo模块,集成了在线打印,模型数据批量新增,修改接口,excel导出,以上功能统一做了封装,直接按照指定格式调用即可。

1.前端调用:

  <record model="ir.actions.client" id="x_spreadsheet_action">
            <field name="name">Excel</field>
            <field name="tag">x_spreadsheet_temp</field>
 </record>

 <menuitem name="Excel" id="spreadSheet_menu" action="x_spreadsheet_action" sequence="1"/>

2.后端python调用

def test(self): 
    return  {
            'name':'excel',
            'type': 'ir.actions.client',
            'tag': 'x_spreadsheet_temp',
            'params': {
                'model':self._context.get('active_model', None),
                'method':'load',
                'fields':'default_code%name%list_price%categ_id',
                'load_id':'all',
                'rows_len':1000,
                'file_name':'产品'
            }
        }

3. 数据载入,数据新增,数据修改 统一调用封装的方法和后端api来处理。适用于所有数据模型,其他代码不用写,不用关注

常用方法实例:

//载入中文语言包
 x_spreadsheet.locale('zh-cn');
 //引用js后,初始化
 var xs = x_spreadsheet('#x-spreadsheet-demo');
 
// 加载数据
  xs.loadData(data);
 
 // 获取数据 d
  const d = xs.getData();

 // 如
  xs.change(function(data){
    // 默认会返回整个数据 json
  });

  xs.on('cell-selected', function(cell, ri, ci) {
    // to do ...
  });

使用效果:

自定义工具栏 +事件绑定,配合api可以做很多功能实现。

打印

多样式定义:

 

后端封装开发功能。

 前端代码下载:x-spreadsheet在线表格 集成odoo13.14.15.16: x-spreadsheet在线表格插件 集成odoo模块,集成了在线打印,模型数据批量新增,修改接口,excel导出,以上功能统一做了封装,直接按照指定格式调用即可。icon-default.png?t=N7T8https://gitee.com/zxltwins/x-spreadsheet

Vue + x-data-spreadsheet 是一种结合了 Vue.js 框架和 x-data-spreadsheet 库来实现在线Excel表格功能的方法。x-data-spreadsheet 是一个基于 Vue 的表格组件库,可以实现类似 Excel 的表格操作功能。 以下是一个简单的实现示例: 首先,你需要安装 x-data-spreadsheet: ```shell npm install x-data-spreadsheet --save ``` 然后,在你的 Vue 组件中引入并使用 x-data-spreadsheet: ```vue <template> <div> <x-data-spreadsheet v-model="spreadsheet" :config="config" @cell-value-changed="onCellValueChanged" @selection-changed="onSelectionChanged" /> </div> </template> <script> import XDataSpreadsheet from 'x-data-spreadsheet'; import 'x-data-spreadsheet/dist/index.css'; export default { components: { XDataSpreadsheet, }, data() { return { spreadsheet: {}, // 用于绑定数据,可以是数组或对象 config: { width: 800, height: 600, defaultColWidth: 80, defaultRowHeight: 20, // 其他配置... }, }; }, methods: { onCellValueChanged(row, col, value) { // 单元格值变化时的回调函数 }, onSelectionChanged(start, end, cells) { // 选区变化时的回调函数 }, }, }; </script> ``` 在上面的代码中,我们创建了一个 Vue 组件,其中包含了 x-data-spreadsheet 组件的实例。我们使用 `v-model` 绑定了 `spreadsheet` 数据,这个数据将代表表格的内容。`config` 对象用于配置表格的基本属性,例如宽度、高度等。我们还定义了两个方法 `onCellValueChanged` 和 `onSelectionChanged`,用于处理单元格值变化和选区变化的事件。 为了实现在线Excel表格功能,你需要根据实际需求编写业务逻辑代码,比如处理数据的增删改查等。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值