THIS IS A TEST INSTANCE ONLY! REPOSITORIES CAN BE DELETED AT ANY TIME!

This is Gitea test Portainer repository mirror from Github
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

682 lines
37 KiB

  1. <rd-header>
  2. <rd-header-title title-text="Create container"></rd-header-title>
  3. <rd-header-content>
  4. <a ui-sref="docker.containers">Containers</a> &gt; Add container
  5. </rd-header-content>
  6. </rd-header>
  7. <div class="row">
  8. <div class="col-lg-12 col-md-12 col-xs-12">
  9. <rd-widget>
  10. <rd-widget-body>
  11. <form class="form-horizontal" autocomplete="off">
  12. <!-- name-input -->
  13. <div class="form-group">
  14. <label for="container_name" class="col-sm-1 control-label text-left">Name</label>
  15. <div class="col-sm-11">
  16. <input type="text" class="form-control" ng-model="config.name" id="container_name" placeholder="e.g. myContainer">
  17. </div>
  18. </div>
  19. <!-- !name-input -->
  20. <div class="col-sm-12 form-section-title">
  21. Image configuration
  22. </div>
  23. <div ng-if="!formValues.RegistryModel.Registry && fromContainer">
  24. <i class="fa fa-exclamation-triangle orange-icon" aria-hidden="true"></i>
  25. <span class="small text-danger" style="margin-left: 5px;">The Docker registry for the <code>{{ config.Image }}</code> image is not registered inside Portainer, you will not be able to create a container. Please register that registry first.</span>
  26. </div>
  27. <div ng-if="formValues.RegistryModel.Registry || !fromContainer">
  28. <!-- image-and-registry -->
  29. <por-image-registry
  30. model="formValues.RegistryModel"
  31. pull-warning="formValues.alwaysPull"
  32. ng-if="formValues.RegistryModel.Registry"
  33. auto-complete="true"
  34. label-class="col-sm-1" input-class="col-sm-11"
  35. ></por-image-registry>
  36. <!-- !image-and-registry -->
  37. <!-- always-pull -->
  38. <div class="form-group">
  39. <div class="col-sm-12">
  40. <label for="ownership" class="control-label text-left">
  41. Always pull the image
  42. <portainer-tooltip position="bottom" message="When enabled, Portainer will automatically try to pull the specified image before creating the container."></portainer-tooltip>
  43. </label>
  44. <label class="switch" style="margin-left: 20px;">
  45. <input type="checkbox" ng-model="formValues.alwaysPull"><i></i>
  46. </label>
  47. </div>
  48. </div>
  49. <!-- !always-pull -->
  50. </div>
  51. <div class="col-sm-12 form-section-title">
  52. Network ports configuration
  53. </div>
  54. <!-- publish-exposed-ports -->
  55. <div class="form-group">
  56. <div class="col-sm-12">
  57. <label class="control-label text-left">
  58. Publish all exposed network ports to random host ports
  59. <portainer-tooltip position="bottom" message="When enabled, Portainer will let Docker automatically map a random port on the host to each one defined in the image Dockerfile."></portainer-tooltip>
  60. </label>
  61. <label class="switch" style="margin-left: 20px;">
  62. <input type="checkbox" ng-model="config.HostConfig.PublishAllPorts"><i></i>
  63. </label>
  64. </div>
  65. </div>
  66. <!-- !publish-exposed-ports -->
  67. <!-- port-mapping -->
  68. <div class="form-group">
  69. <div class="col-sm-12">
  70. <label class="control-label text-left">
  71. Manual network port publishing
  72. <portainer-tooltip position="bottom" message="When a range of ports on the host and a single port on the container is specified, Docker will randomly choose a single available port in the defined range and forward that to the container port."></portainer-tooltip>
  73. </label>
  74. <span class="label label-default interactive" style="margin-left: 10px;" ng-click="addPortBinding()">
  75. <i class="fa fa-plus-circle" aria-hidden="true"></i> publish a new network port
  76. </span>
  77. </div>
  78. <!-- port-mapping-input-list -->
  79. <div class="col-sm-12 form-inline" style="margin-top: 10px;">
  80. <div ng-repeat="portBinding in config.HostConfig.PortBindings" style="margin-top: 2px;">
  81. <!-- host-port -->
  82. <div class="input-group col-sm-4 input-group-sm">
  83. <span class="input-group-addon">host</span>
  84. <input type="text" class="form-control" ng-model="portBinding.hostPort" placeholder="e.g. 80, 80-88, ip:80 or ip:80-88 (optional)">
  85. </div>
  86. <!-- !host-port -->
  87. <span style="margin: 0 10px 0 10px;">
  88. <i class="fa fa-long-arrow-alt-right" aria-hidden="true"></i>
  89. </span>
  90. <!-- container-port -->
  91. <div class="input-group col-sm-4 input-group-sm">
  92. <span class="input-group-addon">container</span>
  93. <input type="text" class="form-control" ng-model="portBinding.containerPort" placeholder="e.g. 80 or 80-88">
  94. </div>
  95. <!-- !container-port -->
  96. <!-- protocol-actions -->
  97. <div class="input-group col-sm-3 input-group-sm">
  98. <div class="btn-group btn-group-sm">
  99. <label class="btn btn-primary" ng-model="portBinding.protocol" uib-btn-radio="'tcp'">TCP</label>
  100. <label class="btn btn-primary" ng-model="portBinding.protocol" uib-btn-radio="'udp'">UDP</label>
  101. </div>
  102. <button class="btn btn-sm btn-danger" type="button" ng-click="removePortBinding($index)">
  103. <i class="fa fa-trash" aria-hidden="true"></i>
  104. </button>
  105. </div>
  106. <!-- !protocol-actions -->
  107. </div>
  108. </div>
  109. <!-- !port-mapping-input-list -->
  110. </div>
  111. <!-- !port-mapping -->
  112. <div ng-if="applicationState.endpoint.mode.agentProxy && applicationState.endpoint.mode.provider === 'DOCKER_SWARM_MODE'">
  113. <div class="col-sm-12 form-section-title">
  114. Deployment
  115. </div>
  116. <!-- node-selection -->
  117. <node-selector
  118. model="formValues.NodeName">
  119. </node-selector>
  120. <!-- !node-selection -->
  121. </div>
  122. <!-- access-control -->
  123. <por-access-control-form form-data="formValues.AccessControlData" resource-control="fromContainer.ResourceControl" ng-if="applicationState.application.authentication && fromContainer"></por-access-control-form>
  124. <!-- !access-control -->
  125. <!-- actions -->
  126. <div class="col-sm-12 form-section-title">
  127. Actions
  128. </div>
  129. <!-- autoremove -->
  130. <div class="form-group">
  131. <div class="col-sm-12">
  132. <label for="ownership" class="control-label text-left">
  133. Auto remove
  134. <portainer-tooltip position="bottom" message="When enabled, Portainer will automatically remove the container when it exits. This is useful when you want to use the container only once."></portainer-tooltip>
  135. </label>
  136. <label class="switch" style="margin-left: 20px;">
  137. <input type="checkbox" ng-model="config.HostConfig.AutoRemove"><i></i>
  138. </label>
  139. </div>
  140. </div>
  141. <!-- !autoremove -->
  142. <div class="form-group">
  143. <div class="col-sm-12">
  144. <button type="button" class="btn btn-primary btn-sm"
  145. ng-disabled="state.actionInProgress || !formValues.RegistryModel.Image || (!formValues.RegistryModel.Registry && fromContainer)"
  146. ng-click="create()" button-spinner="state.actionInProgress">
  147. <span ng-hide="state.actionInProgress">Deploy the container</span>
  148. <span ng-show="state.actionInProgress">Deployment in progress...</span>
  149. </button>
  150. <span class="text-danger" ng-if="state.formValidationError" style="margin-left: 5px;">{{ state.formValidationError }}</span>
  151. </div>
  152. </div>
  153. <!-- !actions -->
  154. </form>
  155. </rd-widget-body>
  156. </rd-widget>
  157. </div>
  158. </div>
  159. <div class="row">
  160. <div class="col-lg-12 col-md-12 col-xs-12">
  161. <rd-widget>
  162. <rd-widget-header icon="fa-cog" title-text="Advanced container settings"></rd-widget-header>
  163. <rd-widget-body>
  164. <ul class="nav nav-pills nav-justified">
  165. <li class="active interactive"><a data-target="#command" data-toggle="tab">Command & logging</a></li>
  166. <li class="interactive"><a data-target="#volumes" data-toggle="tab">Volumes</a></li>
  167. <li class="interactive"><a data-target="#network" data-toggle="tab">Network</a></li>
  168. <li class="interactive"><a data-target="#env" data-toggle="tab">Env</a></li>
  169. <li class="interactive"><a data-target="#labels" data-toggle="tab">Labels</a></li>
  170. <li class="interactive"><a data-target="#restart-policy" data-toggle="tab">Restart policy</a></li>
  171. <li class="interactive"><a data-target="#runtime-resources" ng-click="refreshSlider()" data-toggle="tab">Runtime & Resources</a></li>
  172. <li class="interactive"><a data-target="#container-capabilities" data-toggle="tab">Capabilities</a></li>
  173. </ul>
  174. <!-- tab-content -->
  175. <div class="tab-content">
  176. <!-- tab-command -->
  177. <div class="tab-pane active" id="command">
  178. <form class="form-horizontal" style="margin-top: 15px;">
  179. <!-- command-input -->
  180. <div class="form-group">
  181. <label for="container_command" class="col-sm-2 col-lg-1 control-label text-left">Command</label>
  182. <div class="col-sm-9">
  183. <input type="text" class="form-control" ng-model="config.Cmd" id="container_command" placeholder="e.g. /usr/bin/nginx -t -c /mynginx.conf">
  184. </div>
  185. </div>
  186. <!-- !command-input -->
  187. <!-- entrypoint-input -->
  188. <div class="form-group">
  189. <label for="container_entrypoint" class="col-sm-2 col-lg-1 control-label text-left">Entry Point</label>
  190. <div class="col-sm-9">
  191. <input type="text" class="form-control" ng-model="config.Entrypoint" id="container_entrypoint" placeholder="e.g. /bin/sh -c">
  192. </div>
  193. </div>
  194. <!-- !entrypoint-input -->
  195. <!-- workdir-user-input -->
  196. <div class="form-group">
  197. <label for="container_workingdir" class="col-sm-2 col-lg-1 control-label text-left">Working Dir</label>
  198. <div class="col-sm-4">
  199. <input type="text" class="form-control" ng-model="config.WorkingDir" id="container_workingdir" placeholder="e.g. /myapp">
  200. </div>
  201. <label for="container_user" class="col-sm-1 control-label text-left">User</label>
  202. <div class="col-sm-4">
  203. <input type="text" class="form-control" ng-model="config.User" id="container_user" placeholder="e.g. nginx">
  204. </div>
  205. </div>
  206. <!-- !workdir-user-input -->
  207. <!-- console -->
  208. <div class="form-group">
  209. <label for="container_console" class="col-sm-2 col-lg-1 control-label text-left">Console</label>
  210. <div class="col-sm-10 col-lg-11">
  211. <div class="col-sm-4">
  212. <label class="radio-inline">
  213. <input type="radio" name="container_console" ng-model="formValues.Console" value="both">
  214. Interactive & TTY <span class="small text-muted">(-i -t)</span>
  215. </label>
  216. </div>
  217. <div class="col-sm-4">
  218. <label class="radio-inline">
  219. <input type="radio" name="container_console" ng-model="formValues.Console" value="interactive">
  220. Interactive <span class="small text-muted">(-i)</span>
  221. </label>
  222. </div>
  223. </div>
  224. <div class="col-sm-offset-2 col-sm-10 col-lg-offset-1 col-lg-11">
  225. <div class="col-sm-4">
  226. <label class="radio-inline">
  227. <input type="radio" name="container_console" ng-model="formValues.Console" value="tty">
  228. TTY <span class="small text-muted">(-t)</span>
  229. </label>
  230. </div>
  231. <div class="col-sm-4">
  232. <label class="radio-inline">
  233. <input type="radio" name="container_console" ng-model="formValues.Console" value="none">
  234. None
  235. </label>
  236. </div>
  237. </div>
  238. </div>
  239. <!-- !console -->
  240. <div class="col-sm-12 form-section-title">
  241. Logging
  242. </div>
  243. <!-- logging-driver -->
  244. <div class="form-group">
  245. <label for="log-driver" class="col-sm-2 col-lg-1 control-label text-left">Driver</label>
  246. <div class="col-sm-4">
  247. <select class="form-control" ng-model="formValues.LogDriverName" id="log-driver">
  248. <option selected value="">Default logging driver</option>
  249. <option ng-repeat="driver in availableLoggingDrivers" ng-value="driver">{{ driver }}</option>
  250. <option value="none">none</option>
  251. </select>
  252. </div>
  253. <div class="col-sm-5">
  254. <p class="small text-muted">
  255. Logging driver that will override the default docker daemon driver. Select Default logging driver if you don't want to override it. Supported logging drivers can be found <a href="https://docs.docker.com/engine/admin/logging/overview/#supported-logging-drivers" target="_blank">in the Docker documentation</a>.
  256. </p>
  257. </div>
  258. </div>
  259. <!-- !logging-driver -->
  260. <!-- logging-opts -->
  261. <div class="form-group">
  262. <div class="col-sm-12" style="margin-top: 5px;">
  263. <label class="control-label text-left">
  264. Options
  265. <portainer-tooltip position="top" message="Add button is disabled unless a driver other than none or default is selected. Options are specific to the selected driver, refer to the driver documentation."></portainer-tooltip>
  266. </label>
  267. <span class="label label-default interactive" style="margin-left: 10px;" ng-click="!formValues.LogDriverName || formValues.LogDriverName === 'none' || addLogDriverOpt(formValues.LogDriverName)">
  268. <i class="fa fa-plus-circle" aria-hidden="true"></i> add logging driver option
  269. </span>
  270. </div>
  271. <!-- logging-opts-input-list -->
  272. <div class="col-sm-12 form-inline" style="margin-top: 10px;">
  273. <div ng-repeat="opt in formValues.LogDriverOpts" style="margin-top: 2px;">
  274. <div class="input-group col-sm-5 input-group-sm">
  275. <span class="input-group-addon">option</span>
  276. <input type="text" class="form-control" ng-model="opt.name" placeholder="e.g. FOO">
  277. </div>
  278. <div class="input-group col-sm-5 input-group-sm">
  279. <span class="input-group-addon">value</span>
  280. <input type="text" class="form-control" ng-model="opt.value" placeholder="e.g. bar">
  281. </div>
  282. <button class="btn btn-sm btn-danger" type="button" ng-click="removeLogDriverOpt($index)">
  283. <i class="fa fa-trash" aria-hidden="true"></i>
  284. </button>
  285. </div>
  286. </div>
  287. <!-- logging-opts-input-list -->
  288. </div>
  289. <!-- !logging-opts -->
  290. </form>
  291. </div>
  292. <!-- !tab-command -->
  293. <!-- tab-volume -->
  294. <div class="tab-pane" id="volumes">
  295. <form class="form-horizontal" style="margin-top: 15px;">
  296. <!-- volumes -->
  297. <div class="form-group">
  298. <div class="col-sm-12" style="margin-top: 5px;">
  299. <label class="control-label text-left">Volume mapping</label>
  300. <span class="label label-default interactive" style="margin-left: 10px;" ng-click="addVolume()">
  301. <i class="fa fa-plus-circle" aria-hidden="true"></i> map additional volume
  302. </span>
  303. </div>
  304. <!-- volumes-input-list -->
  305. <div class="form-inline" style="margin-top: 10px;">
  306. <div ng-repeat="volume in formValues.Volumes">
  307. <!-- volume-line1 -->
  308. <div class="col-sm-12 form-inline" style="margin-top: 10px;">
  309. <!-- container-path -->
  310. <div class="input-group input-group-sm col-sm-6">
  311. <span class="input-group-addon">container</span>
  312. <input type="text" class="form-control" ng-model="volume.containerPath" placeholder="e.g. /path/in/container">
  313. </div>
  314. <!-- !container-path -->
  315. <!-- volume-type -->
  316. <div class="input-group col-sm-5" style="margin-left: 5px;" ng-if="isAdmin || allowBindMounts">
  317. <div class="btn-group btn-group-sm">
  318. <label class="btn btn-primary" ng-model="volume.type" uib-btn-radio="'volume'" ng-click="volume.name = ''">Volume</label>
  319. <label class="btn btn-primary" ng-model="volume.type" uib-btn-radio="'bind'" ng-click="volume.name = ''">Bind</label>
  320. </div>
  321. <button class="btn btn-sm btn-danger" type="button" ng-click="removeVolume($index)">
  322. <i class="fa fa-trash" aria-hidden="true"></i>
  323. </button>
  324. </div>
  325. <!-- !volume-type -->
  326. </div>
  327. <!-- !volume-line1 -->
  328. <!-- volume-line2 -->
  329. <div class="col-sm-12 form-inline" style="margin-top: 5px;">
  330. <i class="fa fa-long-arrow-alt-right" aria-hidden="true"></i>
  331. <!-- volume -->
  332. <div class="input-group input-group-sm col-sm-6" ng-if="volume.type === 'volume'">
  333. <span class="input-group-addon">volume</span>
  334. <select class="form-control" ng-model="volume.name">
  335. <option selected disabled hidden value="">Select a volume</option>
  336. <option ng-repeat="vol in availableVolumes" ng-value="vol.Name">{{ vol.Name|truncate:30}} - {{ vol.Driver|truncate:30}}</option>
  337. </select>
  338. </div>
  339. <!-- !volume -->
  340. <!-- bind -->
  341. <div class="input-group input-group-sm col-sm-6" ng-if="volume.type === 'bind'">
  342. <span class="input-group-addon">host</span>
  343. <input type="text" class="form-control" ng-model="volume.name" placeholder="e.g. /path/on/host">
  344. </div>
  345. <!-- !bind -->
  346. <!-- read-only -->
  347. <div class="input-group input-group-sm col-sm-5" style="margin-left: 5px;">
  348. <div class="btn-group btn-group-sm">
  349. <label class="btn btn-primary" ng-model="volume.readOnly" uib-btn-radio="false">Writable</label>
  350. <label class="btn btn-primary" ng-model="volume.readOnly" uib-btn-radio="true">Read-only</label>
  351. </div>
  352. </div>
  353. <!-- !read-only -->
  354. </div>
  355. <!-- !volume-line2 -->
  356. </div>
  357. </div>
  358. <!-- !volumes-input-list -->
  359. </div>
  360. </form>
  361. <!-- !volumes -->
  362. </div>
  363. <!-- !tab-volume -->
  364. <!-- tab-network -->
  365. <div class="tab-pane" id="network">
  366. <form class="form-horizontal" style="margin-top: 15px;">
  367. <div class="form-group" ng-if="globalNetworkCount === 0 && applicationState.endpoint.mode.provider !== 'DOCKER_SWARM_MODE'">
  368. <div class="col-sm-12">
  369. <span class="small text-muted">You don't have any shared network. Head over the <a ui-sref="docker.networks">networks view</a> to create one.</span>
  370. </div>
  371. </div>
  372. <!-- network-input -->
  373. <div class="form-group">
  374. <label for="container_network" class="col-sm-2 col-lg-1 control-label text-left">Network</label>
  375. <div class="col-sm-9">
  376. <select class="form-control" ng-model="config.HostConfig.NetworkMode" id="container_network" ng-change="resetNetworkConfig()">
  377. <option selected disabled hidden value="">Select a network</option>
  378. <option ng-repeat="net in availableNetworks | orderBy: 'Name'" ng-value="net.Name">{{ net.Name }}</option>
  379. </select>
  380. </div>
  381. </div>
  382. <!-- !network-input -->
  383. <!-- container-name-input -->
  384. <div class="form-group" ng-if="config.HostConfig.NetworkMode == 'container'">
  385. <label for="container_network_container" class="col-sm-2 col-lg-1 control-label text-left">Container</label>
  386. <div class="col-sm-9">
  387. <select ng-options="container|containername for container in runningContainers" class="form-control" ng-model="formValues.NetworkContainer">
  388. <option selected disabled hidden value="">Select a container</option>
  389. </select>
  390. </div>
  391. </div>
  392. <!-- !container-name-input -->
  393. <!-- hostname-input -->
  394. <div class="form-group">
  395. <label for="container_hostname" class="col-sm-2 col-lg-1 control-label text-left">Hostname</label>
  396. <div class="col-sm-9">
  397. <input type="text" class="form-control" ng-model="config.Hostname" id="container_hostname" placeholder="e.g. web01">
  398. </div>
  399. </div>
  400. <!-- !hostname-input -->
  401. <!-- domainname-input -->
  402. <div class="form-group">
  403. <label for="container_domainname" class="col-sm-2 col-lg-1 control-label text-left">Domain Name</label>
  404. <div class="col-sm-9">
  405. <input type="text" class="form-control" ng-model="config.Domainname" id="container_domainname" placeholder="e.g. example.com">
  406. </div>
  407. </div>
  408. <!-- !domainname -->
  409. <!-- mac-address-input -->
  410. <div class="form-group">
  411. <label for="container_macaddress" class="col-sm-2 col-lg-1 control-label text-left">Mac Address</label>
  412. <div class="col-sm-9">
  413. <input type="text" class="form-control" ng-model="formValues.MacAddress" id="container_macaddress" placeholder="e.g. 12-34-56-78-9a-bc">
  414. </div>
  415. </div>
  416. <!-- !mac-address-input -->
  417. <!-- ipv4-input -->
  418. <div class="form-group">
  419. <label for="container_ipv4" class="col-sm-2 col-lg-1 control-label text-left">IPv4 Address</label>
  420. <div class="col-sm-9">
  421. <input type="text" class="form-control" ng-model="formValues.IPv4" id="container_ipv4" placeholder="e.g. 172.20.0.7">
  422. </div>
  423. </div>
  424. <!-- !ipv4-input -->
  425. <!-- ipv6-input -->
  426. <div class="form-group">
  427. <label for="container_ipv6" class="col-sm-2 col-lg-1 control-label text-left">IPv6 Address</label>
  428. <div class="col-sm-9">
  429. <input type="text" class="form-control" ng-model="formValues.IPv6" id="container_ipv6" placeholder="e.g. a:b:c:d::1234">
  430. </div>
  431. </div>
  432. <!-- !ipv6-input -->
  433. <!-- extra-hosts-variables -->
  434. <div class="form-group">
  435. <div class="col-sm-12" style="margin-top: 5px;">
  436. <label class="control-label text-left">Hosts file entries</label>
  437. <span class="label label-default interactive" style="margin-left: 10px;" ng-click="addExtraHost()">
  438. <i class="fa fa-plus-circle" aria-hidden="true"></i> add additional entry
  439. </span>
  440. </div>
  441. <!-- extra-hosts-input-list -->
  442. <div class="col-sm-12 form-inline" style="margin-top: 10px;">
  443. <div ng-repeat="variable in formValues.ExtraHosts" style="margin-top: 2px;">
  444. <div class="input-group col-sm-5 input-group-sm">
  445. <span class="input-group-addon">value</span>
  446. <input type="text" class="form-control" ng-model="variable.value" placeholder="e.g. host:IP">
  447. </div>
  448. <button class="btn btn-sm btn-danger" type="button" ng-click="removeExtraHost($index)">
  449. <i class="fa fa-trash" aria-hidden="true"></i>
  450. </button>
  451. </div>
  452. </div>
  453. <!-- !extra-hosts-input-list -->
  454. </div>
  455. <!-- !extra-hosts-variables -->
  456. </form>
  457. </div>
  458. <!-- !tab-network -->
  459. <!-- tab-labels -->
  460. <div class="tab-pane" id="labels">
  461. <form class="form-horizontal" style="margin-top: 15px;">
  462. <!-- labels -->
  463. <div class="form-group">
  464. <div class="col-sm-12" style="margin-top: 5px;">
  465. <label class="control-label text-left">Labels</label>
  466. <span class="label label-default interactive" style="margin-left: 10px;" ng-click="addLabel()">
  467. <i class="fa fa-plus-circle" aria-hidden="true"></i> add label
  468. </span>
  469. </div>
  470. <!-- labels-input-list -->
  471. <div class="col-sm-12 form-inline" style="margin-top: 10px;">
  472. <div ng-repeat="label in formValues.Labels" style="margin-top: 2px;">
  473. <div class="input-group col-sm-5 input-group-sm">
  474. <span class="input-group-addon">name</span>
  475. <input type="text" class="form-control" ng-model="label.name" placeholder="e.g. com.example.foo">
  476. </div>
  477. <div class="input-group col-sm-5 input-group-sm">
  478. <span class="input-group-addon">value</span>
  479. <input type="text" class="form-control" ng-model="label.value" placeholder="e.g. bar">
  480. </div>
  481. <button class="btn btn-sm btn-danger" type="button" ng-click="removeLabel($index)">
  482. <i class="fa fa-trash" aria-hidden="true"></i>
  483. </button>
  484. </div>
  485. </div>
  486. <!-- !labels-input-list -->
  487. </div>
  488. <!-- !labels-->
  489. </form>
  490. </div>
  491. <!-- !tab-labels -->
  492. <!-- tab-env -->
  493. <div class="tab-pane" id="env">
  494. <form class="form-horizontal" style="margin-top: 15px;">
  495. <!-- environment-variables -->
  496. <div class="form-group">
  497. <div class="col-sm-12" style="margin-top: 5px;">
  498. <label class="control-label text-left">Environment variables</label>
  499. <span class="label label-default interactive" style="margin-left: 10px;" ng-click="addEnvironmentVariable()">
  500. <i class="fa fa-plus-circle" aria-hidden="true"></i> add environment variable
  501. </span>
  502. </div>
  503. <!-- environment-variable-input-list -->
  504. <div class="col-sm-12 form-inline" style="margin-top: 10px;">
  505. <div ng-repeat="variable in config.Env" style="margin-top: 2px;">
  506. <div class="input-group col-sm-5 input-group-sm">
  507. <span class="input-group-addon">name</span>
  508. <input type="text" class="form-control" ng-model="variable.name" placeholder="e.g. FOO">
  509. </div>
  510. <div class="input-group col-sm-5 input-group-sm">
  511. <span class="input-group-addon">value</span>
  512. <input type="text" class="form-control" ng-model="variable.value" placeholder="e.g. bar">
  513. </div>
  514. <button class="btn btn-sm btn-danger" type="button" ng-click="removeEnvironmentVariable($index)">
  515. <i class="fa fa-trash" aria-hidden="true"></i>
  516. </button>
  517. </div>
  518. </div>
  519. <!-- !environment-variable-input-list -->
  520. </div>
  521. <!-- !environment-variables -->
  522. </form>
  523. </div>
  524. <!-- !tab-labels -->
  525. <!-- tab-restart-policy -->
  526. <div class="tab-pane" id="restart-policy">
  527. <form class="form-horizontal" style="margin-top: 15px;">
  528. <div class="form-group">
  529. <div class="col-sm-12">
  530. <label class="control-label text-left">
  531. Restart policy
  532. </label>
  533. <div class="btn-group btn-group-sm" style="margin-left: 20px;">
  534. <label class="btn btn-primary" ng-model="config.HostConfig.RestartPolicy.Name" uib-btn-radio="'no'">
  535. Never
  536. </label>
  537. <label class="btn btn-primary" ng-model="config.HostConfig.RestartPolicy.Name" uib-btn-radio="'always'">
  538. Always
  539. </label>
  540. <label class="btn btn-primary" ng-model="config.HostConfig.RestartPolicy.Name" uib-btn-radio="'on-failure'">
  541. On failure
  542. </label>
  543. <label class="btn btn-primary" ng-model="config.HostConfig.RestartPolicy.Name" uib-btn-radio="'unless-stopped'">
  544. Unless stopped
  545. </label>
  546. </div>
  547. </div>
  548. </div>
  549. </form>
  550. </div>
  551. <!-- !tab-restart-policy -->
  552. <!-- tab-runtime-resources -->
  553. <div class="tab-pane" id="runtime-resources">
  554. <form class="form-horizontal" style="margin-top: 15px;">
  555. <div class="col-sm-12 form-section-title">
  556. Runtime
  557. </div>
  558. <!-- privileged-mode -->
  559. <div class="form-group" ng-if="isAdmin || allowPrivilegedMode">
  560. <div class="col-sm-12">
  561. <label for="privileged_mode" class="control-label text-left">
  562. Privileged mode
  563. </label>
  564. <label class="switch" style="margin-left: 20px;">
  565. <input type="checkbox" name="privileged_mode" ng-model="config.HostConfig.Privileged"><i></i>
  566. </label>
  567. </div>
  568. </div>
  569. <!-- !privileged-mode -->
  570. <!-- runtimes -->
  571. <div class="form-group">
  572. <label for="container_runtime" class="col-sm-1 control-label text-left">Runtime</label>
  573. <div class="col-sm-11">
  574. <select class="form-control" ng-model="config.HostConfig.Runtime"
  575. id="container_runtime" ng-options="runtime for runtime in availableRuntimes">
  576. <option selected value="">Default</option>
  577. </select>
  578. </div>
  579. </div>
  580. <!-- !runtimes -->
  581. </form>
  582. <form class="form-horizontal" style="margin-top: 15px;">
  583. <!-- devices -->
  584. <div class="form-group">
  585. <div class="col-sm-12" style="margin-top: 5px;">
  586. <label class="control-label text-left">Devices</label>
  587. <span class="label label-default interactive" style="margin-left: 10px;" ng-click="addDevice()">
  588. <i class="fa fa-plus-circle" aria-hidden="true"></i> add device
  589. </span>
  590. </div>
  591. <!-- devices-input-list -->
  592. <div class="col-sm-12 form-inline" style="margin-top: 10px;">
  593. <div ng-repeat="device in config.HostConfig.Devices" style="margin-top: 2px;">
  594. <div class="input-group col-sm-5 input-group-sm">
  595. <span class="input-group-addon">host</span>
  596. <input type="text" class="form-control" ng-model="device.pathOnHost" placeholder="e.g. /dev/tty0">
  597. </div>
  598. <div class="input-group col-sm-5 input-group-sm">
  599. <span class="input-group-addon">container</span>
  600. <input type="text" class="form-control" ng-model="device.pathInContainer" placeholder="e.g. /dev/tty0">
  601. </div>
  602. <button class="btn btn-sm btn-danger" type="button" ng-click="removeDevice($index)">
  603. <i class="fa fa-trash" aria-hidden="true"></i>
  604. </button>
  605. </div>
  606. </div>
  607. <!-- !devices-input-list -->
  608. </div>
  609. <!-- !devices-->
  610. <div class="col-sm-12 form-section-title">
  611. Resources
  612. </div>
  613. <!-- memory-reservation-input -->
  614. <div class="form-group">
  615. <label for="memory-reservation" class="col-sm-3 col-lg-2 control-label text-left" style="margin-top: 20px;">
  616. Memory reservation
  617. </label>
  618. <div class="col-sm-3">
  619. <slider model="formValues.MemoryReservation" floor="0" ceil="state.sliderMaxMemory" step="256" ng-if="state.sliderMaxMemory"></slider>
  620. </div>
  621. <div class="col-sm-2">
  622. <input type="number" min="0" class="form-control" ng-model="formValues.MemoryReservation" id="memory-reservation">
  623. </div>
  624. <div class="col-sm-4">
  625. <p class="small text-muted" style="margin-top: 7px;">
  626. Memory soft limit (<b>MB</b>)
  627. </p>
  628. </div>
  629. </div>
  630. <!-- !memory-reservation-input -->
  631. <!-- memory-limit-input -->
  632. <div class="form-group">
  633. <label for="memory-limit" class="col-sm-3 col-lg-2 control-label text-left" style="margin-top: 20px;">
  634. Memory limit
  635. </label>
  636. <div class="col-sm-3">
  637. <slider model="formValues.MemoryLimit" floor="0" ceil="state.sliderMaxMemory" step="256" ng-if="state.sliderMaxMemory"></slider>
  638. </div>
  639. <div class="col-sm-2">
  640. <input type="number" min="0" class="form-control" ng-model="formValues.MemoryLimit" id="memory-limit">
  641. </div>
  642. <div class="col-sm-4">
  643. <p class="small text-muted" style="margin-top: 7px;">
  644. Memory limit (<b>MB</b>)
  645. </p>
  646. </div>
  647. </div>
  648. <!-- !memory-limit-input -->
  649. <!-- cpu-limit-input -->
  650. <div class="form-group">
  651. <label for="cpu-limit" class="col-sm-3 col-lg-2 control-label text-left" style="margin-top: 20px;">
  652. CPU limit
  653. </label>
  654. <div class="col-sm-5">
  655. <slider model="formValues.CpuLimit" floor="0" ceil="state.sliderMaxCpu" step="0.25" precision="2" ng-if="state.sliderMaxCpu"></slider>
  656. </div>
  657. <div class="col-sm-4" style="margin-top: 20px;">
  658. <p class="small text-muted">
  659. Maximum CPU usage
  660. </p>
  661. </div>
  662. </div>
  663. <!-- !cpu-limit-input -->
  664. </form>
  665. </div>
  666. <!-- !tab-runtime-resources -->
  667. <!-- tab-container-capabilities -->
  668. <div class="tab-pane" id="container-capabilities">
  669. <container-capabilities capabilities="formValues.capabilities" ></container-capabilities>
  670. </div>
  671. <!-- !tab-container-capabilities -->
  672. </div>
  673. </rd-widget-body>
  674. </rd-widget>
  675. </div>
  676. </div>