Hello, I have a Suitelet that loads a CSV and send...
# suitescript
i
Hello, I have a Suitelet that loads a CSV and send the file to a MR in order to create items based on the csv information. I want to let the user know that the MR is doing the job via UI on the suitelet, maybe a progress bar or something like that. Is this possible. If so, what would the better approach be?
b
use a progress element, or pick your favorite javascript library that supports progress bars
my current favorite for small things is sweetalert2
i
But for example, how could I be checking the progress on the MR. What I think it can be done is like, attach a CS on the Suitelet and every certain time call the status with n/task and based on that do the progress bar thing
b
usually use setTimeout or setInterval
m
I did this in a recent project using a small Vue.js "SPA" inside an inline html field.
message has been deleted
b
that does a very good job matching netsuite's look
i
That looks really cool @michoel!
b
@michoel Is it possible to share a sample code or the approach how to add vuejs SPA to netsuite? I think that would help me with one of my issues and I would also love to know how to use vuejs in NetSuite in general.
m
@Bibek Shrestha this is the approach I took in the screenshot I shared. I created a module with the app like the below and set that as the defaultValue of an inline html field in a suitelet
Copy code
define([], () => (name) => `
  <script src="<https://unpkg.com/vue@3.0.11/dist/vue.global.prod.js>"></script>
  
  <style>
    /* your styles here */
  </style>
  
  <div id="vue-app">
    <!-- app will be injected here -->
  </div>
  
  <script type="x-template" id="vue-app-template">
    <!-- your vue template here -->
    <div>
      <h1>Hello {name}!<h1>
    </div>
  </script>
  
  <script>  
    const VueApp = {
      template: "#vue-app-template",
      data() {
        return {
          name: ${name},
        };
      }
    };

    Vue.createApp(VueApp).mount("#vue-app");

  </script>
`);
Haven't tested the code so hopefully if it doesn't run it's enough to give you the idea. For a full blown SPA with all the Vue.js dev tooling have a look at this project https://github.com/michoelchaikin/netsuite-mapreduce-util Lastly NetSuite is working on native SPA support coming sometime https://static.rainfocus.com/oracle/sw19/sess/15440757164520014GNg/PDFPF%20/Dev1306_TUES_1553540072892001ZwOR.pdf
🎉 1
b
@michoel Thanks for the resource.
s
super cool stuff @michoel