ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-14 01:25:37 -05:00
Code Issues Packages Projects Releases Wiki Activity

add dashboard and tabbedPanel samples (#9894)

Browse Source 
* add dashboard and tabbedPanel samples

* comments
This commit is contained in:
Alan Ren
2020-04-08 15:35:29 -07:00
committed by GitHub
parent b93f43d1c2
commit db49a146b0
11 changed files with 294 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
samples/sqlservices/images/compare-inverse.svg Normal file
View File

@@ -0,0 +1,10 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path d="M13 8C13.4115 8 13.7995 8.08073 14.1641 8.24219C14.5286 8.39844 14.8464 8.61198 15.1172 8.88281C15.388 9.15365 15.6016 9.47135 15.7578 9.83594C15.9193 10.2005 16 10.5885 16 11C16 11.4115 15.9193 11.7995 15.7578 12.1641C15.6016 12.5286 15.388 12.8464 15.1172 13.1172C14.8464 13.388 14.5286 13.6042 14.1641 13.7656C13.7995 13.9219 13.4115 14 13 14C12.6875 14 12.3828 13.9531 12.0859 13.8594C11.7891 13.7656 11.5156 13.6276 11.2656 13.4453C11.1823 13.5286 11.0417 13.6745 10.8438 13.8828C10.651 14.0859 10.4271 14.3203 10.1719 14.5859C9.91667 14.8464 9.64583 15.1198 9.35938 15.4062C9.07812 15.6875 8.8125 15.9479 8.5625 16.1875C8.3125 16.4219 8.09115 16.6172 7.89844 16.7734C7.70573 16.9245 7.57292 17 7.5 17C7.36458 17 7.2474 16.9505 7.14844 16.8516C7.04948 16.7526 7 16.6354 7 16.5C7 16.4271 7.07552 16.2943 7.22656 16.1016C7.38281 15.9089 7.57812 15.6875 7.8125 15.4375C8.05208 15.1875 8.3125 14.9219 8.59375 14.6406C8.88021 14.3542 9.15365 14.0833 9.41406 13.8281C9.67969 13.5729 9.91406 13.349 10.1172 13.1562C10.3255 12.9583 10.4714 12.8177 10.5547 12.7344C10.3724 12.4844 10.2344 12.2109 10.1406 11.9141C10.0469 11.6172 10 11.3125 10 11C10 10.5885 10.0781 10.2005 10.2344 9.83594C10.3958 9.47135 10.612 9.15365 10.8828 8.88281C11.1536 8.61198 11.4714 8.39844 11.8359 8.24219C12.2005 8.08073 12.5885 8 13 8ZM13 13C13.2708 13 13.5286 12.9479 13.7734 12.8438C14.0182 12.7344 14.2292 12.5911 14.4062 12.4141C14.5885 12.2318 14.7318 12.0208 14.8359 11.7812C14.9453 11.5365 15 11.276 15 11C15 10.7292 14.9453 10.4714 14.8359 10.2266C14.7318 9.98177 14.5885 9.77083 14.4062 9.59375C14.2292 9.41146 14.0182 9.26823 13.7734 9.16406C13.5286 9.05469 13.2708 9 13 9C12.724 9 12.4635 9.05469 12.2188 9.16406C11.9792 9.26823 11.7682 9.41146 11.5859 9.59375C11.4089 9.77083 11.2656 9.98177 11.1562 10.2266C11.0521 10.4714 11 10.7292 11 11C11 11.276 11.0521 11.5365 11.1562 11.7812C11.2656 12.0208 11.4089 12.2318 11.5859 12.4141C11.7682 12.5911 11.9792 12.7344 12.2188 12.8438C12.4635 12.9479 12.724 13 13 13ZM2 12V10H0V1H12V3H14V7.14062C13.8333 7.09896 13.6667 7.0651 13.5 7.03906C13.3333 7.01302 13.1667 7 13 7V4H3V11H9C9 11.1667 9.01302 11.3333 9.03906 11.5C9.0651 11.6667 9.09896 11.8333 9.14062 12H2ZM2 9V3H11V2H1V9H2Z" fill="#4894FE"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

10
samples/sqlservices/images/compare.svg Normal file
View File

@@ -0,0 +1,10 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path d="M13 8C13.4115 8 13.7995 8.08073 14.1641 8.24219C14.5286 8.39844 14.8464 8.61198 15.1172 8.88281C15.388 9.15365 15.6016 9.47135 15.7578 9.83594C15.9193 10.2005 16 10.5885 16 11C16 11.4115 15.9193 11.7995 15.7578 12.1641C15.6016 12.5286 15.388 12.8464 15.1172 13.1172C14.8464 13.388 14.5286 13.6042 14.1641 13.7656C13.7995 13.9219 13.4115 14 13 14C12.6875 14 12.3828 13.9531 12.0859 13.8594C11.7891 13.7656 11.5156 13.6276 11.2656 13.4453C11.1823 13.5286 11.0417 13.6745 10.8438 13.8828C10.651 14.0859 10.4271 14.3203 10.1719 14.5859C9.91667 14.8464 9.64583 15.1198 9.35938 15.4062C9.07812 15.6875 8.8125 15.9479 8.5625 16.1875C8.3125 16.4219 8.09115 16.6172 7.89844 16.7734C7.70573 16.9245 7.57292 17 7.5 17C7.36458 17 7.2474 16.9505 7.14844 16.8516C7.04948 16.7526 7 16.6354 7 16.5C7 16.4271 7.07552 16.2943 7.22656 16.1016C7.38281 15.9089 7.57812 15.6875 7.8125 15.4375C8.05208 15.1875 8.3125 14.9219 8.59375 14.6406C8.88021 14.3542 9.15365 14.0833 9.41406 13.8281C9.67969 13.5729 9.91406 13.349 10.1172 13.1562C10.3255 12.9583 10.4714 12.8177 10.5547 12.7344C10.3724 12.4844 10.2344 12.2109 10.1406 11.9141C10.0469 11.6172 10 11.3125 10 11C10 10.5885 10.0781 10.2005 10.2344 9.83594C10.3958 9.47135 10.612 9.15365 10.8828 8.88281C11.1536 8.61198 11.4714 8.39844 11.8359 8.24219C12.2005 8.08073 12.5885 8 13 8ZM13 13C13.2708 13 13.5286 12.9479 13.7734 12.8438C14.0182 12.7344 14.2292 12.5911 14.4062 12.4141C14.5885 12.2318 14.7318 12.0208 14.8359 11.7812C14.9453 11.5365 15 11.276 15 11C15 10.7292 14.9453 10.4714 14.8359 10.2266C14.7318 9.98177 14.5885 9.77083 14.4062 9.59375C14.2292 9.41146 14.0182 9.26823 13.7734 9.16406C13.5286 9.05469 13.2708 9 13 9C12.724 9 12.4635 9.05469 12.2188 9.16406C11.9792 9.26823 11.7682 9.41146 11.5859 9.59375C11.4089 9.77083 11.2656 9.98177 11.1562 10.2266C11.0521 10.4714 11 10.7292 11 11C11 11.276 11.0521 11.5365 11.1562 11.7812C11.2656 12.0208 11.4089 12.2318 11.5859 12.4141C11.7682 12.5911 11.9792 12.7344 12.2188 12.8438C12.4635 12.9479 12.724 13 13 13ZM2 12V10H0V1H12V3H14V7.14062C13.8333 7.09896 13.6667 7.0651 13.5 7.03906C13.3333 7.01302 13.1667 7 13 7V4H3V11H9C9 11.1667 9.01302 11.3333 9.03906 11.5C9.0651 11.6667 9.09896 11.8333 9.14062 12H2ZM2 9V3H11V2H1V9H2Z" fill="#015CDA"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

8
samples/sqlservices/images/default.svg Normal file
View File

@@ -0,0 +1,8 @@
<svg id="a1d7ddca-c328-42f3-98f4-094c61aadb49" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
<title>Icon-other-345</title>
<polygon points="16.18 4.79 16.18 13.25 8.87 17.5 8.87 9.03 16.18 4.79" fill="#32bedd"/>
<polygon points="16.18 4.79 8.87 9.04 1.55 4.78 8.87 0.53 16.18 4.79" fill="#9cebff"/>
<polygon points="8.87 9.04 8.87 17.5 1.55 13.25 1.55 4.78 8.87 9.04" fill="#50e6ff"/>
<polygon points="1.55 13.25 8.87 9.03 8.87 17.5 1.55 13.25" fill="#9cebff"/>
<polygon points="16.18 13.25 8.87 9.03 8.87 17.5 16.18 13.25" fill="#50e6ff"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 593 B

10
samples/sqlservices/images/group.svg Normal file
View File

@@ -0,0 +1,10 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path d="M12.7812 5.41406C13.1198 5.58594 13.4245 5.79948 13.6953 6.05469C13.9714 6.30469 14.2057 6.58594 14.3984 6.89844C14.5911 7.20573 14.7396 7.53906 14.8438 7.89844C14.9479 8.2526 15 8.61979 15 9H14C14 8.58854 13.9193 8.20052 13.7578 7.83594C13.6016 7.47135 13.388 7.15365 13.1172 6.88281C12.8464 6.61198 12.5286 6.39844 12.1641 6.24219C11.7995 6.08073 11.4115 6 11 6C10.5885 6 10.2005 6.08073 9.83594 6.24219C9.47135 6.39844 9.15365 6.61198 8.88281 6.88281C8.61198 7.15365 8.39583 7.47135 8.23438 7.83594C8.07812 8.20052 8 8.58854 8 9C8 9.47396 7.89062 9.92448 7.67188 10.3516C7.45833 10.7786 7.16146 11.1328 6.78125 11.4141C7.11979 11.5859 7.42448 11.7995 7.69531 12.0547C7.97135 12.3047 8.20573 12.5859 8.39844 12.8984C8.59115 13.2057 8.73958 13.5391 8.84375 13.8984C8.94792 14.2526 9 14.6198 9 15H8C8 14.5885 7.91927 14.2005 7.75781 13.8359C7.60156 13.4714 7.38802 13.1536 7.11719 12.8828C6.84635 12.612 6.52865 12.3984 6.16406 12.2422C5.79948 12.0807 5.41146 12 5 12C4.58854 12 4.20052 12.0807 3.83594 12.2422C3.47135 12.3984 3.15365 12.612 2.88281 12.8828C2.61198 13.1536 2.39583 13.4714 2.23438 13.8359C2.07812 14.2005 2 14.5885 2 15H1C1 14.6198 1.05208 14.2526 1.15625 13.8984C1.26042 13.5391 1.40885 13.2057 1.60156 12.8984C1.79427 12.5859 2.02604 12.3047 2.29688 12.0547C2.57292 11.7995 2.88021 11.5859 3.21875 11.4141C2.83854 11.1328 2.53906 10.7786 2.32031 10.3516C2.10677 9.92448 2 9.47396 2 9C2 8.58854 2.07812 8.20052 2.23438 7.83594C2.39583 7.47135 2.61198 7.15365 2.88281 6.88281C3.15365 6.61198 3.47135 6.39844 3.83594 6.24219C4.20052 6.08073 4.58854 6 5 6C5.47396 6 5.92448 6.10938 6.35156 6.32812C6.77865 6.54167 7.13281 6.83854 7.41406 7.21875C7.61198 6.82812 7.86458 6.47917 8.17188 6.17188C8.47917 5.86458 8.82812 5.61198 9.21875 5.41406C8.83854 5.13281 8.53906 4.77865 8.32031 4.35156C8.10677 3.92448 8 3.47396 8 3C8 2.58854 8.07812 2.20052 8.23438 1.83594C8.39583 1.47135 8.61198 1.15365 8.88281 0.882812C9.15365 0.611979 9.47135 0.398438 9.83594 0.242188C10.2005 0.0807292 10.5885 0 11 0C11.4115 0 11.7995 0.0807292 12.1641 0.242188C12.5286 0.398438 12.8464 0.611979 13.1172 0.882812C13.388 1.15365 13.6016 1.47135 13.7578 1.83594C13.9193 2.20052 14 2.58854 14 3C14 3.47396 13.8906 3.92448 13.6719 4.35156C13.4583 4.77865 13.1615 5.13281 12.7812 5.41406ZM5 11C5.27083 11 5.52865 10.9479 5.77344 10.8438C6.01823 10.7344 6.22917 10.5911 6.40625 10.4141C6.58854 10.2318 6.73177 10.0208 6.83594 9.78125C6.94531 9.53646 7 9.27604 7 9C7 8.72917 6.94531 8.47135 6.83594 8.22656C6.73177 7.98177 6.58854 7.77083 6.40625 7.59375C6.22917 7.41146 6.01823 7.26823 5.77344 7.16406C5.52865 7.05469 5.27083 7 5 7C4.72396 7 4.46354 7.05469 4.21875 7.16406C3.97917 7.26823 3.76823 7.41146 3.58594 7.59375C3.40885 7.77083 3.26562 7.98177 3.15625 8.22656C3.05208 8.47135 3 8.72917 3 9C3 9.27604 3.05208 9.53646 3.15625 9.78125C3.26562 10.0208 3.40885 10.2318 3.58594 10.4141C3.76823 10.5911 3.97917 10.7344 4.21875 10.8438C4.46354 10.9479 4.72396 11 5 11ZM9 3C9 3.27604 9.05208 3.53646 9.15625 3.78125C9.26562 4.02083 9.40885 4.23177 9.58594 4.41406C9.76823 4.59115 9.97917 4.73438 10.2188 4.84375C10.4635 4.94792 10.724 5 11 5C11.2708 5 11.5286 4.94792 11.7734 4.84375C12.0182 4.73438 12.2292 4.59115 12.4062 4.41406C12.5885 4.23177 12.7318 4.02083 12.8359 3.78125C12.9453 3.53646 13 3.27604 13 3C13 2.72917 12.9453 2.47135 12.8359 2.22656C12.7318 1.98177 12.5885 1.77083 12.4062 1.59375C12.2292 1.41146 12.0182 1.26823 11.7734 1.16406C11.5286 1.05469 11.2708 1 11 1C10.724 1 10.4635 1.05469 10.2188 1.16406C9.97917 1.26823 9.76823 1.41146 9.58594 1.59375C9.40885 1.77083 9.26562 1.98177 9.15625 2.22656C9.05208 2.47135 9 2.72917 9 3Z" fill="#333333"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

10
samples/sqlservices/images/group_inverse.svg Normal file
View File

@@ -0,0 +1,10 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path d="M12.7812 5.41406C13.1198 5.58594 13.4245 5.79948 13.6953 6.05469C13.9714 6.30469 14.2057 6.58594 14.3984 6.89844C14.5911 7.20573 14.7396 7.53906 14.8438 7.89844C14.9479 8.2526 15 8.61979 15 9H14C14 8.58854 13.9193 8.20052 13.7578 7.83594C13.6016 7.47135 13.388 7.15365 13.1172 6.88281C12.8464 6.61198 12.5286 6.39844 12.1641 6.24219C11.7995 6.08073 11.4115 6 11 6C10.5885 6 10.2005 6.08073 9.83594 6.24219C9.47135 6.39844 9.15365 6.61198 8.88281 6.88281C8.61198 7.15365 8.39583 7.47135 8.23438 7.83594C8.07812 8.20052 8 8.58854 8 9C8 9.47396 7.89062 9.92448 7.67188 10.3516C7.45833 10.7786 7.16146 11.1328 6.78125 11.4141C7.11979 11.5859 7.42448 11.7995 7.69531 12.0547C7.97135 12.3047 8.20573 12.5859 8.39844 12.8984C8.59115 13.2057 8.73958 13.5391 8.84375 13.8984C8.94792 14.2526 9 14.6198 9 15H8C8 14.5885 7.91927 14.2005 7.75781 13.8359C7.60156 13.4714 7.38802 13.1536 7.11719 12.8828C6.84635 12.612 6.52865 12.3984 6.16406 12.2422C5.79948 12.0807 5.41146 12 5 12C4.58854 12 4.20052 12.0807 3.83594 12.2422C3.47135 12.3984 3.15365 12.612 2.88281 12.8828C2.61198 13.1536 2.39583 13.4714 2.23438 13.8359C2.07812 14.2005 2 14.5885 2 15H1C1 14.6198 1.05208 14.2526 1.15625 13.8984C1.26042 13.5391 1.40885 13.2057 1.60156 12.8984C1.79427 12.5859 2.02604 12.3047 2.29688 12.0547C2.57292 11.7995 2.88021 11.5859 3.21875 11.4141C2.83854 11.1328 2.53906 10.7786 2.32031 10.3516C2.10677 9.92448 2 9.47396 2 9C2 8.58854 2.07812 8.20052 2.23438 7.83594C2.39583 7.47135 2.61198 7.15365 2.88281 6.88281C3.15365 6.61198 3.47135 6.39844 3.83594 6.24219C4.20052 6.08073 4.58854 6 5 6C5.47396 6 5.92448 6.10938 6.35156 6.32812C6.77865 6.54167 7.13281 6.83854 7.41406 7.21875C7.61198 6.82812 7.86458 6.47917 8.17188 6.17188C8.47917 5.86458 8.82812 5.61198 9.21875 5.41406C8.83854 5.13281 8.53906 4.77865 8.32031 4.35156C8.10677 3.92448 8 3.47396 8 3C8 2.58854 8.07812 2.20052 8.23438 1.83594C8.39583 1.47135 8.61198 1.15365 8.88281 0.882812C9.15365 0.611979 9.47135 0.398438 9.83594 0.242188C10.2005 0.0807292 10.5885 0 11 0C11.4115 0 11.7995 0.0807292 12.1641 0.242188C12.5286 0.398438 12.8464 0.611979 13.1172 0.882812C13.388 1.15365 13.6016 1.47135 13.7578 1.83594C13.9193 2.20052 14 2.58854 14 3C14 3.47396 13.8906 3.92448 13.6719 4.35156C13.4583 4.77865 13.1615 5.13281 12.7812 5.41406ZM5 11C5.27083 11 5.52865 10.9479 5.77344 10.8438C6.01823 10.7344 6.22917 10.5911 6.40625 10.4141C6.58854 10.2318 6.73177 10.0208 6.83594 9.78125C6.94531 9.53646 7 9.27604 7 9C7 8.72917 6.94531 8.47135 6.83594 8.22656C6.73177 7.98177 6.58854 7.77083 6.40625 7.59375C6.22917 7.41146 6.01823 7.26823 5.77344 7.16406C5.52865 7.05469 5.27083 7 5 7C4.72396 7 4.46354 7.05469 4.21875 7.16406C3.97917 7.26823 3.76823 7.41146 3.58594 7.59375C3.40885 7.77083 3.26562 7.98177 3.15625 8.22656C3.05208 8.47135 3 8.72917 3 9C3 9.27604 3.05208 9.53646 3.15625 9.78125C3.26562 10.0208 3.40885 10.2318 3.58594 10.4141C3.76823 10.5911 3.97917 10.7344 4.21875 10.8438C4.46354 10.9479 4.72396 11 5 11ZM9 3C9 3.27604 9.05208 3.53646 9.15625 3.78125C9.26562 4.02083 9.40885 4.23177 9.58594 4.41406C9.76823 4.59115 9.97917 4.73438 10.2188 4.84375C10.4635 4.94792 10.724 5 11 5C11.2708 5 11.5286 4.94792 11.7734 4.84375C12.0182 4.73438 12.2292 4.59115 12.4062 4.41406C12.5885 4.23177 12.7318 4.02083 12.8359 3.78125C12.9453 3.53646 13 3.27604 13 3C13 2.72917 12.9453 2.47135 12.8359 2.22656C12.7318 1.98177 12.5885 1.77083 12.4062 1.59375C12.2292 1.41146 12.0182 1.26823 11.7734 1.16406C11.5286 1.05469 11.2708 1 11 1C10.724 1 10.4635 1.05469 10.2188 1.16406C9.97917 1.26823 9.76823 1.41146 9.58594 1.59375C9.40885 1.77083 9.26562 1.98177 9.15625 2.22656C9.05208 2.47135 9 2.72917 9 3Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

18
samples/sqlservices/images/home.svg Normal file
View File

@@ -0,0 +1,18 @@
<svg id="a7cb8cd6-2817-407b-b05e-da6a1a07986d" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
<defs>
<linearGradient id="f1d60ecc-f549-47b8-819a-b9b4b44e4c30" x1="9" y1="17.66" x2="9" y2="0.34" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#0078d4"/>
<stop offset="0.17" stop-color="#1c84dc"/>
<stop offset="0.38" stop-color="#3990e4"/>
<stop offset="0.59" stop-color="#4d99ea"/>
<stop offset="0.8" stop-color="#5a9eee"/>
<stop offset="1" stop-color="#5ea0ef"/>
</linearGradient>
</defs>
<title>Icon-general-17</title>
<g>
<path d="M17.8,8.29,9.41.5a.61.61,0,0,0-.82,0L.2,8.29A.62.62,0,0,0,.67,9.35H2.39a.3.3,0,0,1,.3.3v7.4a.61.61,0,0,0,.61.61H14.7a.61.61,0,0,0,.61-.61V9.65a.3.3,0,0,1,.3-.3h1.72A.62.62,0,0,0,17.8,8.29Z" fill="url(#f1d60ecc-f549-47b8-819a-b9b4b44e4c30)"/>
<path id="b814d994-7069-4bdb-859e-2df17e42ed63" d="M7.07,12.4h3.86a.36.36,0,0,1,.32.38v4.88H6.75V12.78A.36.36,0,0,1,7.07,12.4Z" fill="#e6e6e6"/>
<path d="M.67,9.35H1.2L8.59,2.49a.61.61,0,0,1,.82,0L16.8,9.35h.53a.62.62,0,0,0,.47-1.06L9.41.5a.61.61,0,0,0-.82,0L.2,8.29A.62.62,0,0,0,.67,9.35Z" fill="#005ba1"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

10
samples/sqlservices/images/user.svg Normal file
View File

@@ -0,0 +1,10 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path d="M10.3906 9.39844C11.099 9.64323 11.737 9.98698 12.3047 10.4297C12.8776 10.8672 13.362 11.375 13.7578 11.9531C14.1589 12.5312 14.4661 13.1641 14.6797 13.8516C14.8932 14.5391 15 15.2552 15 16H14C14 15.1458 13.8464 14.3542 13.5391 13.625C13.237 12.8906 12.8177 12.2552 12.2812 11.7188C11.7448 11.1823 11.1094 10.763 10.375 10.4609C9.64583 10.1536 8.85417 10 8 10C7.44271 10 6.90625 10.0703 6.39062 10.2109C5.875 10.3516 5.39323 10.5521 4.94531 10.8125C4.5026 11.0677 4.09896 11.3776 3.73438 11.7422C3.375 12.1016 3.0651 12.5052 2.80469 12.9531C2.54948 13.3958 2.35156 13.875 2.21094 14.3906C2.07031 14.9062 2 15.4427 2 16H1C1 15.25 1.10938 14.5339 1.32812 13.8516C1.54688 13.1641 1.85677 12.5339 2.25781 11.9609C2.65885 11.388 3.14323 10.8828 3.71094 10.4453C4.28385 10.0078 4.92188 9.66146 5.625 9.40625C5.21875 9.1875 4.85417 8.92188 4.53125 8.60938C4.20833 8.29688 3.93229 7.95052 3.70312 7.57031C3.47917 7.1849 3.30469 6.77604 3.17969 6.34375C3.0599 5.90625 3 5.45833 3 5C3 4.30729 3.13021 3.65885 3.39062 3.05469C3.65104 2.44531 4.00781 1.91406 4.46094 1.46094C4.91406 1.00781 5.44271 0.651042 6.04688 0.390625C6.65625 0.130208 7.30729 0 8 0C8.69271 0 9.34115 0.130208 9.94531 0.390625C10.5547 0.651042 11.0859 1.00781 11.5391 1.46094C11.9922 1.91406 12.349 2.44531 12.6094 3.05469C12.8698 3.65885 13 4.30729 13 5C13 5.45833 12.9375 5.90365 12.8125 6.33594C12.6927 6.76823 12.5182 7.17448 12.2891 7.55469C12.0651 7.9349 11.7917 8.28385 11.4688 8.60156C11.151 8.91406 10.7917 9.17969 10.3906 9.39844ZM4 5C4 5.55208 4.10417 6.07031 4.3125 6.55469C4.52604 7.03906 4.8125 7.46354 5.17188 7.82812C5.53646 8.1875 5.96094 8.47396 6.44531 8.6875C6.92969 8.89583 7.44792 9 8 9C8.55208 9 9.07031 8.89583 9.55469 8.6875C10.0391 8.47396 10.4609 8.1875 10.8203 7.82812C11.1849 7.46354 11.4714 7.03906 11.6797 6.55469C11.8932 6.07031 12 5.55208 12 5C12 4.44792 11.8932 3.92969 11.6797 3.44531C11.4714 2.96094 11.1849 2.53906 10.8203 2.17969C10.4609 1.8151 10.0391 1.52865 9.55469 1.32031C9.07031 1.10677 8.55208 1 8 1C7.44792 1 6.92969 1.10677 6.44531 1.32031C5.96094 1.52865 5.53646 1.8151 5.17188 2.17969C4.8125 2.53906 4.52604 2.96094 4.3125 3.44531C4.10417 3.92969 4 4.44792 4 5Z" fill="#333333"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

10
samples/sqlservices/images/user_inverse.svg Normal file
View File

@@ -0,0 +1,10 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path d="M10.3906 9.39844C11.099 9.64323 11.737 9.98698 12.3047 10.4297C12.8776 10.8672 13.362 11.375 13.7578 11.9531C14.1589 12.5312 14.4661 13.1641 14.6797 13.8516C14.8932 14.5391 15 15.2552 15 16H14C14 15.1458 13.8464 14.3542 13.5391 13.625C13.237 12.8906 12.8177 12.2552 12.2812 11.7188C11.7448 11.1823 11.1094 10.763 10.375 10.4609C9.64583 10.1536 8.85417 10 8 10C7.44271 10 6.90625 10.0703 6.39062 10.2109C5.875 10.3516 5.39323 10.5521 4.94531 10.8125C4.5026 11.0677 4.09896 11.3776 3.73438 11.7422C3.375 12.1016 3.0651 12.5052 2.80469 12.9531C2.54948 13.3958 2.35156 13.875 2.21094 14.3906C2.07031 14.9062 2 15.4427 2 16H1C1 15.25 1.10938 14.5339 1.32812 13.8516C1.54688 13.1641 1.85677 12.5339 2.25781 11.9609C2.65885 11.388 3.14323 10.8828 3.71094 10.4453C4.28385 10.0078 4.92188 9.66146 5.625 9.40625C5.21875 9.1875 4.85417 8.92188 4.53125 8.60938C4.20833 8.29688 3.93229 7.95052 3.70312 7.57031C3.47917 7.1849 3.30469 6.77604 3.17969 6.34375C3.0599 5.90625 3 5.45833 3 5C3 4.30729 3.13021 3.65885 3.39062 3.05469C3.65104 2.44531 4.00781 1.91406 4.46094 1.46094C4.91406 1.00781 5.44271 0.651042 6.04688 0.390625C6.65625 0.130208 7.30729 0 8 0C8.69271 0 9.34115 0.130208 9.94531 0.390625C10.5547 0.651042 11.0859 1.00781 11.5391 1.46094C11.9922 1.91406 12.349 2.44531 12.6094 3.05469C12.8698 3.65885 13 4.30729 13 5C13 5.45833 12.9375 5.90365 12.8125 6.33594C12.6927 6.76823 12.5182 7.17448 12.2891 7.55469C12.0651 7.9349 11.7917 8.28385 11.4688 8.60156C11.151 8.91406 10.7917 9.17969 10.3906 9.39844ZM4 5C4 5.55208 4.10417 6.07031 4.3125 6.55469C4.52604 7.03906 4.8125 7.46354 5.17188 7.82812C5.53646 8.1875 5.96094 8.47396 6.44531 8.6875C6.92969 8.89583 7.44792 9 8 9C8.55208 9 9.07031 8.89583 9.55469 8.6875C10.0391 8.47396 10.4609 8.1875 10.8203 7.82812C11.1849 7.46354 11.4714 7.03906 11.6797 6.55469C11.8932 6.07031 12 5.55208 12 5C12 4.44792 11.8932 3.92969 11.6797 3.44531C11.4714 2.96094 11.1849 2.53906 10.8203 2.17969C10.4609 1.8151 10.0391 1.52865 9.55469 1.32031C9.07031 1.10677 8.55208 1 8 1C7.44792 1 6.92969 1.10677 6.44531 1.32031C5.96094 1.52865 5.53646 1.8151 5.17188 2.17969C4.8125 2.53906 4.52604 2.96094 4.3125 3.44531C4.10417 3.92969 4 4.44792 4 5Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

222
samples/sqlservices/package.json
View File

@@ -1,116 +1,120 @@
{
"name": "sqlservices",
"displayName": "sqlservices",
"description": "Lists SQL Server service status in the management dashboard for a server",
"version": "0.0.1",
"publisher": "demo",
"engines": {
"vscode": "^1.26.0",
"azdata": "*"
},
"categories": [
"Other"
"name": "sqlservices",
"displayName": "sqlservices",
"description": "Lists SQL Server service status in the management dashboard for a server",
"version": "0.0.1",
"publisher": "demo",
"engines": {
"vscode": "^1.26.0",
"azdata": "*"
},
"categories": [
"Other"
],
"activationEvents": [
"*"
],
"main": "./out/src/extension",
"contributes": {
"commands": [
{
"command": "sqlservices.openDialog",
"title": "sqlservices.openDialog"
},
{
"command": "sqlservices.openConnectionDialog",
"title": "sqlservices.openConnectionDialog"
},
{
"command": "sqlservices.openEditor",
"title": "sqlservices.openEditor"
},
{
"command": "sqlservices.openEditorWithWebView",
"title": "sqlservices.openEditorWithWebView"
},
{
"command": "sqlservices.openEditorWithWebView2",
"title": "sqlservices.openEditorWithWebView2"
},
{
"command": "sqlservices.openWizard",
"title": "sqlservices.openWizard"
},
{
"command": "sqlservices.openModelViewDashboard",
"title": "sqlservices.openModelViewDashboard"
}
],
"activationEvents": [
"*"
],
"main": "./out/src/extension",
"contributes": {
"commands": [
"dashboard.tabs": [
{
"id": "sqlservices.tab",
"title": "sqlservices",
"icon": {
"light": "./out/src/media/insights.svg",
"dark": "./out/src/media/insights_inverse.svg"
},
"description": "Shows available services running in the SQL Server instance",
"container": {
"nav-section": [
{
"command": "sqlservices.openDialog",
"title": "sqlservices.openDialog"
"id": "sqlservices",
"title": "Services",
"gridItemConfig": {
"sizex": 2,
"sizey": 1
},
"container": {
"modelview-container": null
}
},
{
"command": "sqlservices.openConnectionDialog",
"title": "sqlservices.openConnectionDialog"
},
{
"command": "sqlservices.openEditor",
"title": "sqlservices.openEditor"
},
{
"command": "sqlservices.openEditorWithWebView",
"title": "sqlservices.openEditorWithWebView"
},
{
"command": "sqlservices.openEditorWithWebView2",
"title": "sqlservices.openEditorWithWebView2"
},
{
"command": "sqlservices.openWizard",
"title": "sqlservices.openWizard"
"id": "splitPanel",
"title": "SplitPanel",
"gridItemConfig": {
"sizex": 2,
"sizey": 1
},
"container": {
"modelview-container": null
}
}
],
"dashboard.tabs": [
{
"id": "sqlservices.tab",
"title": "sqlservices",
"icon": {
"light": "./out/src/media/insights.svg",
"dark": "./out/src/media/insights_inverse.svg"
},
"description": "Shows available services running in the SQL Server instance",
"container": {
"nav-section": [
{
"id": "sqlservices",
"title": "Services",
"gridItemConfig": {
"sizex": 2,
"sizey": 1
},
"container": {
"modelview-container": null
}
},
{
"id": "splitPanel",
"title": "SplitPanel",
"gridItemConfig": {
"sizex": 2,
"sizey": 1
},
"container": {
"modelview-container": null
}
}
]
}
}
]
},
"scripts": {
"build": "gulp build",
"compile": "gulp compile",
"watch": "gulp watch",
"typings": "gulp copytypings",
"postinstall": "node ./node_modules/vscode/bin/install && node ./node_modules/azdata/bin/install && gulp copytypings"
},
"dependencies": {
"fs-extra": "^5.0.0",
"handlebars": "^4.5.3",
"vscode-nls": "^4.0.0"
},
"devDependencies": {
"@types/node": "^7.0.43",
"azdata": "^1.0.0",
"braces": "^2.3.2",
"child-process-promise": "^2.2.1",
"del": "^3.0.0",
"gulp": "^4.0.0",
"gulp-color": "0.0.1",
"gulp-sourcemaps": "^2.6.5",
"gulp-tslint": "^6.0.2",
"gulp-typescript": "^3.2.4",
"tslint": "^3.14.0",
"typescript": "^2.6.1",
"url-parse": "^1.4.4",
"vsce": "^1.57.1",
"vscode": "^1.1.30"
},
"repository": {
"type": "git",
"url": "https://github.com/Microsoft/azuredatastudio/tree/master/samples/sqlservices"
}
]
}
}
]
},
"scripts": {
"build": "gulp build",
"compile": "gulp compile",
"watch": "gulp watch",
"typings": "gulp copytypings",
"postinstall": "node ./node_modules/vscode/bin/install && node ./node_modules/azdata/bin/install && gulp copytypings"
},
"dependencies": {
"fs-extra": "^5.0.0",
"handlebars": "^4.5.3",
"vscode-nls": "^4.0.0"
},
"devDependencies": {
"@types/node": "^7.0.43",
"azdata": "^1.0.0",
"braces": "^2.3.2",
"child-process-promise": "^2.2.1",
"del": "^3.0.0",
"gulp": "^4.0.0",
"gulp-color": "0.0.1",
"gulp-sourcemaps": "^2.6.5",
"gulp-tslint": "^6.0.2",
"gulp-typescript": "^3.2.4",
"tslint": "^3.14.0",
"typescript": "^2.6.1",
"url-parse": "^1.4.4",
"vsce": "^1.57.1",
"vscode": "^1.1.30"
},
"repository": {
"type": "git",
"url": "https://github.com/Microsoft/azuredatastudio/tree/master/samples/sqlservices"
}
}

5
samples/sqlservices/src/controllers/mainController.ts
View File

@@ -12,6 +12,7 @@ import SplitPropertiesPanel from './splitPropertiesPanel';
import * as fs from 'fs';
import * as path from 'path';
import { TreeNode, TreeDataProvider } from './treeDataProvider';
import * as dashboard from './modelViewDashboard';
/**
* The main controller class that initializes the extension
@@ -72,6 +73,10 @@ export default class MainController implements vscode.Disposable {
this.openWizard();
});
vscode.commands.registerCommand('sqlservices.openModelViewDashboard', () => {
dashboard.openModelViewDashboard(this.context);
});
return Promise.resolve(true);
}

90
samples/sqlservices/src/controllers/modelViewDashboard.ts Normal file
View File

@@ -0,0 +1,90 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import * as azdata from 'azdata';
import * as vscode from 'vscode';
export async function openModelViewDashboard(context: vscode.ExtensionContext): Promise<void> {
const dashboard = azdata.window.createModelViewDashboard('Test Dashboard');
dashboard.registerTabs(async (view: azdata.ModelView) => {
// Tab with toolbar
const button = view.modelBuilder.button().withProperties<azdata.ButtonProperties>({
label: 'Run',
iconPath: {
light: context.asAbsolutePath('images/compare.svg'),
dark: context.asAbsolutePath('images/compare-inverse.svg')
}
}).component();
button.onDidClick(() => {
vscode.window.showInformationMessage('Run button clicked');
});
const toolbar = view.modelBuilder.toolbarContainer().withItems([button]).withLayout({
orientation: azdata.Orientation.Horizontal
}).component();
const textComponent1 = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({ value: 'text 1' }).component();
const homeTab: azdata.DashboardTab = {
id: 'home',
toolbar: toolbar,
content: textComponent1,
title: 'Home',
icon: context.asAbsolutePath('images/home.svg') // icon can be the path of a svg file
};
// Tab with nested tabbed Panel
const textComponent2 = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({ value: 'text 2' }).component();
const textComponent3 = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({ value: 'text 3' }).component();
const nestedTab1 = {
title: 'Tab1',
content: textComponent2,
id: 'tab1',
icon: {
light: context.asAbsolutePath('images/user.svg'),
dark: context.asAbsolutePath('images/user_inverse.svg') // icon can also be theme aware
}
};
const nestedTab2 = {
title: 'Tab2',
content: textComponent3,
icon: {
light: context.asAbsolutePath('images/group.svg'),
dark: context.asAbsolutePath('images/group_inverse.svg')
},
id: 'tab2'
};
const tabbedPanel = view.modelBuilder.tabbedPanel().withTabs([
nestedTab1, nestedTab2
]).withLayout({
orientation: azdata.TabOrientation.Horizontal,
showIcon: true
}).component();
const settingsTab: azdata.DashboardTab = {
id: 'settings',
content: tabbedPanel,
title: 'Settings',
icon: context.asAbsolutePath('images/default.svg')
};
// You can also add a tab group
const securityTabGroup: azdata.DashboardTabGroup = {
title: 'Security',
tabs: [
settingsTab
]
};
return [
homeTab,
securityTabGroup
];
});
dashboard.open();
}