luci/applications/luci-app-dockerman/luasrc/view/dockerman/images_import.htm

<input type="text" class="cbi-input-text" name="isrc" placeholder="http://host/image.tar" id="isrc" />
<input type="text" class="cbi-input-text" name="itag" placeholder="repository:tag" id="itag" />
<div style="display: inline-block;">
	<input type="button"" class="btn cbi-button cbi-button-add" id="btnimport" name="import" value="<%:Import%>" />
	<input type="file" id="file_import" style="visibility:hidden; position: absolute;top: 0px; left: 0px;" />
</div>

<script>
	let btnImport = document.getElementById('btnimport')
	let valISrc = document.getElementById('isrc')
	let valITag = document.getElementById('itag')
	btnImport.onclick = function (e) {
		if (valISrc.value == "") {
			document.getElementById("file_import").click()
			return
		}
		else {
			let formData = new FormData()
			formData.append('src', valISrc.value)
			formData.append('tag', valITag.value)
			let xhr = new XMLHttpRequest()
			uci_confirm_docker()
			xhr.open("POST", "<%=luci.dispatcher.build_url('admin/docker/images_import')%>", true)
			xhr.onload = function () {
				location.reload()
			}
			xhr.send(formData)
		}
	}

	let fileimport = document.getElementById('file_import')
	fileimport.onchange = function (e) {
		let fileimport = document.getElementById('file_import')
		if (!fileimport.value) {
			return
		}
		let valITag = document.getElementById('itag')
		let fileName = fileimport.files[0].name
		let formData = new FormData()
		formData.append('upload-filename', fileName)
		formData.append('tag', valITag.value)
		formData.append('upload-archive', fileimport.files[0])
		let xhr = new XMLHttpRequest()
		uci_confirm_docker()
		xhr.open("POST", "<%=luci.dispatcher.build_url('admin/docker/images_import')%>", true)
		xhr.onload = function () {
			fileimport.value = ''
			location.reload()
		}
		xhr.send(formData)
	}

	let new_tag = function (image_id) {
		let new_tag = prompt("<%:New tag%>\n<%:Image%>" + "ID: " + image_id + "\n<%:Please input new tag%>:", "")
		if (new_tag) {
			(new XHR()).post("<%=luci.dispatcher.build_url('admin/docker/images_tag')%>",
				{
					id: image_id,
					tag: new_tag
				},
				function (r) {
					if (r.status == 201) {
						location.reload()
					}
					else {
						docker_status_message('warning', 'Image: untagging ' + tag + '...fail code:' + r.status + r.statusText);
						document.getElementById('docker_apply_overlay').addEventListener(
							"click",
							(e)=>{
								docker_status_message()
							}
						)
					}
				}
			)
		}
	}

	let un_tag = function (tag) {
		if (tag.match("<none>"))
			return
		if (confirm("<%:Remove tag%>: " + tag + " ?")) {
			(new XHR()).post("<%=luci.dispatcher.build_url('admin/docker/images_untag')%>",
				{
					tag: tag
				},
				function (r) {
					if (r.status == 200) {
						location.reload()
					}
					else {
						docker_status_message('warning', 'Image: untagging ' + tag + '...fail code:' + r.status + r.statusText);
						document.getElementById('docker_apply_overlay').addEventListener(
							"click",
							(e)=>{
								docker_status_message()
							}
						)
					}
				}
			)
		}
	}
</script>