<div ng-if="item.designAvailable.product_id || (item.designJob.id && item.designJob.status === 'done')"
    style="margin-bottom: 7px; margin-top: 16px">
    <div style="margin-bottom: 10px;">
        <strong>{{ __('Sản phẩm đã có design.') }}</strong>
        <span>(Tạo design job nếu bạn muốn sửa lại design.)</span>
    </div>
        <textarea ng-model="item.newDesignJob.note" placeholder="Note" rows="2" id="note" class="form-control"
            style="resize: vertical">
    </textarea>
    <div class="redesign-fooer">
        <div class="checkbox-wrap">
            <input id="fulfil-redesign" type="checkbox" class="form-check-input"
                ng-model="item.newDesignJob.is_redesign" ng-checked="item.newDesignJob.is_redesign">
            <label for="fulfil-redesign">Thiết kế lại sản phẩm</label>
        </div>
        <div class="checkbox-wrap job_type">
            <label for="job_type">Loại sản phẩm</label>
            <select id="job_type" class="select chosse-input" ng-model="item.newDesignJob.job_type">
                <option value="2D">2D</option>
                <option value="3D">3D</option>
            </select>
        </div>
    </div>
    <button class="btn btn-primary createDesignJob" ng-click="createDesignJob(item)">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> <path stroke="none" d="M0 0h24v24H0z" fill="none"/> <path d="M4 15.5c3 -1 5.5 -.5 8 4.5c.5 -3 1.5 -5.5 3 -8" /> <path d="M18 9a2 2 0 1 1 0 -4a2 2 0 0 1 0 4z" /> </svg>
        {{ __('Tạo Design Job') }}
    </button>
</div>
<div style="margin-bottom: 7px; margin-top: 16px" ng-if="item.designJob.id">
    <div style="margin-bottom: 10px;">
        <strong>{{ __('DesignJob') }}</strong>
    </div>
    <div>
        <span><strong>Code: </strong>
            <div class="status-design-job">DJ@{{ item.designJob.id }}</div>
        </span>
        <br>
        <span><strong>Created at: </strong>
            @{{ summarizeTime(item.designJob.created_at) }}
            @{{ toVietnameseDate(item.designJob.created_at, true) }} (GMT+7)
        </span>
        <br>
        <span><strong>Status: </strong>
            <div class="status-design-job">@{{ item.designJob.status }}</div>
        </span>
        <br>
        <span><strong>Creator: </strong>
            <div class="status-design-job">@{{ item.designJob.creator ? item.designJob.creator.name : 'System' }}</div>
        </span>
        <br>
        <span><strong>Designer: </strong>: @{{ item.designJob.designer ? item.designJob.designer.name : 'Chưa có ai' }}</span>
        <div class="pre-note" ng-if="item.designJob.note">
            <strong>Note: </strong>
            @{{ item.designJob.note }}
        </div>
        <div class="pre-note" ng-if="item.designJob.attributes.outsource_note">
            <strong>Outsource Note: </strong>
            @{{ item.designJob.attributes.outsource_note }}
        </div>
        <div class="pre-note" ng-if="item.designJob.attributes.confirm_job_reason">
            <strong>Lí do confirm: </strong>
            @{{ item.designJob.attributes.confirm_job_reason }}
        </div>
        <div ng-if="item.designJob.attributes.is_confirm">
            <span class="text-danger">Design đang đi confirm chưa fulfill được</strong>
        </div>
        <div ng-if="item.designJob.attributes.link_mockup">
            <label>Link Mockup: </label>
            <span class="text-danger word-break">@{{ item.designJob.attributes.link_mockup }}</strong>
        </div>
        <div ng-if="item.designJob.attributes.link_folder">
            <label>Link mockup + temp: </label>
            <span class="text-danger word-break">@{{ item.designJob.attributes.link_folder }}</strong>
        </div>
    </div>
</div>
