feat(P4): precompute移植+app.js sources双向回填+回归1003/1003+验收体积/文件/data.json

2026-09-12 14:18:41 +08:00
parent 16f365a045
commit c65a69c34e
401 changed files with 22932 additions and 140 deletions
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Aurora Admin · NumberRangeInput（普通 H5）</title>
+  <link rel="stylesheet" href="../.design_library/aurora-admin/colors_and_type.css" />
+  <link rel="stylesheet" href="NumberRangeInput.css" />
+  <style>body{margin:0;padding:24px;background: var(--au-color-page-bg);}</style>
+</head>
+<body>
+  <div class="aa-numrange" role="group" id="app">
+    <input type="number" id="min" placeholder="最小" />
+    <span class="aa-numrange-sep">—</span>
+    <input type="number" id="max" placeholder="最大" />
+    <span class="aa-numrange-unit">元</span>
+    <span class="aa-numrange-msg" role="group" id="msg"></span>
+  </div>
+
+  <script>
+    var root = document.getElementById('app');
+    var minEl = document.getElementById('min');
+    var maxEl = document.getElementById('max');
+    var msg = document.getElementById('msg');
+    var STEP = 1, MIN = 0, MAX = 10000;
+
+    function validate() {
+      var a = parseFloat(minEl.value);
+      var b = parseFloat(maxEl.value);
+      var err = '';
+      if (minEl.value !== '' && (a < MIN || a > MAX)) err = '最小值需在 ' + MIN + '~' + MAX;
+      else if (maxEl.value !== '' && (b < MIN || b > MAX)) err = '最大值需在 ' + MIN + '~' + MAX;
+      else if (minEl.value !== '' && maxEl.value !== '' && a > b) err = '最小值不能大于最大值';
+      root.classList.toggle('is-error', !!err);
+      msg.textContent = err;
+      return !err;
+    }
+    [minEl, maxEl].forEach(function (el) {
+      el.addEventListener('input', validate);
+      el.addEventListener('blur', function () {
+        var v = parseFloat(el.value);
+        if (!isNaN(v)) el.value = Math.round(v / STEP) * STEP;
+        validate();
+      });
+    });
+  </script>
+</body>
+</html>
@@ -0,0 +1,41 @@
+import React, { useState } from 'react';
+import './NumberRangeInput.css';
+
+export default function NumberRangeInput({
+  value = ['', ''], step = 1, min = -Infinity, max = Infinity,
+  separator = '—', unit = '', placeholder = ['最小', '最大'], onChange, onError
+}) {
+  const [errorMsg, setErrorMsg] = useState('');
+
+  function validate(arr) {
+    const a = parseFloat(arr[0]), b = parseFloat(arr[1]);
+    let err = '';
+    if (arr[0] !== '' && (a < min || a > max)) err = `最小值需在 ${min}~${max}`;
+    else if (arr[1] !== '' && (b < min || b > max)) err = `最大值需在 ${min}~${max}`;
+    else if (arr[0] !== '' && arr[1] !== '' && a > b) err = '最小值不能大于最大值';
+    setErrorMsg(err);
+    onError && onError(err);
+  }
+  function onMin(e) {
+    const arr = [e.target.value, value[1]];
+    validate(arr);
+    onChange && onChange(arr);
+  }
+  function onMax(e) {
+    const arr = [value[0], e.target.value];
+    validate(arr);
+    onChange && onChange(arr);
+  }
+
+  return (
+    <div className={'aa-numrange' + (errorMsg ? ' is-error' : '')}>
+      <input type="number" value={value[0]} step={step} min={min} max={max}
+             placeholder={placeholder[0]} onChange={onMin} />
+      <span className="aa-numrange-sep">{separator}</span>
+      <input type="number" value={value[1]} step={step} min={min} max={max}
+             placeholder={placeholder[1]} onChange={onMax} />
+      {unit ? <span className="aa-numrange-unit">{unit}</span> : null}
+      {errorMsg ? <span className="aa-numrange-msg">{errorMsg}</span> : null}
+    </div>
+  );
+}
@@ -0,0 +1,50 @@
+<template>
+  <div class="aa-numrange" :class="{ 'is-error': !!errorMsg }">
+    <input type="number" :value="value[0]" :step="step" :min="min" :max="max"
+           :placeholder="placeholder[0]" @input="onMin" />
+    <span class="aa-numrange-sep">{{ separator }}</span>
+    <input type="number" :value="value[1]" :step="step" :min="min" :max="max"
+           :placeholder="placeholder[1]" @input="onMax" />
+    <span class="aa-numrange-unit" v-if="unit">{{ unit }}</span>
+    <span class="aa-numrange-msg" v-if="errorMsg">{{ errorMsg }}</span>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AaNumberRangeInput',
+  props: {
+    value: { type: Array, default: function () { return ['', '']; } },
+    step: { type: Number, default: 1 },
+    min: { type: Number, default: -Infinity },
+    max: { type: Number, default: Infinity },
+    separator: { type: String, default: '—' },
+    unit: { type: String, default: '' },
+    placeholder: { type: Array, default: function () { return ['最小', '最大']; } }
+  },
+  data: function () { return { errorMsg: '' }; },
+  methods: {
+    emit: function (arr) { this.$emit('input', arr); },
+    onMin: function (e) {
+      var arr = [e.target.value, this.value[1]];
+      this.validate(arr);
+      this.emit(arr);
+    },
+    onMax: function (e) {
+      var arr = [this.value[0], e.target.value];
+      this.validate(arr);
+      this.emit(arr);
+    },
+    validate: function (arr) {
+      var a = parseFloat(arr[0]), b = parseFloat(arr[1]), err = '';
+      if (arr[0] !== '' && (a < this.min || a > this.max)) err = '最小值需在 ' + this.min + '~' + this.max;
+      else if (arr[1] !== '' && (b < this.min || b > this.max)) err = '最大值需在 ' + this.min + '~' + this.max;
+      else if (arr[0] !== '' && arr[1] !== '' && a > b) err = '最小值不能大于最大值';
+      this.errorMsg = err;
+      this.$emit('error', err);
+    }
+  }
+};
+</script>
+
+<style src="./NumberRangeInput.css"></style>
@@ -0,0 +1,48 @@
+<template>
+  <div class="aa-numrange" :class="{ 'is-error': !!errorMsg }">
+    <input type="number" :value="modelValue[0]" :step="step" :min="min" :max="max"
+           :placeholder="placeholder[0]" @input="onMin" />
+    <span class="aa-numrange-sep">{{ separator }}</span>
+    <input type="number" :value="modelValue[1]" :step="step" :min="min" :max="max"
+           :placeholder="placeholder[1]" @input="onMax" />
+    <span class="aa-numrange-unit" v-if="unit">{{ unit }}</span>
+    <span class="aa-numrange-msg" v-if="errorMsg">{{ errorMsg }}</span>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const props = defineProps({
+  modelValue: { type: Array, default: () => ['', ''] },
+  step: { type: Number, default: 1 },
+  min: { type: Number, default: -Infinity },
+  max: { type: Number, default: Infinity },
+  separator: { type: String, default: '—' },
+  unit: { type: String, default: '' },
+  placeholder: { type: Array, default: () => ['最小', '最大'] }
+});
+const emit = defineEmits(['update:modelValue', 'error']);
+const errorMsg = ref('');
+
+function validate(arr) {
+  const a = parseFloat(arr[0]), b = parseFloat(arr[1]);
+  let err = '';
+  if (arr[0] !== '' && (a < props.min || a > props.max)) err = `最小值需在 ${props.min}~${props.max}`;
+  else if (arr[1] !== '' && (b < props.min || b > props.max)) err = `最大值需在 ${props.min}~${props.max}`;
+  else if (arr[0] !== '' && arr[1] !== '' && a > b) err = '最小值不能大于最大值';
+  errorMsg.value = err;
+  emit('error', err);
+}
+function onMin(e) {
+  const arr = [e.target.value, props.modelValue[1]];
+  validate(arr);
+  emit('update:modelValue', arr);
+}
+function onMax(e) {
+  const arr = [props.modelValue[0], e.target.value];
+  validate(arr);
+  emit('update:modelValue', arr);
+}
+</script>
+
+<style src="./NumberRangeInput.css"></style>