HOPE THIS WILL HELP YOU !!!!!


odoo.define('custom_module_pos.widget_example', function (require) {
"use strict";

var chrome = require("point_of_sale.chrome");
var PosBaseWidget = require('point_of_sale.BaseWidget');

chrome.Chrome.include({
        build_widgets: function(){
            this.widgets.push({
                'name':   'shopname',
                'widget': ShopnameWidget,
                'replace':  '.placeholder-ShopnameWidget'});
            this._super();
        },
    });

var ShopnameWidget = PosBaseWidget.extend({
    template: 'ShopnameWidget',
    init: function(parent, options){
        options = options || {};
        this._super(parent,options);
    },
    renderElement: function(){
        var self = this;
        this._super();
    },
    get_shopname: function(){
        var branch = this.pos.pos_session.branch_id;
        if(branch){
            return branch[1];
        }else{
            return "";
        }
    },
});
return {
        'ShopnameWidget': ShopnameWidget,
    };
}); 


XML:
<t t-extend="Chrome">
    <t t-jquery='.pos-topheader' t-operation='replace'>
        <div class="pos-topheader">
            <div class="pos-branding">                
                <img class="pos-logo" src="/point_of_sale/static/src/img/logo.png" />
                <span class="placeholder-ShopnameWidget"></span>
                <span class="placeholder-UsernameWidget"></span>
            </div>
            <div class="pos-rightheader">
                <span class="placeholder-OrderSelectorWidget"></span>
                <!-- here goes header buttons -->
            </div>
        </div>
    </t>
</t>

<t t-name="ShopnameWidget">
    <span class="shop-name">
        <t t-esc="widget.get_shopname()" />
    </span>
</t>