|
@@ -99,18 +99,38 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
-
|
|
|
+ <!--插入特殊字符-->
|
|
|
+ <el-dialog v-model="specialModal" title="插入特殊字符" width="600px" custom-class="hc-modal-border">
|
|
|
+ <el-form ref="specialFormRef" :model="specialFormModel" :rules="specialFormRules" label-width="0px" size="large" class="mb-6">
|
|
|
+ <el-form-item prop="val" class="special-form-item">
|
|
|
+ <el-input v-model="specialFormModel.val" ref="specialRef" id="specialId" placeholder="请选择特殊字符代码" clearable @blur="specialInputBlur"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <el-row :gutter="20" style="margin: -10px;">
|
|
|
+ <el-col :span="3" style="padding: 10px;" v-for="item in specialCharacters">
|
|
|
+ <div class="special-box" @click="specialClick">
|
|
|
+ <span class="font-EUDC" :title="`字符代码(C):${item !== 'K̅'?item.slice(2,7):'K̅'}`" v-html="item"/>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button size="large" @click="specialModal = false">取消</el-button>
|
|
|
+ <el-button type="primary" hc-btn @click="specialNodeClick">确认插入</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import {ref,watch,nextTick,onMounted} from "vue";
|
|
|
+import {ref,watch,nextTick} from "vue";
|
|
|
import notableform from '~src/assets/view/notableform.svg';
|
|
|
import {HTableForm} from "~src/plugins/HTableForm"
|
|
|
-import {isString, getObjNullValue, getArrValue} from "vue-utils-plus"
|
|
|
+import {isType, formValidate} from "vue-utils-plus"
|
|
|
import wbsApi from "~api/data-fill/wbs"
|
|
|
import HcUpload from "./HcUpload.vue"
|
|
|
import {NDropdown} from 'naive-ui';
|
|
|
-
|
|
|
+const {isString, getObjNullValue, getArrValue} = isType()
|
|
|
//初始
|
|
|
const props = defineProps({
|
|
|
datas: {
|
|
@@ -229,6 +249,18 @@ const getBussDataInfo = async (pkeyId, index) => {
|
|
|
const { data } = await wbsApi.getBussDataInfo({pkeyId: pkeyId})
|
|
|
const resData = getObjNullValue(data?.data)
|
|
|
if (resData) {
|
|
|
+ //处理日期范围数据
|
|
|
+ const pickerKey = resData['pickerKey'] || ''
|
|
|
+ const pickerKeys = pickerKey.split(',')
|
|
|
+ for (let i = 0; i < pickerKeys.length; i++) {
|
|
|
+ const val = resData[pickerKeys[i]] || ''
|
|
|
+ if (val) {
|
|
|
+ const data = val.replace(/'/g,'"');
|
|
|
+ resData[pickerKeys[i]] = toParse(data) || []
|
|
|
+ } else {
|
|
|
+ resData[pickerKeys[i]] = []
|
|
|
+ }
|
|
|
+ }
|
|
|
//有数据,关联数据
|
|
|
const InitObj = getFormDataInit(pkeyId)
|
|
|
formData.value[index] = { ...InitObj, ...resData }
|
|
@@ -237,6 +269,15 @@ const getBussDataInfo = async (pkeyId, index) => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+//字符串转数组或JSON
|
|
|
+const toParse = (val) => {
|
|
|
+ try {
|
|
|
+ return JSON.parse(val)
|
|
|
+ } catch (e) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
//单个保存
|
|
|
const tableFormSaveClick = async (item,index) => {
|
|
|
const res = await saveExcelBussData(item,index)
|
|
@@ -379,7 +420,6 @@ const uploadChange = async ({type}) => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-
|
|
|
//相关变量
|
|
|
const tableFormItemNode = ref({})
|
|
|
const tableFormMenuShow = ref(false)
|
|
@@ -415,7 +455,7 @@ const handleMenuSelect = (key) => {
|
|
|
if (key === 'IDVF') {
|
|
|
IDVFModal.value = true
|
|
|
} else if (key === 'special') {
|
|
|
- //specialModalShow()
|
|
|
+ specialModalShow()
|
|
|
} else if (key === 'CTD') {
|
|
|
CTDModal.value = true
|
|
|
}
|
|
@@ -443,6 +483,94 @@ const formIDVFRules = {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+//插入特殊字符
|
|
|
+const specialModal = ref(false)
|
|
|
+const specialCharacters = ref([
|
|
|
+ '', "", "", "", '≤', '≥', '℃',
|
|
|
+ '①', '②', '③', '④', '⑤', '⑥', '⑦', '⑧', '⑨', '⑩', '⑪', '⑫',
|
|
|
+ '⑬', '⑭', '⑮', '⑯', '⑰', '⑱', '⑲', '⑳',
|
|
|
+ "Ⅰ", "Ⅱ", "Ⅲ", "Ⅳ", "Ⅴ", "Ⅵ", "Ⅶ", "Ⅷ", "Ⅸ", "Ⅹ", "Ⅺ", "Ⅻ","K̅"
|
|
|
+])
|
|
|
+
|
|
|
+//输入框验证
|
|
|
+const specialFormRef = ref(null)
|
|
|
+const specialFormModel = ref({val: ''})
|
|
|
+const specialFormRules = {
|
|
|
+ val: {
|
|
|
+ required: true,
|
|
|
+ trigger: "blur",
|
|
|
+ message: "请选择特殊字符代码"
|
|
|
+ }
|
|
|
+}
|
|
|
+//显示插入特殊字符
|
|
|
+const specialRef = ref(null)
|
|
|
+const specialModalShow = () => {
|
|
|
+ specialFormModel.value.val = ''
|
|
|
+ specialModal.value = true
|
|
|
+ nextTick(() => {
|
|
|
+ specialRef.value?.focus();
|
|
|
+ })
|
|
|
+}
|
|
|
+//失去焦点
|
|
|
+const specialPos = ref({start: 0, end: 0})
|
|
|
+const specialInputBlur = (e) => {
|
|
|
+ specialPos.value = {
|
|
|
+ start: e?.target?.selectionStart || 0,
|
|
|
+ end: e?.target?.selectionEnd || 0
|
|
|
+ }
|
|
|
+}
|
|
|
+//点击符号
|
|
|
+const specialClick = (event) => {
|
|
|
+ const text = event?.target?.innerText ?? ''
|
|
|
+ const start = specialPos.value.start
|
|
|
+ specialFormModel.value.val = inputPosInsert({
|
|
|
+ pos: specialPos.value,
|
|
|
+ input: specialFormModel.value.val,
|
|
|
+ val: text
|
|
|
+ })
|
|
|
+ specialRef.value?.focus();
|
|
|
+ let posVal = start + text.length;
|
|
|
+ setSelectionRange('specialId', posVal)
|
|
|
+}
|
|
|
+
|
|
|
+//确认插入
|
|
|
+const specialNodeClick = async () => {
|
|
|
+ const res = await formValidate(specialFormRef.value)
|
|
|
+ if (res) {
|
|
|
+ const item = tableFormItemNode.value
|
|
|
+ const form = formData.value[item.index]
|
|
|
+ const val = specialFormModel.value.val ?? ''
|
|
|
+ formData.value[item.index][item.KeyName] = inputPosInsert({
|
|
|
+ pos: {start: item.startPos, end: item.endPos},
|
|
|
+ input: form[item.KeyName],
|
|
|
+ val: val
|
|
|
+ })
|
|
|
+ specialModal.value = false
|
|
|
+ specialRef.value?.focus();
|
|
|
+ let posVal = item.startPos + val.length;
|
|
|
+ setSelectionRange('specialId', posVal)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//输入框插入内容
|
|
|
+const inputPosInsert = ({pos, input, val}) => {
|
|
|
+ const startPos = pos.start, endPos = pos.end
|
|
|
+ if (!input) return val; //输入框无内容时,直接覆盖
|
|
|
+ if (input.length === startPos) {
|
|
|
+ //光标在最后时,直接追加
|
|
|
+ return input + val
|
|
|
+ } else {
|
|
|
+ //光标在其它位置时,裁取文本,并拼接
|
|
|
+ return input.substring(0, startPos) + val + input.substring(endPos, input.length)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//设置光标位置
|
|
|
+const setSelectionRange = (id, pos) => {
|
|
|
+ nextTick(() => {
|
|
|
+ document.getElementById(id)?.setSelectionRange(pos,pos)
|
|
|
+ })
|
|
|
+}
|
|
|
|
|
|
//事件
|
|
|
const emit = defineEmits(['renew','offsetTop'])
|
|
@@ -556,17 +684,17 @@ const renewData = () => {
|
|
|
align-items: center;
|
|
|
border: 1px solid #eee;
|
|
|
border-radius: 3px;
|
|
|
- height: 60px;
|
|
|
- cursor: default;
|
|
|
+ height: 52px;
|
|
|
+ width: 52px;
|
|
|
+ cursor: pointer;
|
|
|
user-select: none;
|
|
|
transition: color .3s, background-color .3s;
|
|
|
&:hover {
|
|
|
color: var(--el-color-primary);
|
|
|
- background-color: var(--el-color-primary-light-3);
|
|
|
+ background-color: var(--el-color-primary-light-8);
|
|
|
}
|
|
|
.font-EUDC {
|
|
|
- font-size: 30px;
|
|
|
- cursor: default;
|
|
|
+ font-size: 22px;
|
|
|
}
|
|
|
}
|
|
|
</style>
|
|
@@ -615,7 +743,6 @@ const renewData = () => {
|
|
|
.data-fill-table-form-box {
|
|
|
td {
|
|
|
padding: 6px;
|
|
|
- font-family: "EUDC", 宋体, v-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
|
|
|
.el-input {
|
|
|
background-color: #ffffff !important;
|
|
|
border-radius: 3px;
|
|
@@ -632,4 +759,11 @@ const renewData = () => {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+//插入特殊字符弹窗的输入框
|
|
|
+.data-fill-list-box .data-fill-table-form-box td,
|
|
|
+.data-fill-list-box .data-fill-table-form-box td .el-input .el-input__wrapper .el-input__inner,
|
|
|
+.el-form-item.special-form-item .el-form-item__content .el-input .el-input__wrapper .el-input__inner {
|
|
|
+ font-family: "EUDC", 宋体, v-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
|
|
+}
|
|
|
</style>
|